scb-wc-test 0.1.8 → 0.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/mvc/components/scb-toc/scb-toc-item.js +19 -19
- package/package.json +2 -2
- package/scb-toc/scb-toc-item.js +48 -48
- package/scb-wc-test.bundle.js +14 -14
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import{b as p,n as d,i as h,x as l,t as
|
|
1
|
+
import{b as p,n as d,i as h,x as l,t as b}from"../../vendor/vendor.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-divider/scb-divider.js";import"../../vendor/preload-helper.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var s=customElements.define.bind(customElements);customElements.define=function(o,t,i){try{customElements.get(o)||s(o,t,i)}catch(n){var a=String(n||"");if(a.indexOf("already been used")===-1&&a.indexOf("NotSupportedError")===-1)throw n}}}}catch{}})();var u=Object.defineProperty,m=Object.getOwnPropertyDescriptor,c=(e,s,o,t)=>{for(var i=t>1?void 0:t?m(s,o):s,a=e.length-1,n;a>=0;a--)(n=e[a])&&(i=(t?n(s,o,i):n(i))||i);return t&&i&&u(s,o,i),i};let r=class extends h{constructor(){super(...arguments),this.expanded=!1,this.label="",this.supportingText="",this.itemHref="#",this.divider=!0,this._unique=crypto.randomUUID(),this._slotHasContent=!1,this._onSlotChange=()=>{const e=this.renderRoot.querySelector("slot");this._slotHasContent=!!e&&e.assignedNodes().length>0,this.requestUpdate(),this._updateTabbable()},this.toggleAccordion=()=>{const e=this.closest("scb-toc");e?.hasAttribute("detached")||e.querySelectorAll("scb-toc-item").forEach(t=>{t!==this&&t.expanded&&(t.expanded=!1,this.toggleBottom(t),t.dispatchEvent(new CustomEvent("expanded-changed",{detail:{expanded:!1},bubbles:!0,composed:!0})))});const s=this.expanded;this.expanded=!this.expanded,this.toggleBottom(this),s!==this.expanded&&this.dispatchEvent(new CustomEvent("expanded-changed",{detail:{expanded:this.expanded},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this.addEventListener("slotchange",this._onSlotChange)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("slotchange",this._onSlotChange)}updated(e){e.has("expanded")&&this._updateTabbable()}_updateTabbable(){if(typeof window>"u")return;const e=this.renderRoot.querySelector("slot");if(!e)return;e.assignedElements({flatten:!0}).forEach(o=>{o.matches("a,button,input,select,textarea,[tabindex]")&&(this.expanded?o.removeAttribute("tabindex"):o.setAttribute("tabindex","-1")),o.querySelectorAll?.("a,button,input,select,textarea,[tabindex]").forEach(t=>{const i=t;this.expanded?i.removeAttribute("tabindex"):i.setAttribute("tabindex","-1")})})}toggleBottom(e){const s=e.renderRoot.querySelector(".scb-toc-item-bottom");s&&(e.expanded?(s.style.maxHeight=`${s.scrollHeight}px`,setTimeout(()=>s.style.maxHeight="unset",160)):(s.style.maxHeight=`${s.scrollHeight}px`,requestAnimationFrame(()=>s.style.maxHeight="0")))}_onKeyDown(e){const s=this.closest("scb-toc"),t=Array.from(s?.querySelectorAll("scb-toc-item")||[]).map(n=>n.renderRoot.querySelector(".scb-toc-item")).filter(n=>!!n),i=e.currentTarget,a=t.indexOf(i);switch(e.key){case"Enter":case" ":e.preventDefault(),this.toggleAccordion();break;case"ArrowDown":e.preventDefault(),a<t.length-1&&t[a+1].focus();break;case"ArrowUp":e.preventDefault(),a>0&&t[a-1].focus();break;case"Home":e.preventDefault(),t.length&&t[0].focus();break;case"End":e.preventDefault(),t.length&&t[t.length-1].focus();break}}render(){const e=`bottom-${this._unique}`;return l`
|
|
2
2
|
<div
|
|
3
3
|
class="scb-toc-item"
|
|
4
4
|
role="listitem"
|
|
5
5
|
aria-expanded=${this.expanded}
|
|
6
|
-
aria-controls=${
|
|
6
|
+
aria-controls=${e}
|
|
7
7
|
>
|
|
8
8
|
<div class="scb-toc-item-top">
|
|
9
9
|
<div>
|
|
@@ -20,32 +20,32 @@ import{b as p,n as d,i as h,x as l,t as u}from"../../vendor/vendor.js";import"..
|
|
|
20
20
|
`:""}
|
|
21
21
|
</div>
|
|
22
22
|
<div
|
|
23
|
-
id=${
|
|
23
|
+
id=${e}
|
|
24
24
|
class="scb-toc-item-bottom ${this.expanded?"expanded":""}"
|
|
25
25
|
>
|
|
26
26
|
<slot @slotchange=${this._onSlotChange}></slot>
|
|
27
27
|
</div>
|
|
28
28
|
${this.divider?l`<scb-divider></scb-divider>`:""}
|
|
29
29
|
</div>
|
|
30
|
-
`}};
|
|
30
|
+
`}};r.styles=[p`
|
|
31
31
|
.scb-toc-item-top{
|
|
32
|
-
padding:
|
|
32
|
+
padding: var(--spacing-5) var(--spacing-3);
|
|
33
33
|
display: flex;
|
|
34
|
-
gap:
|
|
34
|
+
gap: var(--spacing-5);
|
|
35
35
|
flex-direction: row;
|
|
36
36
|
}
|
|
37
37
|
.toc-item-label {
|
|
38
38
|
display: block;
|
|
39
39
|
width: fit-content;
|
|
40
40
|
color: var(--md-sys-color-primary);
|
|
41
|
-
font-size:
|
|
42
|
-
font-weight:
|
|
43
|
-
line-height:
|
|
44
|
-
letter-spacing: -
|
|
41
|
+
font-size: var(--md-sys-typescale-body-large-size);
|
|
42
|
+
font-weight: var(--weight-semibold);
|
|
43
|
+
line-height: var(--md-sys-typescale-body-large-line-height);
|
|
44
|
+
letter-spacing: var(--md-sys-typescale-body-large-tracking);
|
|
45
45
|
text-decoration: underline;
|
|
46
46
|
text-decoration-thickness: 1px;
|
|
47
47
|
text-underline-offset: .1578em;
|
|
48
|
-
margin-bottom:
|
|
48
|
+
margin-bottom: var(--spacing-3);
|
|
49
49
|
&:hover{
|
|
50
50
|
color: var(--md-sys-color-on-surface);
|
|
51
51
|
text-decoration-thickness: 2px;
|
|
@@ -59,26 +59,26 @@ import{b as p,n as d,i as h,x as l,t as u}from"../../vendor/vendor.js";import"..
|
|
|
59
59
|
margin-left: auto;
|
|
60
60
|
}
|
|
61
61
|
scb-divider{
|
|
62
|
-
margin: 0
|
|
62
|
+
margin: var(--spacing-0) var(--spacing-3);
|
|
63
63
|
}
|
|
64
64
|
.scb-toc-item-bottom {
|
|
65
65
|
font-size: var(--md-sys-typescale-body-medium-size);
|
|
66
|
-
line-height:
|
|
67
|
-
letter-spacing: -
|
|
66
|
+
line-height: var(--md-sys-typescale-body-medium-line-height); /* 150% */
|
|
67
|
+
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
|
|
68
68
|
}
|
|
69
69
|
.scb-toc-item-bottom {
|
|
70
|
-
padding: 0
|
|
71
|
-
max-height: 0;
|
|
70
|
+
padding: var(--spacing-0) var(--spacing-5) var(--spacing-0) var(--spacing-9);
|
|
71
|
+
max-height: var(--spacing-0);
|
|
72
72
|
overflow: hidden;
|
|
73
73
|
transition: .15s cubic-bezier(.69,.16,.2,.98);
|
|
74
|
-
opacity: 0;
|
|
74
|
+
opacity: var(--spacing-0);
|
|
75
75
|
}
|
|
76
76
|
.scb-toc-item-bottom.expanded {
|
|
77
77
|
opacity: 1;
|
|
78
|
-
padding:
|
|
78
|
+
padding: var(--spacing-0) var(--spacing-5) var(--spacing-5) var(--spacing-9);
|
|
79
79
|
max-height: 100%;
|
|
80
80
|
}
|
|
81
81
|
.scb-toc-item{
|
|
82
82
|
color: var(--md-sys-color-on-surface);
|
|
83
83
|
}
|
|
84
|
-
`];c([d({type:Boolean})],
|
|
84
|
+
`];c([d({type:Boolean})],r.prototype,"expanded",2);c([d({type:String,reflect:!0})],r.prototype,"label",2);c([d({type:String,attribute:"supporting-text"})],r.prototype,"supportingText",2);c([d({type:String,attribute:"item-href"})],r.prototype,"itemHref",2);c([d({type:Boolean,attribute:"divider"})],r.prototype,"divider",2);r=c([b("scb-toc-item")],r);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "scb-wc-test",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.9",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"module": "index.js",
|
|
@@ -273,5 +273,5 @@
|
|
|
273
273
|
},
|
|
274
274
|
"./mvc/*": "./mvc/*"
|
|
275
275
|
},
|
|
276
|
-
"buildHash": "
|
|
276
|
+
"buildHash": "4F2594586297576DCA4E4D99CA61A78244F9D47DFBD3AB670DCCCE5C85D4D55C"
|
|
277
277
|
}
|
package/scb-toc/scb-toc-item.js
CHANGED
|
@@ -2,27 +2,27 @@ import { css as p, LitElement as h, html as l } from "lit";
|
|
|
2
2
|
import { property as d, customElement as b } from "lit/decorators.js";
|
|
3
3
|
import "../scb-icon-button/scb-icon-button.js";
|
|
4
4
|
import "../scb-divider/scb-divider.js";
|
|
5
|
-
var
|
|
6
|
-
for (var i =
|
|
7
|
-
(
|
|
8
|
-
return
|
|
5
|
+
var m = Object.defineProperty, u = Object.getOwnPropertyDescriptor, c = (e, s, o, t) => {
|
|
6
|
+
for (var i = t > 1 ? void 0 : t ? u(s, o) : s, a = e.length - 1, n; a >= 0; a--)
|
|
7
|
+
(n = e[a]) && (i = (t ? n(s, o, i) : n(i)) || i);
|
|
8
|
+
return t && i && m(s, o, i), i;
|
|
9
9
|
};
|
|
10
10
|
let r = class extends h {
|
|
11
11
|
constructor() {
|
|
12
12
|
super(...arguments), this.expanded = !1, this.label = "", this.supportingText = "", this.itemHref = "#", this.divider = !0, this._unique = crypto.randomUUID(), this._slotHasContent = !1, this._onSlotChange = () => {
|
|
13
|
-
const
|
|
14
|
-
this._slotHasContent = !!
|
|
13
|
+
const e = this.renderRoot.querySelector("slot");
|
|
14
|
+
this._slotHasContent = !!e && e.assignedNodes().length > 0, this.requestUpdate(), this._updateTabbable();
|
|
15
15
|
}, this.toggleAccordion = () => {
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
16
|
+
const e = this.closest("scb-toc");
|
|
17
|
+
e != null && e.hasAttribute("detached") || e.querySelectorAll("scb-toc-item").forEach((t) => {
|
|
18
|
+
t !== this && t.expanded && (t.expanded = !1, this.toggleBottom(t), t.dispatchEvent(new CustomEvent("expanded-changed", {
|
|
19
19
|
detail: { expanded: !1 },
|
|
20
20
|
bubbles: !0,
|
|
21
21
|
composed: !0
|
|
22
22
|
})));
|
|
23
23
|
});
|
|
24
|
-
const
|
|
25
|
-
this.expanded = !this.expanded, this.toggleBottom(this),
|
|
24
|
+
const s = this.expanded;
|
|
25
|
+
this.expanded = !this.expanded, this.toggleBottom(this), s !== this.expanded && this.dispatchEvent(new CustomEvent("expanded-changed", {
|
|
26
26
|
detail: { expanded: this.expanded },
|
|
27
27
|
bubbles: !0,
|
|
28
28
|
composed: !0
|
|
@@ -35,25 +35,25 @@ let r = class extends h {
|
|
|
35
35
|
disconnectedCallback() {
|
|
36
36
|
super.disconnectedCallback(), this.removeEventListener("slotchange", this._onSlotChange);
|
|
37
37
|
}
|
|
38
|
-
updated(
|
|
39
|
-
|
|
38
|
+
updated(e) {
|
|
39
|
+
e.has("expanded") && this._updateTabbable();
|
|
40
40
|
}
|
|
41
41
|
_updateTabbable() {
|
|
42
42
|
if (typeof window > "u") return;
|
|
43
|
-
const
|
|
44
|
-
if (!
|
|
45
|
-
|
|
46
|
-
var
|
|
47
|
-
|
|
48
|
-
const
|
|
49
|
-
this.expanded ?
|
|
43
|
+
const e = this.renderRoot.querySelector("slot");
|
|
44
|
+
if (!e) return;
|
|
45
|
+
e.assignedElements({ flatten: !0 }).forEach((o) => {
|
|
46
|
+
var t;
|
|
47
|
+
o.matches("a,button,input,select,textarea,[tabindex]") && (this.expanded ? o.removeAttribute("tabindex") : o.setAttribute("tabindex", "-1")), (t = o.querySelectorAll) == null || t.call(o, "a,button,input,select,textarea,[tabindex]").forEach((i) => {
|
|
48
|
+
const a = i;
|
|
49
|
+
this.expanded ? a.removeAttribute("tabindex") : a.setAttribute("tabindex", "-1");
|
|
50
50
|
});
|
|
51
51
|
});
|
|
52
52
|
}
|
|
53
53
|
// Animerar max-height vid öppning/stängning för snygg transition
|
|
54
|
-
toggleBottom(
|
|
55
|
-
const
|
|
56
|
-
|
|
54
|
+
toggleBottom(e) {
|
|
55
|
+
const s = e.renderRoot.querySelector(".scb-toc-item-bottom");
|
|
56
|
+
s && (e.expanded ? (s.style.maxHeight = `${s.scrollHeight}px`, setTimeout(() => s.style.maxHeight = "unset", 160)) : (s.style.maxHeight = `${s.scrollHeight}px`, requestAnimationFrame(() => s.style.maxHeight = "0")));
|
|
57
57
|
}
|
|
58
58
|
/*
|
|
59
59
|
Tangentbordsnavigering:
|
|
@@ -61,35 +61,35 @@ let r = class extends h {
|
|
|
61
61
|
ArrowUp/Down flyttar fokus,
|
|
62
62
|
Home/End hoppar till första/sista item.
|
|
63
63
|
*/
|
|
64
|
-
_onKeyDown(
|
|
65
|
-
const
|
|
66
|
-
switch (
|
|
64
|
+
_onKeyDown(e) {
|
|
65
|
+
const s = this.closest("scb-toc"), t = Array.from((s == null ? void 0 : s.querySelectorAll("scb-toc-item")) || []).map((n) => n.renderRoot.querySelector(".scb-toc-item")).filter((n) => !!n), i = e.currentTarget, a = t.indexOf(i);
|
|
66
|
+
switch (e.key) {
|
|
67
67
|
case "Enter":
|
|
68
68
|
case " ":
|
|
69
|
-
|
|
69
|
+
e.preventDefault(), this.toggleAccordion();
|
|
70
70
|
break;
|
|
71
71
|
case "ArrowDown":
|
|
72
|
-
|
|
72
|
+
e.preventDefault(), a < t.length - 1 && t[a + 1].focus();
|
|
73
73
|
break;
|
|
74
74
|
case "ArrowUp":
|
|
75
|
-
|
|
75
|
+
e.preventDefault(), a > 0 && t[a - 1].focus();
|
|
76
76
|
break;
|
|
77
77
|
case "Home":
|
|
78
|
-
|
|
78
|
+
e.preventDefault(), t.length && t[0].focus();
|
|
79
79
|
break;
|
|
80
80
|
case "End":
|
|
81
|
-
|
|
81
|
+
e.preventDefault(), t.length && t[t.length - 1].focus();
|
|
82
82
|
break;
|
|
83
83
|
}
|
|
84
84
|
}
|
|
85
85
|
render() {
|
|
86
|
-
const
|
|
86
|
+
const e = `bottom-${this._unique}`;
|
|
87
87
|
return l`
|
|
88
88
|
<div
|
|
89
89
|
class="scb-toc-item"
|
|
90
90
|
role="listitem"
|
|
91
91
|
aria-expanded=${this.expanded}
|
|
92
|
-
aria-controls=${
|
|
92
|
+
aria-controls=${e}
|
|
93
93
|
>
|
|
94
94
|
<div class="scb-toc-item-top">
|
|
95
95
|
<div>
|
|
@@ -106,7 +106,7 @@ let r = class extends h {
|
|
|
106
106
|
` : ""}
|
|
107
107
|
</div>
|
|
108
108
|
<div
|
|
109
|
-
id=${
|
|
109
|
+
id=${e}
|
|
110
110
|
class="scb-toc-item-bottom ${this.expanded ? "expanded" : ""}"
|
|
111
111
|
>
|
|
112
112
|
<slot @slotchange=${this._onSlotChange}></slot>
|
|
@@ -119,23 +119,23 @@ let r = class extends h {
|
|
|
119
119
|
r.styles = [
|
|
120
120
|
p`
|
|
121
121
|
.scb-toc-item-top{
|
|
122
|
-
padding:
|
|
122
|
+
padding: var(--spacing-5) var(--spacing-3);
|
|
123
123
|
display: flex;
|
|
124
|
-
gap:
|
|
124
|
+
gap: var(--spacing-5);
|
|
125
125
|
flex-direction: row;
|
|
126
126
|
}
|
|
127
127
|
.toc-item-label {
|
|
128
128
|
display: block;
|
|
129
129
|
width: fit-content;
|
|
130
130
|
color: var(--md-sys-color-primary);
|
|
131
|
-
font-size:
|
|
132
|
-
font-weight:
|
|
133
|
-
line-height:
|
|
134
|
-
letter-spacing: -
|
|
131
|
+
font-size: var(--md-sys-typescale-body-large-size);
|
|
132
|
+
font-weight: var(--weight-semibold);
|
|
133
|
+
line-height: var(--md-sys-typescale-body-large-line-height);
|
|
134
|
+
letter-spacing: var(--md-sys-typescale-body-large-tracking);
|
|
135
135
|
text-decoration: underline;
|
|
136
136
|
text-decoration-thickness: 1px;
|
|
137
137
|
text-underline-offset: .1578em;
|
|
138
|
-
margin-bottom:
|
|
138
|
+
margin-bottom: var(--spacing-3);
|
|
139
139
|
&:hover{
|
|
140
140
|
color: var(--md-sys-color-on-surface);
|
|
141
141
|
text-decoration-thickness: 2px;
|
|
@@ -149,23 +149,23 @@ r.styles = [
|
|
|
149
149
|
margin-left: auto;
|
|
150
150
|
}
|
|
151
151
|
scb-divider{
|
|
152
|
-
margin: 0
|
|
152
|
+
margin: var(--spacing-0) var(--spacing-3);
|
|
153
153
|
}
|
|
154
154
|
.scb-toc-item-bottom {
|
|
155
155
|
font-size: var(--md-sys-typescale-body-medium-size);
|
|
156
|
-
line-height:
|
|
157
|
-
letter-spacing: -
|
|
156
|
+
line-height: var(--md-sys-typescale-body-medium-line-height); /* 150% */
|
|
157
|
+
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
|
|
158
158
|
}
|
|
159
159
|
.scb-toc-item-bottom {
|
|
160
|
-
padding: 0
|
|
161
|
-
max-height: 0;
|
|
160
|
+
padding: var(--spacing-0) var(--spacing-5) var(--spacing-0) var(--spacing-9);
|
|
161
|
+
max-height: var(--spacing-0);
|
|
162
162
|
overflow: hidden;
|
|
163
163
|
transition: .15s cubic-bezier(.69,.16,.2,.98);
|
|
164
|
-
opacity: 0;
|
|
164
|
+
opacity: var(--spacing-0);
|
|
165
165
|
}
|
|
166
166
|
.scb-toc-item-bottom.expanded {
|
|
167
167
|
opacity: 1;
|
|
168
|
-
padding:
|
|
168
|
+
padding: var(--spacing-0) var(--spacing-5) var(--spacing-5) var(--spacing-9);
|
|
169
169
|
max-height: 100%;
|
|
170
170
|
}
|
|
171
171
|
.scb-toc-item{
|
package/scb-wc-test.bundle.js
CHANGED
|
@@ -5120,23 +5120,23 @@ var ScbWcTest=function(s){"use strict";var fs;function d(o,e,t,r){var i=argument
|
|
|
5120
5120
|
</div>
|
|
5121
5121
|
`}},s.ScbTocItem.styles=[v`
|
|
5122
5122
|
.scb-toc-item-top{
|
|
5123
|
-
padding:
|
|
5123
|
+
padding: var(--spacing-5) var(--spacing-3);
|
|
5124
5124
|
display: flex;
|
|
5125
|
-
gap:
|
|
5125
|
+
gap: var(--spacing-5);
|
|
5126
5126
|
flex-direction: row;
|
|
5127
5127
|
}
|
|
5128
5128
|
.toc-item-label {
|
|
5129
5129
|
display: block;
|
|
5130
5130
|
width: fit-content;
|
|
5131
5131
|
color: var(--md-sys-color-primary);
|
|
5132
|
-
font-size:
|
|
5133
|
-
font-weight:
|
|
5134
|
-
line-height:
|
|
5135
|
-
letter-spacing: -
|
|
5132
|
+
font-size: var(--md-sys-typescale-body-large-size);
|
|
5133
|
+
font-weight: var(--weight-semibold);
|
|
5134
|
+
line-height: var(--md-sys-typescale-body-large-line-height);
|
|
5135
|
+
letter-spacing: var(--md-sys-typescale-body-large-tracking);
|
|
5136
5136
|
text-decoration: underline;
|
|
5137
5137
|
text-decoration-thickness: 1px;
|
|
5138
5138
|
text-underline-offset: .1578em;
|
|
5139
|
-
margin-bottom:
|
|
5139
|
+
margin-bottom: var(--spacing-3);
|
|
5140
5140
|
&:hover{
|
|
5141
5141
|
color: var(--md-sys-color-on-surface);
|
|
5142
5142
|
text-decoration-thickness: 2px;
|
|
@@ -5150,23 +5150,23 @@ var ScbWcTest=function(s){"use strict";var fs;function d(o,e,t,r){var i=argument
|
|
|
5150
5150
|
margin-left: auto;
|
|
5151
5151
|
}
|
|
5152
5152
|
scb-divider{
|
|
5153
|
-
margin: 0
|
|
5153
|
+
margin: var(--spacing-0) var(--spacing-3);
|
|
5154
5154
|
}
|
|
5155
5155
|
.scb-toc-item-bottom {
|
|
5156
5156
|
font-size: var(--md-sys-typescale-body-medium-size);
|
|
5157
|
-
line-height:
|
|
5158
|
-
letter-spacing: -
|
|
5157
|
+
line-height: var(--md-sys-typescale-body-medium-line-height); /* 150% */
|
|
5158
|
+
letter-spacing: var(--md-sys-typescale-body-medium-tracking);
|
|
5159
5159
|
}
|
|
5160
5160
|
.scb-toc-item-bottom {
|
|
5161
|
-
padding: 0
|
|
5162
|
-
max-height: 0;
|
|
5161
|
+
padding: var(--spacing-0) var(--spacing-5) var(--spacing-0) var(--spacing-9);
|
|
5162
|
+
max-height: var(--spacing-0);
|
|
5163
5163
|
overflow: hidden;
|
|
5164
5164
|
transition: .15s cubic-bezier(.69,.16,.2,.98);
|
|
5165
|
-
opacity: 0;
|
|
5165
|
+
opacity: var(--spacing-0);
|
|
5166
5166
|
}
|
|
5167
5167
|
.scb-toc-item-bottom.expanded {
|
|
5168
5168
|
opacity: 1;
|
|
5169
|
-
padding:
|
|
5169
|
+
padding: var(--spacing-0) var(--spacing-5) var(--spacing-5) var(--spacing-9);
|
|
5170
5170
|
max-height: 100%;
|
|
5171
5171
|
}
|
|
5172
5172
|
.scb-toc-item{
|