| @@ -6,8 +6,9 @@ | ||
| 6 | 6 | */ |
| 7 | 7 | |
| 8 | 8 | /* no-prefix */ |
| 9 | 9 | #extendify-toolbar { |
| 10 | + color-scheme: only light; | |
| 10 | 11 | position: fixed; |
| 11 | 12 | top: 0; |
| 12 | 13 | left: 0; |
| 13 | 14 | right: 0; |
| @@ -110,8 +111,21 @@ | ||
| 110 | 111 | overflow: hidden; |
| 111 | 112 | pointer-events: none; |
| 112 | 113 | } |
| 113 | 114 | |
| 115 | +@media (min-width: 783px) { | |
| 116 | + /* Without the skeleton case the collapse animates in on every load. */ | |
| 117 | + /* no-prefix */ | |
| 118 | + html.extendify-agent-skeleton #extendify-toolbar .ext-tb-ai-agent { | |
| 119 | + width: 0; | |
| 120 | + padding: 0; | |
| 121 | + margin: 0; | |
| 122 | + opacity: 0; | |
| 123 | + overflow: hidden; | |
| 124 | + pointer-events: none; | |
| 125 | + } | |
| 126 | +} | |
| 127 | + | |
| 114 | 128 | /* no-prefix */ |
| 115 | 129 | #extendify-toolbar .ext-tb-ai-agent:hover { |
| 116 | 130 | color: #ffffff; |
| 117 | 131 | background: #2145e6; |
| @@ -201,20 +215,26 @@ | ||
| 201 | 215 | |
| 202 | 216 | /* When Extendify Agent sidebar is open, reframe the toolbar to |
| 203 | 217 | match the way Extendify reframes the core admin bar (slot it |
| 204 | 218 | next to the sidebar inside the rounded frame). */ |
| 205 | -/* no-prefix */ | |
| 206 | -#extendify-toolbar.ext-tb-agent-open { | |
| 207 | - top: 8px; | |
| 208 | - left: 384px; | |
| 209 | - right: 8px; | |
| 210 | - border-radius: 8px 8px 0 0; | |
| 211 | - overflow: hidden; | |
| 219 | +/* 783px tracks Skeleton::DESKTOP; no 384px rail below it. */ | |
| 220 | +@media (min-width: 783px) { | |
| 221 | + /* .ext-tb-agent-open lands only once the sidebar mounts; the rail needs it sooner. */ | |
| 222 | + /* no-prefix */ | |
| 223 | + #extendify-toolbar.ext-tb-agent-open, | |
| 224 | + html.extendify-agent-skeleton #extendify-toolbar { | |
| 225 | + top: 8px; | |
| 226 | + left: 384px; | |
| 227 | + right: 8px; | |
| 228 | + border-radius: 8px 8px 0 0; | |
| 229 | + overflow: hidden; | |
| 230 | + } | |
| 212 | 231 | } |
| 213 | 232 | |
| 214 | 233 | @media screen and (max-width: 782px) { |
| 215 | 234 | /* no-prefix */ |
| 216 | 235 | #extendify-toolbar { |
| 236 | + z-index: 999; | |
| 217 | 237 | height: 46px; |
| 218 | 238 | font-size: 14px; |
| 219 | 239 | } |
| 220 | 240 | /* no-prefix */ |
