@mundogamernetwork/shared-ui 1.14.3 → 1.14.5
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.
|
@@ -155,8 +155,14 @@ const handleLogout = async () => {
|
|
|
155
155
|
<style scoped lang="scss">
|
|
156
156
|
.ui-config-user {
|
|
157
157
|
position: absolute;
|
|
158
|
-
|
|
159
|
-
width
|
|
158
|
+
// A fixed width, not width:100%. This is position:absolute, so a
|
|
159
|
+
// percentage width resolves against the nearest positioned ancestor —
|
|
160
|
+
// every real host's profile-icon <li> (32px, position:relative for its
|
|
161
|
+
// own reasons), not the header. width:100% + max-width collapsed the
|
|
162
|
+
// whole dropdown to a 32px sliver pinned off in the corner; nothing
|
|
163
|
+
// caught it before because no front actually rendered this component
|
|
164
|
+
// until the account-menu unification wired all twelve of them to it.
|
|
165
|
+
width: 240px;
|
|
160
166
|
padding: 1rem 0;
|
|
161
167
|
background-color: var(--header-ui-config-bg);
|
|
162
168
|
border: 1px solid var(--header-ui-config-border);
|
|
@@ -167,7 +173,7 @@ const handleLogout = async () => {
|
|
|
167
173
|
transition: all ease 0.5s;
|
|
168
174
|
|
|
169
175
|
&:not(.signed-in) {
|
|
170
|
-
|
|
176
|
+
width: 340px;
|
|
171
177
|
}
|
|
172
178
|
|
|
173
179
|
&__option {
|
|
@@ -184,10 +190,32 @@ const handleLogout = async () => {
|
|
|
184
190
|
font-weight: 400;
|
|
185
191
|
}
|
|
186
192
|
|
|
193
|
+
// Self-contained styling, not a host `.btn.primary` Bootstrap class:
|
|
194
|
+
// this component ships to hosts that don't all load Bootstrap (Shop
|
|
195
|
+
// doesn't), so relying on it left the login button rendering as a
|
|
196
|
+
// bare unstyled link there. Same color tokens the rest of this file
|
|
197
|
+
// already falls back through (see .plans-pricing-link below).
|
|
198
|
+
a.btn.primary {
|
|
199
|
+
display: block;
|
|
200
|
+
text-align: center;
|
|
201
|
+
padding: 0.625rem 1rem;
|
|
202
|
+
background: var(--highlight-color, var(--header-active-fg, var(--active)));
|
|
203
|
+
color: var(--header-ui-config-bg, #fff);
|
|
204
|
+
text-decoration: none;
|
|
205
|
+
|
|
206
|
+
&:hover {
|
|
207
|
+
opacity: 0.85;
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
|
|
187
211
|
& > div > p {
|
|
188
212
|
font-size: 15px !important;
|
|
189
213
|
font-weight: 400;
|
|
190
214
|
color: var(--sidebar-menus-fg);
|
|
215
|
+
|
|
216
|
+
a {
|
|
217
|
+
color: var(--highlight-color, var(--header-active-fg, var(--active)));
|
|
218
|
+
}
|
|
191
219
|
}
|
|
192
220
|
}
|
|
193
221
|
|