RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 08:27:45 +00:00
Code Issues Activity Actions

LibWeb: Use system-color keywords in Default.css

Browse source
This commit is contained in:
Sam Atkins 2023-08-23 15:59:45 +01:00 • committed by Sam Atkins
parent 848ec538c6
commit cd273f2312
1 changed files with 16 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

30
Userland/Libraries/LibWeb/CSS/Default.css
View file

@ -5,7 +5,7 @@
html { html {
font-family: sans-serif; font-family: sans-serif;
color: -libweb-palette-base-text; color: CanvasText;
} }
body { body {
@ -27,7 +27,7 @@ label {
/* FIXME: This is a temporary hack until we can render a native-looking frame for these. */ /* FIXME: This is a temporary hack until we can render a native-looking frame for these. */
input, textarea { input, textarea {
border: 1px solid -libweb-palette-threed-shadow1; border: 1px solid ButtonBorder;
min-width: 80px; min-width: 80px;
min-height: 16px; min-height: 16px;
width: 120px; width: 120px;
@ -50,18 +50,22 @@ input[type=submit], input[type=button], input[type=reset], input[type=checkbox],
} }
input::placeholder { input::placeholder {
color: rgb(117, 117, 117); color: GrayText;
} }
button, input[type=submit], input[type=button], input[type=reset] { button, input[type=submit], input[type=button], input[type=reset] {
padding: 1px 4px; padding: 1px 4px;
background-color: -libweb-palette-button; background-color: ButtonFace;
border: 1px solid -libweb-palette-threed-shadow1; border: 1px solid ButtonBorder;
color: -libweb-palette-button-text; color: ButtonText;
} }
button:hover, input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover { button:hover, input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover {
background-color: -libweb-palette-hover-highlight; /* FIXME: There isn't a <system-color> keyword for this, so this is a slightly lightened
* version of our light ButtonFace color. Once we support `color-scheme: dark`
* we'll need to use a different color for that.
*/
background-color: #e5e0d7;
} }
option { option {
@ -243,15 +247,15 @@ rt {
} }
:link { :link {
color: -libweb-link; color: LinkText;
} }
:visited { :visited {
color: -libweb-palette-visited-link; color: VisitedText;
} }
:link:active, :visited:active { :link:active, :visited:active {
color: -libweb-palette-active-link; color: ActiveText;
} }
:link, :visited { :link, :visited {
@ -264,12 +268,10 @@ rt {
} }
mark { mark {
background: yellow; background: Mark;
color: black; color: MarkText;
} }
/* this color is just a suggestion and can be changed based on implementation feedback */
abbr[title], acronym[title] { abbr[title], acronym[title] {
text-decoration: dotted underline; text-decoration: dotted underline;
} }