ryan/squoosh
1
0
Fork 0
forked from external-repos/squoosh
Code Pull Requests Activity

Rotate copy-over-buttons correctly (#1335)

Browse Source
This commit is contained in:
Aryan Pingle
2023-03-02 17:12:52 +05:30
committed by GitHub
parent 583117697e
commit a8bc48f94c
2 changed files with 7 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/client/lazy-app/Compress/Options/style.css
View File

@@ -112,6 +112,9 @@
.copy-over-button { .copy-over-button {
composes: title-button; composes: title-button;
/* Make the filled arrow point towards the other options element */
transform: rotate(var(--rotate-copyoverbutton-angle));
svg { svg {
fill: var(--header-text-color); fill: var(--header-text-color);
} }

4
src/client/lazy-app/Compress/style.css
View File

@@ -45,9 +45,11 @@
--hot-theme-color: var(--hot-pink); --hot-theme-color: var(--hot-pink);
--header-text-color: var(--white); --header-text-color: var(--white);
--scroller-radius: var(--options-radius) var(--options-radius) 0 0; --scroller-radius: var(--options-radius) var(--options-radius) 0 0;
--rotate-copyoverbutton-angle: 90deg; /* To point down */
@media (min-width: 600px) { @media (min-width: 600px) {
--scroller-radius: 0 var(--options-radius) var(--options-radius) 0; --scroller-radius: 0 var(--options-radius) var(--options-radius) 0;
--rotate-copyoverbutton-angle: 0deg; /* To point right (no change) */
} }
} }
@@ -56,9 +58,11 @@
--hot-theme-color: var(--deep-blue); --hot-theme-color: var(--deep-blue);
--header-text-color: var(--dark-text); --header-text-color: var(--dark-text);
--scroller-radius: var(--options-radius) var(--options-radius) 0 0; --scroller-radius: var(--options-radius) var(--options-radius) 0 0;
--rotate-copyoverbutton-angle: -90deg; /* To point up */
@media (min-width: 600px) { @media (min-width: 600px) {
--scroller-radius: var(--options-radius) 0 0 var(--options-radius); --scroller-radius: var(--options-radius) 0 0 var(--options-radius);
--rotate-copyoverbutton-angle: 180deg; /* To point left */
} }
} }