diff options
Diffstat (limited to 'themes/robson/assets/css')
| -rw-r--r-- | themes/robson/assets/css/colorscheme.css | 97 | ||||
| -rw-r--r-- | themes/robson/assets/css/main.css | 98 |
2 files changed, 195 insertions, 0 deletions
diff --git a/themes/robson/assets/css/colorscheme.css b/themes/robson/assets/css/colorscheme.css new file mode 100644 index 0000000..57c3308 --- /dev/null +++ b/themes/robson/assets/css/colorscheme.css @@ -0,0 +1,97 @@ +:root { + /* Gruvbox Light */ + --bg0: #fbf1c7; + --bg1: #ebdbb2; + --bg2: #d5c4a1; + --bg3: #bdae93; + --bg4: #a89984; + + --fg0: #282828; + --fg1: #3c3836; + --fg2: #504945; + --fg3: #665c54; + --fg4: #7c6f64; + + --red: #cc241d; + --green: #98971a; + --yellow: #d79921; + --blue: #458588; + --purple: #b16286; + --aqua: #689d6a; + --orange: #d65d0e; + --gray: #928374; +} + +@media (prefers-color-scheme: dark) { + :root { + /* Gruvbox Dark */ + --bg0: #282828; + --bg1: #3c3836; + --bg2: #504945; + --bg3: #665c54; + --bg4: #7c6f64; + + --fg0: #fbf1c7; + --fg1: #ebdbb2; + --fg2: #d5c4a1; + --fg3: #bdae93; + --fg4: #a89984; + + --red: #fb4934; + --green: #b8bb26; + --yellow: #fabd2f; + --blue: #83a598; + --purple: #d3869b; + --aqua: #8ec07c; + --orange: #fe8019; + --gray: #928374; + } +} + +/* Override manual para toggle (opcional) */ +[data-theme="dark"] { + --bg0: #282828; + --bg1: #3c3836; + --bg2: #504945; + --bg3: #665c54; + --bg4: #7c6f64; + + --fg0: #fbf1c7; + --fg1: #ebdbb2; + --fg2: #d5c4a1; + --fg3: #bdae93; + --fg4: #a89984; + + --red: #fb4934; + --green: #b8bb26; + --yellow: #fabd2f; + --blue: #83a598; + --purple: #d3869b; + --aqua: #8ec07c; + --orange: #fe8019; + --gray: #928374; +} + +[data-theme="light"] { + --bg0: #fbf1c7; + --bg1: #ebdbb2; + --bg2: #d5c4a1; + --bg3: #bdae93; + --bg4: #a89984; + + --fg0: #282828; + --fg1: #3c3836; + --fg2: #504945; + --fg3: #665c54; + --fg4: #7c6f64; + + --red: #cc241d; + --green: #98971a; + --yellow: #d79921; + --blue: #458588; + --purple: #b16286; + --aqua: #689d6a; + --orange: #d65d0e; + --gray: #928374; +} + diff --git a/themes/robson/assets/css/main.css b/themes/robson/assets/css/main.css new file mode 100644 index 0000000..a18bd06 --- /dev/null +++ b/themes/robson/assets/css/main.css @@ -0,0 +1,98 @@ +/* Aplicação base */ +body { + background-color: var(--bg0); + font-family: system-ui; + color: var(--fg0); +} + +a { + color: var(--blue); +} + +a:hover { + color: var(--aqua); +} + +code { + background-color: var(--bg1); + color: var(--orange); +} + +pre { + background-color: var(--bg1); + border: 1px solid var(--bg3); +} + +header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 0rem 1rem; +} + +header>div.right { + display: flex; + gap: 2rem; + align-items: center; +} + +main { + padding: 0 2rem; +} + +footer { + border-top: solid 1px var(--fg0); + display: flex; + justify-content: center; + align-items: center; + gap: 2rem; +} + +nav>ul { + padding: 0; + margin: 0; + + display: flex; + gap: 1rem; + list-style: none; +} + +nav>ul>li>a { + text-decoration: none; + font-size: 1.25rem; +} + +h1 a { + text-decoration: none; + color: var(--fg0); +} + +.socials>a>img { + display:block; + --icon-size: 1.5rem; + + width: var(--icon-size); + height: var(--icon-size); +} + +.iconGit { + filter: invert(35%) sepia(80%) saturate(1488%) hue-rotate(340deg) brightness(92%) contrast(94%); +} + +.projectList { + padding: 1rem; + display: flex; + gap: 1rem; +} + +.projectCard { + width: 18rem; + padding: 0.5rem; + + display: flex; + flex-direction: column; + gap: 10rem; + + background-color: var(--bg1); + border: solid 1px var(--fg0); +} |