inline svg and reference style.css appropriately
This commit is contained in:
parent
f6a039905b
commit
228ab60b64
22 changed files with 1338 additions and 20 deletions
32
style.css
32
style.css
|
|
@ -136,13 +136,13 @@ button:focus {
|
|||
}
|
||||
|
||||
.menubar-controls button[aria-label="Minimize"] {
|
||||
background-image: url("./minimize.svg");
|
||||
background-image: svg-load("./icon/minimize.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-position: bottom 2px left 3px;
|
||||
}
|
||||
|
||||
.menubar-controls button[aria-label="Maximize"] {
|
||||
background-image: url("./maximize.svg");
|
||||
background-image: svg-load("./icon/maximize.svg");
|
||||
background-repeat: no-repeat;
|
||||
/* Off by 1px because contents can't go above the inner shadow */
|
||||
/* Should be 9px by 9px, with top 1px */
|
||||
|
|
@ -151,7 +151,7 @@ button:focus {
|
|||
|
||||
.menubar-controls button[aria-label="Close"] {
|
||||
margin-left: 2px;
|
||||
background-image: url("./close.svg");
|
||||
background-image: svg-load("./icon/close.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-position: top 2px center;
|
||||
}
|
||||
|
|
@ -230,7 +230,7 @@ input[type="radio"] + label::before {
|
|||
width: var(--radio-width);
|
||||
height: var(--radio-width);
|
||||
margin-right: var(--radio-label-spacing);
|
||||
background: url("./radio-border.svg");
|
||||
background: svg-load("./icon/radio-border.svg");
|
||||
}
|
||||
|
||||
input[type="radio"]:checked + label::after {
|
||||
|
|
@ -249,7 +249,7 @@ input[type="radio"]:checked + label::after {
|
|||
top: var(--radio-dot-top);
|
||||
left: var(--radio-dot-left);
|
||||
position: absolute;
|
||||
background: url("./radio-dot.svg");
|
||||
background: svg-load("./icon/radio-dot.svg");
|
||||
}
|
||||
|
||||
input[type="radio"]:focus + label,
|
||||
|
|
@ -258,11 +258,11 @@ input[type="checkbox"]:focus + label {
|
|||
}
|
||||
|
||||
input[type="radio"][disabled] + label::before {
|
||||
background: url("./radio-border-disabled.svg");
|
||||
background: svg-load("./icon/radio-border-disabled.svg");
|
||||
}
|
||||
|
||||
input[type="radio"][disabled]:checked + label::after {
|
||||
background: url("./radio-dot-disabled.svg");
|
||||
background: svg-load("./icon/radio-dot-disabled.svg");
|
||||
}
|
||||
|
||||
input[type="checkbox"] + label {
|
||||
|
|
@ -296,7 +296,7 @@ input[type="checkbox"]:checked + label::after {
|
|||
left: calc(
|
||||
-1 * (var(--checkbox-total-width-precalc)) + var(--checkmark-left)
|
||||
);
|
||||
background: url("./checkmark.svg");
|
||||
background: svg-load("./icon/checkmark.svg");
|
||||
}
|
||||
|
||||
input[type="checkbox"][disabled] + label::before {
|
||||
|
|
@ -304,7 +304,7 @@ input[type="checkbox"][disabled] + label::before {
|
|||
}
|
||||
|
||||
input[type="checkbox"][disabled]:checked + label::after {
|
||||
background: url("./checkmark-disabled.svg");
|
||||
background: svg-load("./icon/checkmark-disabled.svg");
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
|
|
@ -332,7 +332,7 @@ select {
|
|||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
position: relative;
|
||||
background-image: url("./button-down.svg");
|
||||
background-image: svg-load("./icon/button-down.svg");
|
||||
background-position: top 2px right 2px;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
|
@ -353,7 +353,7 @@ select:focus option {
|
|||
}
|
||||
|
||||
select:active {
|
||||
background-image: url("./button-down-active.svg");
|
||||
background-image: svg-load("./icon/button-down-active.svg");
|
||||
}
|
||||
|
||||
a {
|
||||
|
|
@ -452,7 +452,7 @@ summary:focus {
|
|||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
background-image: url("./scrollbar-background.svg");
|
||||
background-image: svg-load("./icon/scrollbar-background.svg");
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
|
|
@ -462,17 +462,17 @@ summary:focus {
|
|||
|
||||
::-webkit-scrollbar-button:vertical:start {
|
||||
height: 17px;
|
||||
background-image: url("./button-up.svg");
|
||||
background-image: svg-load("./icon/button-up.svg");
|
||||
}
|
||||
::-webkit-scrollbar-button:vertical:end {
|
||||
height: 17px;
|
||||
background-image: url("./button-down.svg");
|
||||
background-image: svg-load("./icon/button-down.svg");
|
||||
}
|
||||
::-webkit-scrollbar-button:horizontal:start {
|
||||
width: 16px;
|
||||
background-image: url("./button-left.svg");
|
||||
background-image: svg-load("./icon/button-left.svg");
|
||||
}
|
||||
::-webkit-scrollbar-button:horizontal:end {
|
||||
width: 16px;
|
||||
background-image: url("./button-right.svg");
|
||||
background-image: svg-load("./icon/button-right.svg");
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue