aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authortdro <tdro@noreply.example.com>2022-10-13 00:29:30 -0400
committertdro <tdro@noreply.example.com>2022-10-13 00:29:30 -0400
commitc9c54c0a99b775649beb78328b49ebe954984d11 (patch)
tree3e3eec93b18ec09507300567e4c94c7149a54365
parentea2ea34bf15a70d3515dd9f0713d942faefb357d (diff)
downloadcanory-c9c54c0a99b775649beb78328b49ebe954984d11.tar.gz
canory-c9c54c0a99b775649beb78328b49ebe954984d11.tar.bz2
canory-c9c54c0a99b775649beb78328b49ebe954984d11.zip
themes/default/layouts/partials/profile-tabs: tab-list -> tab-bar
Add more specificity to nav elements and set up for adding more items to tab bar.
-rw-r--r--assets/css/default.css56
-rw-r--r--themes/default/layouts/_default/drafts.html2
-rw-r--r--themes/default/layouts/_default/feeds.html2
-rw-r--r--themes/default/layouts/_default/likes.html2
-rw-r--r--themes/default/layouts/_default/media.html2
-rw-r--r--themes/default/layouts/_default/section.html4
-rw-r--r--themes/default/layouts/partials/profile-tabs.html8
7 files changed, 40 insertions, 36 deletions
diff --git a/assets/css/default.css b/assets/css/default.css
index dae16e4..d0bf2ef 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -138,8 +138,8 @@
color: var(--warning);
}
-:hover:not(a):not(s):not(img):not(summary):not(nav):not(abbr):not(form):not(code):not(mark):not(tab-list):not(tab-list
- aside) {
+:hover:not(a):not(s):not(img):not(summary):not(nav):not(abbr):not(form):not(code):not(mark):not(tab-bar):not(tab-bar
+ nav) {
border-radius: 0.5rem;
}
@@ -1203,17 +1203,16 @@ micro-unsafe details[open] + micro-unsafe-content * {
pointer-events: auto;
}
-tab-list {
+tab-bar {
display: inline-block;
overflow-x: auto;
overflow-y: hidden;
- text-overflow: ellipsis;
vertical-align: top;
white-space: nowrap;
width: 100%;
}
-tab-list aside {
+tab-bar nav {
display: flex;
justify-content: center;
border-bottom: 1px solid;
@@ -1222,7 +1221,7 @@ tab-list aside {
min-width: 450px;
}
-tab-list aside a {
+tab-bar nav a {
border-left: 1px solid;
border-right: 1px solid;
border-top-left-radius: 0.5rem;
@@ -1240,20 +1239,20 @@ tab-list aside a {
border-bottom: 2px solid var(--background);
}
-tab-list aside a:not(:last-child) {
+tab-bar nav a:not(:last-child) {
margin-right: 0.5rem;
}
-tab-list aside a[data-draft] {
+tab-bar nav a[data-draft] {
color: #8f0000;
color: var(--danger);
}
-tab-list aside a:hover {
+tab-bar nav a:hover {
text-decoration: underline;
}
-column-middle nav {
+column-middle main > nav {
align-items: center;
background-color: #fefefe;
background-color: var(--background);
@@ -1269,21 +1268,21 @@ column-middle nav {
height: 4rem;
}
-column-middle nav section h2,
-column-middle nav section small {
+column-middle main > nav section h2,
+column-middle main > nav section small {
margin: 0;
}
micro-author micro-header h2,
micro-author micro-header h3,
-column-middle nav section h2,
-column-middle nav section small {
+column-middle main > nav section h2,
+column-middle main > nav section small {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
-column-middle nav section {
+column-middle main > nav section {
line-height: 1.25;
padding: 0 0.5rem;
}
@@ -1890,10 +1889,10 @@ main micro-card:first-of-type reaction-tip img {
@media screen and (max-width: 1055px) {
column-left,
search-entry,
- column-middle nav section {
+ column-middle main > nav section {
display: none;
}
- column-middle nav {
+ column-middle main > nav {
justify-content: space-between;
overflow-x: auto;
overflow-y: hidden;
@@ -1911,7 +1910,7 @@ main micro-card:first-of-type reaction-tip img {
display: block;
max-width: 100%;
}
- column-middle nav {
+ column-middle main > nav {
position: fixed;
}
micro-card {
@@ -1948,15 +1947,20 @@ main micro-card:first-of-type reaction-tip img {
display: block;
overflow-y: scroll;
}
- nav {
+ column-middle main > nav {
box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.2);
}
- nav:active,
- nav:hover,
- nav:focus,
- nav:focus-within,
- nav:focus-visible {
- box-shadow: 15px 0 15px -15px inset, -15px 0 15px -15px inset;
+ tab-bar:active,
+ tab-bar:hover,
+ tab-bar:focus,
+ tab-bar:focus-within,
+ tab-bar:focus-visible,
+ column-middle main > nav:active,
+ column-middle main > nav:hover,
+ column-middle main > nav:focus,
+ column-middle main > nav:focus-within,
+ column-middle main > nav:focus-visible {
+ box-shadow: 1rem 0 1rem -1rem inset, -1rem 0 1rem -1rem inset;
}
}
@@ -1988,7 +1992,7 @@ main micro-card:first-of-type reaction-tip img {
display: none;
}
main > footer,
- column-middle nav,
+ column-middle main > nav,
navigation-separator hr[hidden] {
display: none;
}
diff --git a/themes/default/layouts/_default/drafts.html b/themes/default/layouts/_default/drafts.html
index 635f17b..569af84 100644
--- a/themes/default/layouts/_default/drafts.html
+++ b/themes/default/layouts/_default/drafts.html
@@ -3,7 +3,7 @@
<style>
{{ partial "styles-navigator.html" (dict "Link" "/") | safeCSS }}
- tab-list a[href="{{ .Site.BaseURL }}/{{ $author }}/drafts/"] {
+ tab-bar a[href="{{ .Site.BaseURL }}/{{ $author }}/drafts/"] {
color: #111;
color: var(--foreground);
display: inherit;
diff --git a/themes/default/layouts/_default/feeds.html b/themes/default/layouts/_default/feeds.html
index 332c455..71e6328 100644
--- a/themes/default/layouts/_default/feeds.html
+++ b/themes/default/layouts/_default/feeds.html
@@ -3,7 +3,7 @@
<style>
{{ partial "styles-navigator.html" (dict "Link" "/") | safeCSS }}
- tab-list a[href="{{ .Site.BaseURL }}/{{ $author }}/feeds/"] {
+ tab-bar a[href="{{ .Site.BaseURL }}/{{ $author }}/feeds/"] {
color: #111;
color: var(--foreground);
display: inherit;
diff --git a/themes/default/layouts/_default/likes.html b/themes/default/layouts/_default/likes.html
index f37159c..ccd75fb 100644
--- a/themes/default/layouts/_default/likes.html
+++ b/themes/default/layouts/_default/likes.html
@@ -3,7 +3,7 @@
<style>
{{ partial "styles-navigator.html" (dict "Link" "/") | safeCSS }}
- tab-list a[href="{{ .Site.BaseURL }}/{{ $author }}/likes/"] {
+ tab-bar a[href="{{ .Site.BaseURL }}/{{ $author }}/likes/"] {
color: #111;
color: var(--foreground);
display: inherit;
diff --git a/themes/default/layouts/_default/media.html b/themes/default/layouts/_default/media.html
index f4bb3a9..a140801 100644
--- a/themes/default/layouts/_default/media.html
+++ b/themes/default/layouts/_default/media.html
@@ -3,7 +3,7 @@
<style>
{{ partial "styles-navigator.html" (dict "Link" "/") | safeCSS }}
- tab-list a[href="{{ .Site.BaseURL }}/{{ $author }}/media/"] {
+ tab-bar a[href="{{ .Site.BaseURL }}/{{ $author }}/media/"] {
color: #111;
color: var(--foreground);
display: inherit;
diff --git a/themes/default/layouts/_default/section.html b/themes/default/layouts/_default/section.html
index 2708e89..ccb2746 100644
--- a/themes/default/layouts/_default/section.html
+++ b/themes/default/layouts/_default/section.html
@@ -2,8 +2,8 @@
<style>
{{ partial "styles-navigator.html" (dict "Link" "/") | safeCSS }}
- tab-list a[href="{{ .CurrentSection.Permalink }}"],
- tab-list a[href="{{ strings.TrimRight "/" .CurrentSection.Permalink }}"] {
+ tab-bar a[href="{{ .CurrentSection.Permalink }}"],
+ tab-bar a[href="{{ strings.TrimRight "/" .CurrentSection.Permalink }}"] {
color: #111;
color: var(--foreground);
display: inherit;
diff --git a/themes/default/layouts/partials/profile-tabs.html b/themes/default/layouts/partials/profile-tabs.html
index e04cac7..e5c0385 100644
--- a/themes/default/layouts/partials/profile-tabs.html
+++ b/themes/default/layouts/partials/profile-tabs.html
@@ -1,7 +1,7 @@
{{- $author := partial "function-authors-data.html" . -}}
-<tab-list>
- <aside>
+<tab-bar>
+ <nav>
<a href="{{ .Site.BaseURL }}/{{ $author.user }}">Messages</a>
<a href="{{ .Site.BaseURL }}/{{ $author.user }}/feeds/">Feeds</a>
<a href="{{ .Site.BaseURL }}/{{ $author.user }}/media/">Media</a>
@@ -9,5 +9,5 @@
{{- if .Site.BuildDrafts }}
<a data-draft href="{{ .Site.BaseURL }}/{{ $author.user }}/drafts/">Drafts</a>
{{- end }}
- </aside>
-</tab-list>
+ </nav>
+</tab-bar>