|
17 | 17 | --main-gutter-h-right: var(--gutter-h);
|
18 | 18 | }
|
19 | 19 |
|
20 |
| - &--force-sidebar-wrap { |
| 20 | + &--force-sidebar-wrap, |
| 21 | + &:has(.document-fields__sidebar-wrap .render-fields:empty) { |
21 | 22 | --sidebar-gutter-h-left: var(--gutter-h);
|
22 | 23 | --sidebar-gutter-h-right: var(--gutter-h);
|
23 | 24 | --main-gutter-h-left: var(--gutter-h);
|
24 | 25 | --main-gutter-h-right: var(--gutter-h);
|
25 | 26 | }
|
26 | 27 |
|
27 | 28 | &--has-sidebar {
|
| 29 | + --main-width: 66.66%; |
| 30 | + --main-border: 1px solid var(--theme-elevation-100); |
| 31 | + --main-field-margin: calc(var(--base) * -2); |
| 32 | + |
| 33 | + &:has(.document-fields__sidebar-wrap .render-fields:empty) { |
| 34 | + --main-width: 100%; |
| 35 | + --main-border: none; |
| 36 | + --main-field-margin: initial; |
| 37 | + } |
| 38 | + |
28 | 39 | .document-fields {
|
29 | 40 | &__main {
|
30 |
| - width: 66.66%; |
| 41 | + width: var(--main-width); |
31 | 42 | }
|
32 | 43 |
|
33 | 44 | &__edit {
|
|
36 | 47 | [dir='ltr'] & {
|
37 | 48 | top: 0;
|
38 | 49 | right: 0;
|
39 |
| - border-right: 1px solid var(--theme-elevation-100); |
| 50 | + border-right: var(--main-border); |
40 | 51 | }
|
41 | 52 |
|
42 | 53 | [dir='rtl'] & {
|
43 | 54 | top: 0;
|
44 | 55 | left: 0;
|
45 |
| - border-left: 1px solid var(--theme-elevation-100); |
| 56 | + border-left: var(--main-border); |
46 | 57 | }
|
47 | 58 | }
|
48 | 59 |
|
49 | 60 | &__fields {
|
50 | 61 | & > .tabs-field,
|
51 | 62 | & > .group-field {
|
52 |
| - margin-right: calc(var(--base) * -2); |
| 63 | + margin-right: var(--main-field-margin); |
53 | 64 | }
|
54 | 65 | }
|
55 | 66 | }
|
|
70 | 81 | }
|
71 | 82 |
|
72 | 83 | &__sidebar-wrap {
|
73 |
| - position: sticky; |
74 |
| - top: var(--doc-controls-height); |
75 |
| - width: 33.33%; |
76 |
| - height: calc(100vh - var(--doc-controls-height)); |
77 |
| - min-width: var(--doc-sidebar-width); |
78 |
| - flex-shrink: 0; |
| 84 | + &:has(.render-fields:empty) { |
| 85 | + --sidebar-wrap-width: 0; |
| 86 | + --sidebar-wrap-min-width: 0; |
| 87 | + --sidebar-wrap-position: initial; |
| 88 | + --sidebar-wrap-top: initial; |
| 89 | + --sidebar-wrap-height: initial; |
| 90 | + --sidebar-wrap-flex-shrink: initial; |
| 91 | + } |
| 92 | + |
| 93 | + position: var(--sidebar-wrap-position, sticky); |
| 94 | + top: var(--sidebar-wrap-top, 0); |
| 95 | + width: var(--sidebar-wrap-width, 33.33%); |
| 96 | + height: var(--sidebar-wrap-height, calc(100vh - var(--doc-controls-height))); |
| 97 | + min-width: var(--sidebar-wrap-min-width, var(--doc-sidebar-width)); |
| 98 | + flex-shrink: var(--sidebar-wrap-flex-shrink, 0); |
79 | 99 | }
|
80 | 100 |
|
81 | 101 | &__sidebar {
|
|
0 commit comments