mirror
/
transmission
mirror of https://github.com/transmission/transmission
1
0
Fork 0
Code Issues Releases Wiki Activity

feat: web client style (#2609) 

* fix(web): border-radius added to mainwin-toolbar icons

* fix(web): --color-fg-on-popup added for font visibility when dark mode

* chore(web): add .gitattributes

Since transmission-app.js is a generated file,
should be treated as a binary to avoid conflict.

* chore: rebuild transmission-app.js

Co-authored-by: trainto <trainto@gmail.com>
This commit is contained in:
Charles Kerr 2022-02-11 18:32:20 -06:00 committed by GitHub
parent eeccc3788f
commit 708fc1531e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 8 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/.gitattributes vendored Normal file
View File

@ -0,0 +1,2 @@
transmission-app.js -diff -merge
transmission-app.js linguist-generated=true

2
web/public_html/transmission-app.js generated
View File

File diff suppressed because one or more lines are too long

6
web/style/transmission-app.scss
View File

@ -103,6 +103,7 @@ $image-upload-download: 'images/up-and-down-arrows.svg';
--color-fg-disabled: #{$grey-400}; --color-fg-disabled: #{$grey-400};
--color-fg-error: #{$red-500}; --color-fg-error: #{$red-500};
--color-fg-name: #{$grey-800}; --color-fg-name: #{$grey-800};
--color-fg-on-popup: #{$grey-800};
--color-fg-port-closed: #{$red-500}; --color-fg-port-closed: #{$red-500};
--color-fg-port-open: #{$green-500}; --color-fg-port-open: #{$green-500};
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
@ -210,6 +211,7 @@ $toolbar-height: $toolbar-height-number * 1px;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
border: 0; border: 0;
border-radius: 10px;
cursor: pointer; cursor: pointer;
height: $toolbar-height; height: $toolbar-height;
margin-right: 6px; margin-right: 6px;
@ -1216,6 +1218,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
background: $background-color; background: $background-color;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
color: var(--color-fg-on-popup);
position: absolute; position: absolute;
z-index: $z-index-popup; z-index: $z-index-popup;
@ -1255,6 +1258,7 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
); );
border-radius: 8px; border-radius: 8px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7);
color: var(--color-fg-on-popup);
padding: 20px; padding: 20px;
position: fixed; position: fixed;
width: 200px; width: 200px;
@ -1285,7 +1289,6 @@ $popup-top: 61px; // TODO: ugly that this is hardcoded
a, a,
button, button,
label { label {
color: var(--color-fg-primary);
font-size: 1em; font-size: 1em;
&:disabled { &:disabled {
@ -1449,6 +1452,7 @@ $logo-size: 64px;
} }
.dialog-window { .dialog-window {
color: var(--color-fg-on-popup);
display: grid; display: grid;
grid-column-gap: 12px; grid-column-gap: 12px;
grid-template-areas: grid-template-areas: