aboutsummaryrefslogtreecommitdiff
path: root/sass/include/_nav.scss
diff options
context:
space:
mode:
Diffstat (limited to 'sass/include/_nav.scss')
-rw-r--r--sass/include/_nav.scss62
1 files changed, 62 insertions, 0 deletions
diff --git a/sass/include/_nav.scss b/sass/include/_nav.scss
new file mode 100644
index 0000000..9dd4dac
--- /dev/null
+++ b/sass/include/_nav.scss
@@ -0,0 +1,62 @@
+/**
+ * Horizontal Nav
+ * https://github.com/raj457036/attriCSS
+ */
+main nav a,
+main nav a:visited {
+ font-weight: var(--fh);
+ border: .1rem solid var(--f2);
+ border-radius: var(--br);
+ padding: .3rem var(--s1);
+ margin: var(--s1);
+}
+main nav a:hover {
+ border-color: var(--a3);
+}
+nav {
+ align-items: center;
+ display: flex;
+ justify-content: space-between;
+ div {
+ ul {
+ line-height: 0;
+ margin-top: 0;
+ padding-bottom: var(--s1);
+ }
+ display: block;
+ margin-left: auto
+ }
+ div h2 {
+ font-size: 1rem;
+ &:hover {
+ color: var(--a3);
+ }
+ }
+ header {
+ display: inline;
+ }
+ header h1, div ul {
+ margin-bottom: 0
+ }
+ ul li {
+ display: inline-block;
+ margin: 0 0.2rem;
+ position: relative;
+ text-align: left;
+ }
+}
+
+@if map-get($breakpoints, "md") {
+ @media (max-width: map-get($breakpoints, "md")) {
+ header nav {
+ display: flex;
+ flex-direction: column;
+ header {
+ text-align: center
+ }
+ div {
+ margin: auto
+ }
+ }
+ }
+}