diff --git a/src/app/toolbar/toolbar.component.css b/src/app/toolbar/toolbar.component.css index 32417df..54dbd9b 100644 --- a/src/app/toolbar/toolbar.component.css +++ b/src/app/toolbar/toolbar.component.css @@ -1,4 +1,4 @@ -span { +a { margin-left: 1em; margin-right: 1em; -webkit-transition: color 300ms; @@ -8,13 +8,20 @@ span { transition: color 300ms; } -span:hover { - color: var(--nord7); - cursor: pointer; +a:hover { + color: var(--nord13); } @media (max-width: 425px) { - span { - font-size: 14px; + a { + font-size: 15px; + margin-left: .8em; + margin-right: .8em; } } + +a { + color: var(--nord4); + text-decoration: none; +} + diff --git a/src/app/toolbar/toolbar.component.html b/src/app/toolbar/toolbar.component.html index 1ceea7c..cc5f0c3 100644 --- a/src/app/toolbar/toolbar.component.html +++ b/src/app/toolbar/toolbar.component.html @@ -1,8 +1,8 @@ - - - Home - Resume - Projects - Contact - - + + + Home + Resume + Projects + Contact + + diff --git a/src/styles.css b/src/styles.css index c72c62b..7a33d0f 100644 --- a/src/styles.css +++ b/src/styles.css @@ -1,7 +1,7 @@ /* You can add global styles to this file, and also import other style files */ @import "~@angular/material/prebuilt-themes/pink-bluegrey.css"; -h1, h2, h3, p, span { +h1, h2, h3, p, span, a { font-family: Roboto, "Helvetica Neue", sans-serif; font-weight: 300; } @@ -114,5 +114,5 @@ html, body { } .active { - color: var(--nord7); + color: var(--nord7) !important; }