web: update styling of notification drawer to match rest
This commit is contained in:
parent
d637bd0bf9
commit
0b41cb84f0
|
@ -228,4 +228,11 @@ select[multiple] {
|
|||
.form-control-static {
|
||||
color: var(--ak-dark-foreground);
|
||||
}
|
||||
/* notifications */
|
||||
.pf-c-notification-drawer {
|
||||
--pf-c-notification-drawer--BackgroundColor: var(--ak-dark-background);
|
||||
}
|
||||
.pf-c-notification-drawer__header {
|
||||
background-color: var(--ak-dark-background-lighter);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -17,8 +17,10 @@ export class NotificationDrawer extends LitElement {
|
|||
return COMMON_STYLES.concat(
|
||||
css`
|
||||
.pf-c-notification-drawer__header {
|
||||
height: 82px;
|
||||
height: 114px;
|
||||
padding: var(--pf-c-page__main-section--PaddingTop) var(--pf-c-page__main-section--PaddingRight) var(--pf-c-page__main-section--PaddingBottom) var(--pf-c-page__main-section--PaddingLeft);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
`
|
||||
);
|
||||
|
@ -72,13 +74,13 @@ export class NotificationDrawer extends LitElement {
|
|||
}
|
||||
return html`<div class="pf-c-drawer__body pf-m-no-padding">
|
||||
<div class="pf-c-notification-drawer">
|
||||
<div class="pf-c-notification-drawer__header">
|
||||
<h1 class="pf-c-notification-drawer__header-title">
|
||||
<div class="pf-c-notification-drawer__header pf-c-content">
|
||||
<h1>
|
||||
${gettext("Notifications")}
|
||||
</h1>
|
||||
<span class="pf-c-notification-drawer__header-status">
|
||||
<p>
|
||||
${gettext(`${this.unread} unread`)}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="pf-c-notification-drawer__body">
|
||||
<ul class="pf-c-notification-drawer__list">
|
||||
|
|
Reference in a new issue