diff options
| author | Ryan Schanzenbacher <ryan@rschanz.org> | 2021-12-26 00:30:09 -0500 |
|---|---|---|
| committer | Ryan Schanzenbacher <ryan@rschanz.org> | 2021-12-26 00:30:09 -0500 |
| commit | 98a21b966410c127e74b16e7a2817882ee16560f (patch) | |
| tree | ee646c86e3d3f0fa1cd952294d49feeeb700d60f /themes/hugo-coder/assets/scss/_navigation.scss | |
| parent | e6eec31b71ab728f6610f4e764b2e206fb95f940 (diff) | |
convert theme from submodule to regular files
Diffstat (limited to 'themes/hugo-coder/assets/scss/_navigation.scss')
| m--------- | themes/hugo-coder | 0 | ||||
| -rw-r--r-- | themes/hugo-coder/assets/scss/_navigation.scss | 143 |
2 files changed, 143 insertions, 0 deletions
diff --git a/themes/hugo-coder b/themes/hugo-coder deleted file mode 160000 | |||
| Subproject 55b2a150f990bc56364dba347bc9acc6aab07be | |||
diff --git a/themes/hugo-coder/assets/scss/_navigation.scss b/themes/hugo-coder/assets/scss/_navigation.scss new file mode 100644 index 0000000..cd55a60 --- /dev/null +++ b/themes/hugo-coder/assets/scss/_navigation.scss | |||
| @@ -0,0 +1,143 @@ | |||
| 1 | .navigation { | ||
| 2 | height: 6rem; | ||
| 3 | width: 100%; | ||
| 4 | |||
| 5 | a, | ||
| 6 | span { | ||
| 7 | display: inline; | ||
| 8 | font-size: 1.7rem; | ||
| 9 | font-family: $font-family; | ||
| 10 | font-weight: 600; | ||
| 11 | color: $fg-color; | ||
| 12 | } | ||
| 13 | |||
| 14 | a { | ||
| 15 | |||
| 16 | &:hover, | ||
| 17 | &:focus { | ||
| 18 | color: $link-color; | ||
| 19 | } | ||
| 20 | } | ||
| 21 | |||
| 22 | .navigation-title { | ||
| 23 | letter-spacing: 0.1rem; | ||
| 24 | text-transform: uppercase; | ||
| 25 | } | ||
| 26 | |||
| 27 | .navigation-list { | ||
| 28 | float: right; | ||
| 29 | list-style: none; | ||
| 30 | margin-bottom: 0; | ||
| 31 | margin-top: 0; | ||
| 32 | |||
| 33 | @media only screen and (max-width: 768px) { | ||
| 34 | position: relative; | ||
| 35 | top: 2rem; | ||
| 36 | right: 0; | ||
| 37 | z-index: 5; | ||
| 38 | visibility: hidden; | ||
| 39 | opacity: 0; | ||
| 40 | padding: 0; | ||
| 41 | max-height: 0; | ||
| 42 | width: 100%; | ||
| 43 | background-color: $bg-color; | ||
| 44 | border-top: solid 2px $alt-bg-color; | ||
| 45 | border-bottom: solid 2px $alt-bg-color; | ||
| 46 | transition: opacity 0.25s, max-height 0.15s linear; | ||
| 47 | } | ||
| 48 | |||
| 49 | .navigation-item { | ||
| 50 | float: left; | ||
| 51 | margin: 0; | ||
| 52 | position: relative; | ||
| 53 | |||
| 54 | @media only screen and (max-width: 768px) { | ||
| 55 | float: none !important; | ||
| 56 | text-align: center; | ||
| 57 | |||
| 58 | a, | ||
| 59 | span { | ||
| 60 | line-height: 5rem; | ||
| 61 | } | ||
| 62 | } | ||
| 63 | |||
| 64 | a, | ||
| 65 | span { | ||
| 66 | margin-left: 1rem; | ||
| 67 | margin-right: 1rem; | ||
| 68 | } | ||
| 69 | } | ||
| 70 | |||
| 71 | .separator { | ||
| 72 | @media only screen and (max-width: 768px) { | ||
| 73 | display: none; | ||
| 74 | } | ||
| 75 | } | ||
| 76 | |||
| 77 | .menu-separator { | ||
| 78 | @media only screen and (max-width: 768px) { | ||
| 79 | border-top: 2px solid $fg-color; | ||
| 80 | margin: 0 8rem; | ||
| 81 | |||
| 82 | span { | ||
| 83 | display: none; | ||
| 84 | } | ||
| 85 | } | ||
| 86 | } | ||
| 87 | } | ||
| 88 | |||
| 89 | #dark-mode-toggle { | ||
| 90 | margin: 1.7rem 0; | ||
| 91 | font-size: 2.4rem; | ||
| 92 | line-height: inherit; | ||
| 93 | bottom: 2rem; | ||
| 94 | left: 2rem; | ||
| 95 | z-index: 100; | ||
| 96 | position: fixed; | ||
| 97 | } | ||
| 98 | |||
| 99 | #menu-toggle { | ||
| 100 | display: none; | ||
| 101 | |||
| 102 | @media only screen and (max-width: 768px) { | ||
| 103 | &:checked+label>i { | ||
| 104 | color: $alt-bg-color; | ||
| 105 | } | ||
| 106 | |||
| 107 | &:checked+label+ul { | ||
| 108 | visibility: visible; | ||
| 109 | opacity: 1; | ||
| 110 | max-height: 100rem; | ||
| 111 | } | ||
| 112 | } | ||
| 113 | } | ||
| 114 | |||
| 115 | .menu-button { | ||
| 116 | display: none; | ||
| 117 | |||
| 118 | @media only screen and (max-width: 768px) { | ||
| 119 | position: relative; | ||
| 120 | display: block; | ||
| 121 | font-size: 2.4rem; | ||
| 122 | font-weight: 400; | ||
| 123 | } | ||
| 124 | |||
| 125 | i { | ||
| 126 | |||
| 127 | &:hover, | ||
| 128 | &:focus { | ||
| 129 | color: $alt-fg-color; | ||
| 130 | } | ||
| 131 | } | ||
| 132 | } | ||
| 133 | |||
| 134 | i { | ||
| 135 | color: $fg-color; | ||
| 136 | cursor: pointer; | ||
| 137 | |||
| 138 | &:hover, | ||
| 139 | &:focus { | ||
| 140 | color: $link-color; | ||
| 141 | } | ||
| 142 | } | ||
| 143 | } | ||
