diff --git a/css/styles.css b/css/styles.css index 8e9387d..12adca0 100644 --- a/css/styles.css +++ b/css/styles.css @@ -259,11 +259,12 @@ nav { font-size: small; border-radius: 25px; border: solid 1px lightgray; + background-color: white; margin: 0 2px; padding: 0 5px; color: #901c1c; } -.tags li a:hover, .tags li a:focus { +.tags li a.selected, .tags li a:hover, .tags li a:focus { cursor: pointer; border-radius: 25px; border: solid 1px #901c1c; diff --git a/sass/layout/_nav.scss b/sass/layout/_nav.scss index 6d45d16..ae8d567 100644 --- a/sass/layout/_nav.scss +++ b/sass/layout/_nav.scss @@ -4,26 +4,56 @@ font-size: $s; border-radius: 25px; border: solid 1px $secondaire-border; + background-color: white; margin: 0 2px; padding: 0 5px; color: $secondaire-txt; - } - & li a:hover, - & li a:focus { - cursor: pointer; - border-radius: 25px; - border: solid 1px $primaire-border; - background-color: $primaire-bg; - color: $primaire-a; - } + &.selected, + &:hover, + &:focus { + cursor: pointer; + border-radius: 25px; + border: solid 1px $primaire-border; + background-color: $primaire-bg; + color: $primaire-a; + } - & li a:focus { - outline: none; - box-shadow: 0 0 0 2px white, 0 0 0 4px $primaire-bg; + &:focus { + outline: none; + box-shadow: 0 0 0 2px white, 0 0 0 4px $primaire-bg; + } } } +// .tags { +// li a { +// text-align: center; +// font-size: $s; +// border-radius: 25px; +// border: solid 1px $secondaire-border; +// background-color: white; +// margin: 0 2px; +// padding: 0 5px; +// color: $secondaire-txt; +// } + +// & li a.selected, +// & li a:hover, +// & li a:focus { +// cursor: pointer; +// border-radius: 25px; +// border: solid 1px $primaire-border; +// background-color: $primaire-bg; +// color: $primaire-a; +// } + +// & li a:focus { +// outline: none; +// box-shadow: 0 0 0 2px white, 0 0 0 4px $primaire-bg; +// } +// } + @media only screen and (max-width: 426px) { .tags { li a {