trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

web: fix Colours for user settings in dark mode

Browse source
This commit is contained in:
Jens Langhammer 2021-03-06 23:00:29 +01:00
parent 0032bb6aee
commit 90d234a458
3 changed files with 11 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
authentik/core/templates/user/settings.html
View file

@ -13,7 +13,7 @@
<p>{% trans "Configure settings relevant to your user profile." %}</p>
</div>
</section>
<ak-tabs vertical="true">
<ak-tabs vertical="true" style="height: 100%;">
<section slot="page-1" data-tab-title="{% trans 'User details' %}" class="pf-c-page__main-section pf-m-no-padding-mobile">
<div class="pf-u-display-flex pf-u-justify-content-center">
<div class="pf-u-w-75">

4
web/src/authentik.css
View file

@ -156,6 +156,10 @@ ak-message {
.pf-c-table__sort-indicator i {
color: var(--ak-dark-foreground) !important;
}
/* tabs, vertical */
.pf-c-tabs__link {
background-color: var(--ak-dark-background-light);
}
/* table, on mobile */
@media screen and (max-width: 1200px) {
.pf-m-grid-xl.pf-c-table tbody:first-of-type {

7
web/src/elements/Tabs.ts
View file

@ -4,6 +4,8 @@ import { ifDefined } from "lit-html/directives/if-defined";
import TabsStyle from "@patternfly/patternfly/components/Tabs/tabs.css";
// @ts-ignore
import GlobalsStyle from "@patternfly/patternfly/base/patternfly-globals.css";
// @ts-ignore
import AKGlobal from "../authentik.css";
import { CURRENT_CLASS } from "../constants";
import { gettext } from "django";
@ -16,7 +18,7 @@ export class Tabs extends LitElement {
vertical = false;
static get styles(): CSSResult[] {
return [GlobalsStyle, TabsStyle, css`
return [GlobalsStyle, TabsStyle, AKGlobal, css`
::slotted(*) {
height: 100%;
flex-grow: 2;
@ -24,6 +26,9 @@ export class Tabs extends LitElement {
:host([vertical]) {
display: flex;
}
:host([vertical]) .pf-c-tabs__list {
height: 100%;
}
`];
}