diff --git a/src/assets/base.css b/src/assets/base.css index 98e587f4c0cecd5672a35b3eaa39be462b7d78b1..a2a13b5e3b73b42fbf4cb3484be273a5a63fab84 100644 --- a/src/assets/base.css +++ b/src/assets/base.css @@ -4,7 +4,10 @@ --black: #363739; --white: #ffffff; --grey: #cbcbcb; + --light-grey: #f2f2f2; --green: #95e35d; + --light-green: #b3f385; + --bright: #f7da7c; @@ -16,8 +19,10 @@ :root { --color-background: var(--white); --color-text: var(--black); - --color-button: var(--bright); + --color-button: var(--green); --color-button-disabled: var(--grey); + --color-nav-hover: var(--light-grey); + --color-button-hover: var(--light-green); --color-link: var(--accent3); --color-border: var(--black); diff --git a/src/assets/main.css b/src/assets/main.css index 3a9481b3464ba045ffece7b2e1d984e2f42b624c..52556bfd3375f7bb6bdaad732e21045852034d79 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -50,10 +50,15 @@ button:disabled { background-color: var(--color-button-disabled); cursor: not-allowed; } +button:hover { + background-color: var(--color-button-hover); + transition: 0.7s; +} a { text-decoration: none; - color: var(--color-link); + color: var(--color-text); + font-weight: bold; transition: 0.4s; } @@ -71,6 +76,10 @@ textarea { @media (hover: hover) { a:hover { - background-color: hsla(160, 100%, 37%, 0.2); + background-color: var(--color-nav-hover); + transition: 0.5s; + text-decoration: none; + padding: 6px 6px; + border-radius: 8px; } }