tgrosinger/orcashub-discourse-theme
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

UX: Small changes + prettier (#6)

Browse Source
This commit is contained in:
Jordan Vidrine 2022-01-05 10:40:03 -06:00 committed by GitHub
parent 129c49cdab
commit fc690dc1e5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 68 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
common/common.scss
View File

@ -19,14 +19,14 @@
border-radius: 0.25em; border-radius: 0.25em;
min-height: 40px; min-height: 40px;
&:focus { &:focus {
outline: 3px solid rgba(var(--primary-rgb),.35); outline: 3px solid rgba(var(--primary-rgb), 0.35);
} }
} }
.widget-link.show-help { .widget-link.show-help {
color: rgba(var(--primary-rgb),0.75); color: rgba(var(--primary-rgb), 0.75);
border-radius: 0.5em; border-radius: 0.5em;
padding: 0.5em; padding: 0.5em;
background-color: rgba(var(--secondary-rgb),0.25); background-color: rgba(var(--secondary-rgb), 0.25);
&:hover { &:hover {
color: var(--primary); color: var(--primary);
} }
@ -64,7 +64,8 @@
display: none; display: none;
} }
.topic-list th, .topic-list td { .topic-list .topic-list-header .topic-list-data,
.topic-list .topic-list-item .topic-list-data {
padding: 15px 5px; padding: 15px 5px;
} }
@ -101,12 +102,15 @@
} }
} }
.discourse-tags .discourse-tag.simple:not(:last-child)::after, .list-tags .discourse-tag.simple:not(:last-child)::after, .search-category .discourse-tag.simple:not(:last-child)::after { .discourse-tags .discourse-tag.simple:not(:last-child)::after,
.list-tags .discourse-tag.simple:not(:last-child)::after,
.search-category .discourse-tag.simple:not(:last-child)::after {
content: ""; content: "";
margin-left: unset; margin-left: unset;
} }
.topic-list .link-bottom-line .discourse-tag.simple:after, .topic-list .link-bottom-line .discourse-tag.box { .topic-list .link-bottom-line .discourse-tag.simple:after,
.topic-list .link-bottom-line .discourse-tag.box {
margin-right: 0px; margin-right: 0px;
} }
@ -143,7 +147,7 @@ div.ac-wrap {
border-radius: 4px; border-radius: 4px;
} }
.d-header { .d-header {
box-shadow: 0 2px 4px 0 rgba(0,0,0, 0.06); box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
} }
.d-header-icons .d-icon { .d-header-icons .d-icon {
@ -184,7 +188,7 @@ div.ac-wrap {
.menu-panel .widget-link:focus, .menu-panel .widget-link:focus,
.menu-panel .categories-link:hover, .menu-panel .categories-link:hover,
.menu-panel .categories-link:focus { .menu-panel .categories-link:focus {
background-color: rgba(var(--tertiary-rgb),0.5); background-color: rgba(var(--tertiary-rgb), 0.5);
} }
.btn:not(.themes-tab):not(.components-tab), .btn:not(.themes-tab):not(.components-tab),
@ -213,13 +217,20 @@ div.ac-wrap {
// graceful ish style // graceful ish style
@mixin box-shadow($value: 0px) { @mixin box-shadow($value: 0px) {
box-shadow: 0 24px 40px rgba(0,0,0,.07),0 10.8529px 24.1177px rgba(0,0,0,.0456112),0 4.50776px 10.0172px rgba(0,0,0,.035),0 1.63037px 3.62304px rgba(0,0,0,.0243888); box-shadow: 0 24px 40px rgba(0, 0, 0, 0.07),
0 10.8529px 24.1177px rgba(0, 0, 0, 0.0456112),
0 4.50776px 10.0172px rgba(0, 0, 0, 0.035),
0 1.63037px 3.62304px rgba(0, 0, 0, 0.0243888);
} }
html { html {
body { body {
background: linear-gradient(0deg, rgba(var(--primary-rgb),0.075) 0%, rgba(var(--primary-rgb),0.075) 100%), background: linear-gradient(
linear-gradient(0deg, var(--secondary) 100%, var(--secondary) 100%); 0deg,
rgba(var(--primary-rgb), 0.075) 0%,
rgba(var(--primary-rgb), 0.075) 100%
),
linear-gradient(0deg, var(--secondary) 100%, var(--secondary) 100%);
} }
.background-container { .background-container {
position: fixed; position: fixed;
@ -227,7 +238,11 @@ html {
left: 0; left: 0;
height: 100vh; height: 100vh;
width: 100vw; width: 100vw;
background: linear-gradient(90deg, var(--tertiary-hover) 0%, var(--tertiary) 100%); background: linear-gradient(
90deg,
var(--tertiary-hover) 0%,
var(--tertiary) 100%
);
clip-path: ellipse(148% 70% at 91% -14%); clip-path: ellipse(148% 70% at 91% -14%);
} }
} }
@ -308,20 +323,20 @@ html body #main-outlet {
.topic-list-item { .topic-list-item {
width: 100%; width: 100%;
display: flex; display: flex;
margin-bottom: .5em; margin-bottom: 0.5em;
background-color: var(--secondary); background-color: var(--secondary);
border: 1px solid rgba(var(--primary-rgb),0.20); border: 1px solid rgba(var(--primary-rgb), 0.2);
border-radius: 1em; border-radius: 1em;
position: relative; position: relative;
transition: box-shadow 100ms ease-in-out; transition: box-shadow 100ms ease-in-out;
box-shadow: 0px 0px 8px rgba(0,0,0,0.05); box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
&.visited { &.visited {
border: 1px solid rgba(var(--primary-rgb),0.10); border: 1px solid rgba(var(--primary-rgb), 0.1);
.discourse-tag { .discourse-tag {
opacity: 0.75; opacity: 0.75;
} }
&:hover { &:hover {
border: 1px solid rgba(var(--primary-rgb),0.25); border: 1px solid rgba(var(--primary-rgb), 0.25);
.discourse-tag { .discourse-tag {
opacity: 1; opacity: 1;
} }
@ -329,8 +344,8 @@ html body #main-outlet {
} }
&:hover { &:hover {
background-color: var(--secondary); background-color: var(--secondary);
box-shadow: 0px 0px 12px rgba(0,0,0,0.10); box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.1);
border: 1px solid rgba(var(--primary-rgb),0.30); border: 1px solid rgba(var(--primary-rgb), 0.3);
a.title:not(.badge-notification), a.title:not(.badge-notification),
a.topic-excerpt { a.topic-excerpt {
color: var(--primary) !important; color: var(--primary) !important;
@ -348,7 +363,7 @@ html body #main-outlet {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
a:not(:first-of-type) { a:not(:first-of-type) {
display: none display: none;
} }
} }
.topic-list-data.posts { .topic-list-data.posts {
@ -429,9 +444,10 @@ html body #main-outlet {
} }
} }
} }
.posts-map, .num.age.activity { .posts-map,
a { .num.age.activity {
padding: 0 a {
padding: 0;
} }
} }
.posts-map { .posts-map {
@ -464,7 +480,10 @@ html body #main-outlet {
background: var(--secondary); background: var(--secondary);
border-radius: 1em; border-radius: 1em;
padding: 3em 3em 5%; padding: 3em 3em 5%;
box-shadow: 0 24px 40px rgba(0,0,0,0.07),0 10.8529px 24.1177px rgba(0,0,0,0.0456112),0 4.50776px 10.0172px rgba(0,0,0,0.035),0 1.63037px 3.62304px rgba(0,0,0,0.0243888); box-shadow: 0 24px 40px rgba(0, 0, 0, 0.07),
0 10.8529px 24.1177px rgba(0, 0, 0, 0.0456112),
0 4.50776px 10.0172px rgba(0, 0, 0, 0.035),
0 1.63037px 3.62304px rgba(0, 0, 0, 0.0243888);
z-index: 1; z-index: 1;
position: relative; position: relative;
} }
@ -474,7 +493,11 @@ html body #main-outlet {
display: none; display: none;
} }
&::before { &::before {
background: linear-gradient(90deg, var(--tertiary-hover) 0%, var(--tertiary) 100%); background: linear-gradient(
90deg,
var(--tertiary-hover) 0%,
var(--tertiary) 100%
);
clip-path: ellipse(148% 70% at 91% -14%); clip-path: ellipse(148% 70% at 91% -14%);
content: ""; content: "";
width: 100%; width: 100%;
@ -483,4 +506,9 @@ html body #main-outlet {
position: fixed; position: fixed;
z-index: 0; z-index: 0;
} }
} }
.quote-button {
background-color: var(--primary-low-mid);
border-radius: 0.5em;
}

14
scss/showcased-categories.scss
View File

@ -1,3 +1,17 @@
.showcased-categories-sidebar .two-topic-list-sidebar {
.topic-excerpt {
display: none;
}
.btn-link.posts-map.badge-posts {
display: block;
}
.two-topic-list-sidebar .topic-list .topic-list-item {
height: unset;
}
}
.showcased-categories-sidebar { .showcased-categories-sidebar {
.full-width .contents .topic-list { .full-width .contents .topic-list {
display: unset; display: unset;