fujin/gruvbox-wallpapers
1
0
Fork 0
mirror of https://github.com/AngelJumbo/gruvbox-wallpapers.git synced 2026-10-10 08:09:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add light style css

Browse Source
This commit is contained in:
Katy248
2024-06-01 11:08:22 +03:00
parent f298aa85e8
commit fbbfef9b82
1 changed files with 53 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
style.css
+53 -45
View File
@@ -1,74 +1,85 @@
:root {
color-scheme: light dark;
--bg-color: light-dark(#fbf1c7, #282828);
--fg-color: light-dark(#3c3836, #ebdbb2);
--bg-color-reverse: light-dark(#3c3836, #ebdbb2);
--fg-color-reverse: light-dark(#fbf1c7, #282828);
--bg-color-3: light-dark(#bdae93, #665c54);
--bg-color-hard: light-dark(#f9f5d7, #1d2021);
--gray: light-dark(#7c6f64, #a89984);
}
body { body {
color: #ebdbb2; background-color: var(--bg-color);
background-color: #282828;
padding-left: 15%; padding-left: 15%;
padding-right: 15%; padding-right: 15%;
font-family: "Curier New", monospace; font-family: "Curier New", monospace;
} }
h1 { * {
background-color: #ebdbb2; color: var(--fg-color);
color: #282828;
text-align: center;
text-decoration: none;
/*border-radius: 8px; */
} }
h1,
h2 { h2 {
background-color: #ebdbb2; background-color: var(--bg-color-reverse);
color: #282828; color: var(--fg-color-reverse);
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
/*border-radius: 8px; */
} }
a { .showmore {
color: #ebdbb2;
}
.showmore{
text-align: center; text-align: center;
background-color: #ebdbb2; background-color: var(--bg-color-reverse);
color: #282828; color: var(--fg-color-reverse);
} }
#s1 { #s1 {
background-color: #d65d0e; background-color: #d65d0e;
} }
#s2 { #s2 {
background-color: #cc241d; background-color: #cc241d;
} }
#s3 { #s3 {
background-color: #98971a; background-color: #98971a;
} }
#s4 { #s4 {
background-color: #d79921; background-color: #d79921;
} }
#s5 { #s5 {
background-color: #458588; background-color: #458588;
} }
#s6 { #s6 {
background-color: #b16286; background-color: #b16286;
} }
#s7 { #s7 {
background-color: #689d6a; background-color: #689d6a;
} }
#c { #c {
padding: 1em; padding: 1em;
background-color: #665c54; background-color: var(--bg-color-3);
text-align: center; text-align: center;
/*border-radius: 8px; */ /*border-radius: 8px; */
} }
img { img {
transition: all .2s ease-in-out; transition: all .2s ease-in-out;
} }
img:hover { img:hover {
transform: scale(1.5); transform: scale(1.5);
border: none; border: none;
box-shadow: 5px 4px 10px #000000; box-shadow: 5px 4px 10px black;
} }
@@ -77,38 +88,35 @@ img:hover {
margin-bottom: 10px; margin-bottom: 10px;
padding: 5px; padding: 5px;
/*border-radius: 8px; */ /*border-radius: 8px; */
color: #282828; color: var(--fg-color-reverse);
/*display: flex; /*display: flex;
justify-content: center;*/ justify-content: center;*/
text-align: center; text-align: center;
} }
.pager button { .pager button {
background-color: #ebdbb2; background-color: var(--bg-color-reverse);
border: none; border: none;
color: #282828; color: var(--fg-color-reverse);
padding: 10px 20px; padding: 10px 20px;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
display: inline-block; display: inline-block;
font-size: 16px; font-size: 16px;
font-weight: 900; font-weight: 900;
margin: 4px 2px; margin: 4px 2px;
cursor: pointer; cursor: pointer;
/*border-radius: 8px; */
&.sel-btn {
background-color: var(--bg-color);
color: var(--fg-color);
border-color: var(--fg-color);
border-width: thick;
border-style: solid;
}
} }
.sel-btn{
background-color: #282828 !important;
border-color: #ebdbb2 !important;
color: #ebdbb2 !important;
border-width: thick !important;
border-style: solid !important;
}
.clickable { .clickable {
cursor: pointer; cursor: pointer;
} }