@primer/brand-css 0.66.0-rc.bfc673d9 → 0.66.0-rc.d5c4bb5d
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.
|
@@ -32,64 +32,6 @@
|
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
-
/* Gridline variant */
|
|
36
|
-
|
|
37
|
-
.RiverAccordion--variant-gridline {
|
|
38
|
-
position: relative;
|
|
39
|
-
padding-inline: var(--brand-RiverAccordion-variant-gridline-spacing-outerInline);
|
|
40
|
-
padding-block: var(--brand-RiverAccordion-variant-gridline-spacing-outerBlock);
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
.RiverAccordion--variant-gridline::before,
|
|
44
|
-
.RiverAccordion--variant-gridline::after {
|
|
45
|
-
content: '';
|
|
46
|
-
position: absolute;
|
|
47
|
-
left: 50%;
|
|
48
|
-
transform: translateX(-50%);
|
|
49
|
-
width: 100vw;
|
|
50
|
-
height: 0;
|
|
51
|
-
border-top: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);
|
|
52
|
-
z-index: 1;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.RiverAccordion--variant-gridline::before {
|
|
56
|
-
top: 0;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
.RiverAccordion--variant-gridline::after {
|
|
60
|
-
bottom: 0;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
@media (min-width: 48rem) {
|
|
64
|
-
.RiverAccordion--variant-gridline {
|
|
65
|
-
--gap-width: var(--brand-RiverAccordion-variant-gridline-spacing-contentGap);
|
|
66
|
-
--half-column: calc(50% - var(--gap-width) / 2);
|
|
67
|
-
|
|
68
|
-
gap: var(--gap-width);
|
|
69
|
-
align-items: center;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
.RiverAccordion--variant-gridline.RiverAccordion__align-start {
|
|
73
|
-
grid-template-columns: var(--half-column) var(--half-column);
|
|
74
|
-
grid-template-areas: 'accordion visual';
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
.RiverAccordion--variant-gridline.RiverAccordion__align-end {
|
|
78
|
-
grid-template-columns: var(--half-column) var(--half-column);
|
|
79
|
-
grid-template-areas: 'visual accordion';
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
@media (min-width: 80rem) {
|
|
84
|
-
.RiverAccordion--variant-gridline {
|
|
85
|
-
border-inline: var(--brand-borderWidth-thin) solid var(--brand-color-border-muted);
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.RiverAccordion--variant-gridline .RiverAccordion__visualsWrapper {
|
|
90
|
-
border-radius: var(--brand-borderRadius-medium);
|
|
91
|
-
}
|
|
92
|
-
|
|
93
35
|
.RiverAccordion__accordionContainer {
|
|
94
36
|
grid-area: accordion;
|
|
95
37
|
}
|
|
@@ -99,7 +41,6 @@
|
|
|
99
41
|
}
|
|
100
42
|
|
|
101
43
|
.RiverAccordion__visualsWrapper {
|
|
102
|
-
width: 100%;
|
|
103
44
|
overflow: hidden;
|
|
104
45
|
border-radius: var(--brand-borderRadius-xlarge);
|
|
105
46
|
display: grid;
|
|
@@ -218,12 +159,10 @@
|
|
|
218
159
|
}
|
|
219
160
|
|
|
220
161
|
.RiverAccordion__icon {
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
align-items: center;
|
|
224
|
-
color: var(--brand-color-text-muted);
|
|
162
|
+
opacity: 1;
|
|
163
|
+
transition: opacity var(--brand-animation-duration-fast) var(--brand-animation-easing-default);
|
|
225
164
|
}
|
|
226
165
|
|
|
227
166
|
.RiverAccordion__item--open .RiverAccordion__icon {
|
|
228
|
-
|
|
167
|
+
opacity: 0;
|
|
229
168
|
}
|