summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--src/_apply-vars.scss10
-rw-r--r--src/objects/_dialog.scss9
-rw-r--r--tpl/objects/dialog.pug12
3 files changed, 18 insertions, 13 deletions
diff --git a/src/_apply-vars.scss b/src/_apply-vars.scss
index 5cf5742..0fbc5e3 100644
--- a/src/_apply-vars.scss
+++ b/src/_apply-vars.scss
@@ -45,6 +45,16 @@
45 } 45 }
46} 46}
47 47
48@include iro.bem-theme('lo') {
49 @include iro.props-assign('colors');
50 @include iro.props-assign('palette-light-lo');
51
52 @media (prefers-color-scheme: dark) {
53 @include iro.props-assign('colors-dark');
54 @include iro.props-assign('palette-dark-lo');
55 }
56}
57
48@include iro.bem-theme('up') { 58@include iro.bem-theme('up') {
49 @include iro.props-assign('colors'); 59 @include iro.props-assign('colors');
50 @include iro.props-assign('palette-light-hi'); 60 @include iro.props-assign('palette-light-hi');
diff --git a/src/objects/_dialog.scss b/src/objects/_dialog.scss
index 8a60b51..40fe7c0 100644
--- a/src/objects/_dialog.scss
+++ b/src/objects/_dialog.scss
@@ -69,9 +69,8 @@
69 } 69 }
70 70
71 @include iro.bem-elem('header') { 71 @include iro.bem-elem('header') {
72 grid-area: sidebar-header / sidebar-header / header / header; 72 grid-area: sidebar-header / sidebar-header / header / header;
73 padding: fn.dim(--header --pad-y) fn.dim(--header --pad-x); 73 padding: fn.dim(--header --pad-y) fn.dim(--header --pad-x);
74 border-bottom: 1px solid fn.color(--border);
75 74
76 @include iro.bem-modifier('sidebar') { 75 @include iro.bem-modifier('sidebar') {
77 grid-area: sidebar-header; 76 grid-area: sidebar-header;
@@ -122,10 +121,6 @@
122 } 121 }
123 122
124 @include iro.bem-modifier('flat') { 123 @include iro.bem-modifier('flat') {
125 @include iro.bem-elem('header') {
126 border-bottom: 0;
127 }
128
129 @include iro.bem-elem('body') { 124 @include iro.bem-elem('body') {
130 padding-top: 0; 125 padding-top: 0;
131 } 126 }
diff --git a/tpl/objects/dialog.pug b/tpl/objects/dialog.pug
index 7ac9c3d..55dc8ad 100644
--- a/tpl/objects/dialog.pug
+++ b/tpl/objects/dialog.pug
@@ -17,17 +17,17 @@ mixin dialog(title)
17 17
18 let headerClass = { 18 let headerClass = {
19 'o-dialog__header': true, 19 'o-dialog__header': true,
20 'u-themed': !attributes.flat, 20 'l-media': true,
21 't-down': !attributes.flat,
22 'l-media': true,
23 } 21 }
24 22
25 let sidebarHeaderClass = { 23 let sidebarHeaderClass = {
24 'o-dialog__header': true,
26 'o-dialog__header--sidebar': true, 25 'o-dialog__header--sidebar': true,
26 'u-themed': true,
27 't-lo': true,
28 'l-media': true,
27 } 29 }
28 30
29 Object.assign(sidebarHeaderClass, headerClass);
30
31 let bodyClass = { 31 let bodyClass = {
32 'o-dialog__body': true 32 'o-dialog__body': true
33 } 33 }
@@ -44,7 +44,7 @@ mixin dialog(title)
44 +div-heading('xl')(class='o-dialog__title l-media__block l-media__block--main')= attributes.sidebarTitle 44 +div-heading('xl')(class='o-dialog__title l-media__block l-media__block--main')= attributes.sidebarTitle
45 45
46 if slots.sidebar 46 if slots.sidebar
47 .o-dialog__sidebar.l-overflow 47 .o-dialog__sidebar.l-overflow.u-themed.t-lo
48 - slots.sidebar() 48 - slots.sidebar()
49 49
50 div(class=headerClass) 50 div(class=headerClass)