diff --git a/.github/workflows/discourse-theme.yml b/.github/workflows/discourse-theme.yml
deleted file mode 100644
index 8adaaec1..00000000
--- a/.github/workflows/discourse-theme.yml
+++ /dev/null
@@ -1,11 +0,0 @@
-name: Discourse Theme
-
-on:
- push:
- branches:
- - main
- pull_request:
-
-jobs:
- ci:
- uses: discourse/.github/.github/workflows/discourse-theme.yml@v1
diff --git a/README.md b/README.md
deleted file mode 100644
index 09cbacf9..00000000
--- a/README.md
+++ /dev/null
@@ -1,74 +0,0 @@
-
-
-A clean & modern theme with a handful of theme-components included to enhance your forum!
-
-
-
-**Light Mode**
-
-
-
-**Dark Mode**
-
-
-
-**Categories Page**
-
-
-
-This theme includes a handful of components to enhance your forum as well.
-
-- Dark Light Scheme Toggle
-- Clickable Topics
-- Discourse Loading Slider
-- Discourse Search Banner
-- Modern Category + Group Boxes
-
-> :exclamation: Please read through these tips upon installation, as there are a couple of settings that **NEED TO BE ENABLED** for this to theme to render properly.
-
----
-
-# Tips
-
-### Dark Light Scheme Toggle
-
-
-
-For this to work properly, at least 2 color scheme choices need to be enabled in your `https://discourse.jordanvidrine.com/admin/customize/colors` area. At least two colors need to have `color scheme can be selected by users` enabled.
-
-
-
-Once this is done, users should be able to choose between two color schemes as their `light` and `dark` preferences in their user preferences interface menu.
-
-
-
----
-
-## Discourse Search Banner
-
-In the options for the `discourse-search-banner` theme component, the `plugin-outlet` options needs to be set to **BELOW-SITE-HEADER** for this theme to render properly.
-
-
-
----
-
-## Modern Category + Group Boxes
-
-This theme component requires your categories to use the **CATEGORY BOXES WITH SUBCATEGORIES** setting in your `/admin/site_settings/category/all_results?filter=categories` area.
-
-
-
-This theme component also allows the forum admin to organize their category page with header titles, and choose which categories appear under each header. To keep things simple, I have only allowed up to 5 headings to be used. **If no categories + heading settings are chosen, all categories will render as they do above, this is the default rendering option.**
-
----
-
-Feel free to post any issues here :grinning_face_with_smiling_eyes:
-
-I hope you enjoy!
-
-| | | |
-| ------------------- | ---------------------------- | --------------------------------------------------------------------------------------------------------------------------- |
-| :eyeglasses: | **Preview** | https://discourse.jordanvidrine.com/ |
-| :hammer_and_wrench: | **Repository** | https://github.com/discourse/discourse-air.git |
-| :question: | **Install Guide** | [How to install a theme or theme component](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682) |
-| :open_book: | **New to Discourse Themes?** | [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) |
diff --git a/about.json b/about.json
index 22db2a9e..bbdc9f54 100644
--- a/about.json
+++ b/about.json
@@ -1,39 +1,49 @@
{
- "name": "Air Theme",
- "about_url": "https://meta.discourse.org/t/discourse-air-theme/197703",
- "license_url": "https://github.com/discourse/discourse-air/blob/main/LICENSE",
- "components": [
- "https://github.com/jordanvidrine/discourse-category-group-boxes.git",
- "https://github.com/discourse/discourse-clickable-topic.git",
- "https://github.com/discourse/discourse-search-banner.git"
- ],
+ "name": "Techlore Theme",
+ "about_url": "https://github.com/techlore/discourse-techlore#readme",
+ "license_url": "https://github.com/techlore/discourse-techlore/blob/main/LICENSE",
+ "assets": {
+ "simplelogin": "assets/simplelogin.png",
+ "lato-bold": "assets/lato-bold.ttf",
+ "lato-bolditalic": "assets/lato-bolditalic.ttf",
+ "lato-italic": "assets/lato-italic.ttf",
+ "lato-regular": "assets/lato-regular.ttf",
+ "nunito-bold": "assets/nunito-bold.ttf",
+ "nunito-bolditalic": "assets/nunito-bolditalic.ttf",
+ "nunito-italic": "assets/nunito-italic.ttf",
+ "nunito-regular": "assets/nunito-regular.ttf"
+ },
"modifiers": {
"serialize_topic_excerpts": true
},
"color_schemes": {
- "air-light": {
- "primary": "1c1c1c",
- "secondary": "f9fcff",
- "tertiary": "3877e5",
- "quaternary": "7e8b93",
- "header_background": "f9fcff",
- "header_primary": "122b43",
+ "techlore-light": {
+ "primary": "000000",
+ "secondary": "ffffff",
+ "tertiary": "5574e6",
+ "quaternary": "5574e6",
+ "header_background": "ffffff",
+ "header_primary": "000000",
"highlight": "e6cb37",
- "danger": "d05454",
- "success": "71bd9f",
- "love": "c16ad7"
+ "danger": "ee5128",
+ "success": "7cbb41",
+ "love": "c16ad7",
+ "hover": "f1f1f1",
+ "selected": "e8e8e8"
},
- "air-dark": {
- "primary": "e0e0e0",
- "secondary": "2d2d2d",
- "tertiary": "9a5cfd",
- "quaternary": "71bd9f",
- "header_background": "202020",
- "header_primary": "e0e0e0",
- "highlight": "9a5cfd",
- "danger": "d05454",
- "success": "71bd9f",
- "love": "c16ad7"
+ "techlore-dark": {
+ "primary": "ffffff",
+ "secondary": "121f36",
+ "tertiary": "5574e6",
+ "quaternary": "5574e6",
+ "header_background": "000000",
+ "header_primary": "ffffff",
+ "highlight": "3877e5",
+ "danger": "ee5128",
+ "success": "7cbb41",
+ "love": "c16ad7",
+ "hover": "313131",
+ "selected": "2d2d2d"
}
},
"screenshots": ["screenshots/light.png", "screenshots/dark.png"]
diff --git a/assets/lato-bold.ttf b/assets/lato-bold.ttf
new file mode 100644
index 00000000..1d23c706
Binary files /dev/null and b/assets/lato-bold.ttf differ
diff --git a/assets/lato-bolditalic.ttf b/assets/lato-bolditalic.ttf
new file mode 100644
index 00000000..a3b8e332
Binary files /dev/null and b/assets/lato-bolditalic.ttf differ
diff --git a/assets/lato-italic.ttf b/assets/lato-italic.ttf
new file mode 100644
index 00000000..70a870f4
Binary files /dev/null and b/assets/lato-italic.ttf differ
diff --git a/assets/lato-regular.ttf b/assets/lato-regular.ttf
new file mode 100644
index 00000000..0f3d0f83
Binary files /dev/null and b/assets/lato-regular.ttf differ
diff --git a/assets/nunito-bold.ttf b/assets/nunito-bold.ttf
new file mode 100644
index 00000000..f41ef203
Binary files /dev/null and b/assets/nunito-bold.ttf differ
diff --git a/assets/nunito-bolditalic.ttf b/assets/nunito-bolditalic.ttf
new file mode 100644
index 00000000..8f2d05ac
Binary files /dev/null and b/assets/nunito-bolditalic.ttf differ
diff --git a/assets/nunito-italic.ttf b/assets/nunito-italic.ttf
new file mode 100644
index 00000000..3d21302c
Binary files /dev/null and b/assets/nunito-italic.ttf differ
diff --git a/assets/nunito-regular.ttf b/assets/nunito-regular.ttf
new file mode 100644
index 00000000..1f038185
Binary files /dev/null and b/assets/nunito-regular.ttf differ
diff --git a/assets/simplelogin.png b/assets/simplelogin.png
new file mode 100644
index 00000000..b5688c56
Binary files /dev/null and b/assets/simplelogin.png differ
diff --git a/common/common.scss b/common/common.scss
index b157ed90..c79b2ca4 100644
--- a/common/common.scss
+++ b/common/common.scss
@@ -1,8 +1,97 @@
+@font-face {
+ font-family: 'Lato';
+ font-style: italic;
+ font-weight: 400;
+ font-display: swap;
+ src: url($lato-italic) format('opentype');
+}
+@font-face {
+ font-family: 'Lato';
+ font-style: italic;
+ font-weight: 700;
+ font-display: swap;
+ src: url($lato-bolditalic) format('opentype');
+}
+@font-face {
+ font-family: 'Lato';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: url($lato-regular) format('opentype');
+}
+@font-face {
+ font-family: 'Lato';
+ font-style: normal;
+ font-weight: 700;
+ font-display: swap;
+ src: url($lato-bold) format('opentype');
+}
+@font-face {
+ font-family: 'Nunito';
+ font-style: italic;
+ font-weight: 400;
+ font-display: swap;
+ src: url($nunito-italic) format('opentype');
+}
+@font-face {
+ font-family: 'Nunito';
+ font-style: italic;
+ font-weight: 700;
+ font-display: swap;
+ src: url($nunito-bolditalic) format('opentype');
+}
+@font-face {
+ font-family: 'Nunito';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: url($nunito-regular) format('opentype');
+}
+@font-face {
+ font-family: 'Nunito';
+ font-style: normal;
+ font-weight: 700;
+ font-display: swap;
+ src: url($nunito-bold) format('opentype');
+}
+
+:root {
+ --heading-font-family: 'Nunito', sans-serif !important;
+ --font-family: "Lato", sans-serif !important;
+ --base-font-size: 1em;
+}
+
+.names {
+ .techlore ~ .user-title a {
+ color: white;
+ }
+}
+
+.custom-footer .first-box .heading {
+ font-family: var(--heading-font-family);
+}
+
+.d-user-card__main-content {
+ opacity: 90%;
+}
+
+body.crawler {
+ background: var(--secondary);
+}
+
+body.crawler div.background-container {
+ display: none;
+}
+
+body.category-techlore-content button.btn.expand-post {
+ display: none;
+}
+
// custom search banner customizations
.custom-search-banner-wrap {
margin: 0 auto !important;
max-width: unset;
- color: var(--secondary);
+ color: white;
h1 {
font-size: 4em;
}
@@ -24,7 +113,7 @@
}
.widget-link.show-help {
color: rgba(var(--primary-rgb), 0.75);
- border-radius: 0.5em;
+ border-radius: 0.3em;
padding: 0.5em;
background-color: rgba(var(--secondary-rgb), 0.25);
&:hover {
@@ -33,11 +122,12 @@
}
.search-menu .search-input {
border-color: var(--tertiary-hover);
+ border-radius: 0.3em;
outline: 1px solid var(--tertiary-hover);
}
.results {
top: 43px;
- border-radius: 0.25em;
+ border-radius: 0 0 .3em .3em;
}
.search-context {
top: 3.25em;
@@ -174,7 +264,7 @@ div.ac-wrap {
border-radius: 4px;
}
.d-header {
- box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
+ box-shadow: none;
}
.d-header-icons .d-icon {
@@ -196,7 +286,7 @@ div.ac-wrap {
.menu-panel.drop-down {
margin-top: 1em;
- border-radius: 0.5em;
+ border-radius: 0.3em;
border: 1px solid var(--primary-low-mid);
}
@@ -220,7 +310,7 @@ div.ac-wrap {
.btn:not(.themes-tab):not(.components-tab),
.select-kit.dropdown-select-box .dropdown-select-box-header {
- border-radius: 8px;
+ border-radius: 0.3em;
border: 1px solid transparent;
}
@@ -252,36 +342,55 @@ div.ac-wrap {
html {
body:not(.no-ember) {
- background: linear-gradient(
- 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: var(--tertiary);
}
.background-container {
- position: fixed;
- top: 0;
- left: 0;
- height: 100vh;
- width: 100vw;
- background: linear-gradient(
- 90deg,
- var(--tertiary-hover) 0%,
- var(--tertiary) 100%
- );
- clip-path: ellipse(148% 70% at 91% -14%);
+ height: 0em;
+ width: 100%;
+ background: black;
}
body.no-ember .background-container {
display: none;
}
+ .background-overflow-container {
+ overflow-x: hidden;
+ }
+ svg.background-wavet, svg.background-wavet-2 {
+ margin-top: 50px;
+ height: 100px;
+ min-width: 100vw;
+ }
+ svg.background-wavet-2 {
+ position: relative;
+ top: -140px;
+ }
+}
+
+.background-wave, .background-wave-2 {
+ animation: wave 10s linear;
+ animation-iteration-count: infinite;
+ fill: var(--header_background);
+
+ @keyframes wave {
+ 100% {
+ transform: translateX(-100%);
+ }
+ }
+}
+
+.background-wave-2 {
+ opacity: 50%;
+}
+
+.d-header-wrap {
+ margin-bottom: 5em;
}
html body #main-outlet {
margin-top: 30px;
margin-bottom: 50px;
background: var(--secondary);
- border-radius: 1em;
+ border-radius: 0.3em;
padding: 3em 3em 5%;
max-width: 1150px;
.archetype-regular & {
@@ -303,7 +412,7 @@ html body #main-outlet {
.nav-pills:not(.user-nav) > li a.active,
.nav-pills:not(.user-nav) > li > a {
- border-radius: 0.5em;
+ border-radius: 0.3em;
}
.category-calendar {
@@ -349,6 +458,7 @@ html body #main-outlet {
}
.topic-list-data.posters {
width: 7%;
+ min-width: 66px;
}
.topic-list-data.posts {
width: 15%;
@@ -373,7 +483,7 @@ html body #main-outlet {
margin-bottom: 0.5em;
background-color: var(--secondary);
border: 1px solid rgba(var(--primary-rgb), 0.2);
- border-radius: 1em;
+ border-radius: 0.3em;
position: relative;
transition: box-shadow 100ms ease-in-out;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
@@ -405,14 +515,21 @@ html body #main-outlet {
}
.topic-list-data.posters {
width: 7%;
+ min-width: 66px;
order: 1;
height: auto;
display: flex;
justify-content: center;
align-items: center;
- a:not(.latest) {
+ a:not(:first-of-type) {
display: none;
}
+ a.latest:not(:first-of-type) {
+ display: block;
+ position: relative;
+ right: 5px;
+ top: 20px;
+ }
}
.topic-list-data.posts {
width: 15%;
@@ -436,7 +553,7 @@ html body #main-outlet {
display: none;
}
-.full-width .contents .topic-list .topic-list-item .posters a.latest {
+.full-width .contents .topic-list .topic-list-item .posters a:first-of-type {
margin-right: 4px;
width: 100%;
height: 100%;
@@ -478,14 +595,20 @@ html body #main-outlet {
.avatar {
width: 40px;
height: 40px;
- border-radius: 8px;
+ border-radius: 0.3em;
}
- a.latest {
+ a:first-of-type {
.avatar {
margin-right: 0;
}
}
- a:not(.latest) {
+ a.latest:not(:first-of-type) {
+ .avatar {
+ width: 30px;
+ height: 30px;
+ }
+ }
+ a:not(:first-of-type) {
margin-left: -22px;
.avatar {
border: 3px solid var(--secondary);
@@ -523,10 +646,10 @@ html body #main-outlet {
// published page additions
.published-page-content-wrapper {
max-width: 1000px;
- margin-top: 30px;
+ margin-top: 100px;
margin-bottom: 50px;
background: var(--secondary);
- border-radius: 1em;
+ border-radius: 0.3em;
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),
@@ -534,30 +657,22 @@ html body #main-outlet {
0 1.63037px 3.62304px rgba(0, 0, 0, 0.0243888);
z-index: 1;
position: relative;
+ .published-page-author {
+ display: none;
+ }
}
.published-page {
- .background-container {
- display: none;
+ .published-page-header .published-page-header-wrapper {
+ max-width: 1000px;
}
- &::before {
- background: linear-gradient(
- 90deg,
- var(--tertiary-hover) 0%,
- var(--tertiary) 100%
- );
- clip-path: ellipse(148% 70% at 91% -14%);
- content: "";
- width: 100%;
- height: 100%;
- display: block;
- position: fixed;
- z-index: 0;
+ .background-container {
+ position: absolute;
}
}
.quote-button {
- border-radius: 0.5em;
+ border-radius: 0.3em;
}
.topic-list tr.selected td:nth-child(2),
@@ -582,6 +697,234 @@ html body #main-outlet {
box-shadow: none;
}
+// From discourse-easy-footer component:
+
+.custom-footer {
+ display: flex;
+ flex-wrap: wrap;
+ background: var(--primary);
+ .wrap {
+ box-sizing: border-box;
+ }
+ .flexbox {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ color: var(--secondary);
+ padding: 2em 0 1em 0;
+ }
+ .first-box {
+ max-width: 20%;
+ .heading {
+ font-size: $font-up-2;
+ font-weight: bold;
+ margin-bottom: 0.5em;
+ display: block;
+ }
+ .blurb {
+ color: var(--secondary-high);
+ }
+ }
+ .second-box {
+ flex: 1;
+ .links {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: flex-end;
+ ul {
+ list-style: none;
+ margin: 0;
+ min-width: 100px;
+ }
+ li {
+ margin: 0.5em 0;
+ }
+ }
+ }
+ .third-box {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ border-top: 1px solid rgba(var(--primary-low-rgb), 0.05);
+ .social {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ justify-content: flex-end;
+ .social-link {
+ margin: 20px 10px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .d-icon {
+ color: var(--secondary);
+ min-width: unset;
+ margin: 0;
+ font-size: $font-up-2;
+ opacity: 1;
+ }
+ }
+ }
+ .small-link {
+ color: var(--secondary-high);
+ margin: 0 0.25em;
+ font-size: $font-down-2;
+ }
+ }
+ .footer-links {
+ flex: 1;
+ }
+ .list span {
+ font-weight: bold;
+ }
+ .footer-section-link-wrapper a {
+ color: var(--secondary-high);
+ }
+ .list {
+ margin: 1em;
+ margin-top: 0;
+ }
+ .d-icon {
+ margin-right: 5px;
+ opacity: 0.7;
+ min-width: 16px;
+ text-align: center;
+ &.fa-none {
+ min-width: unset;
+ }
+ .rtl & {
+ margin-right: 0;
+ margin-left: 5px;
+ }
+ }
+}
+
+#main-outlet {
+ // stick footer to bottom of short pages
+ min-height: 85vh;
+}
+
+@media screen and (max-width: $large-width) {
+ .custom-footer {
+ .first-box {
+ max-width: 100%;
+ border-bottom: 1px solid rgba(var(--primary-low-rgb), 0.05);
+ margin-bottom: 1em;
+ padding-bottom: 1em;
+
+ .blurb {
+ display: flex;
+ align-items: center;
+ }
+ }
+ .third-box {
+ margin-top: 0.5em;
+ }
+ .second-box .links {
+ justify-content: space-between;
+ }
+ .list {
+ margin: 0;
+ margin-top: 1em;
+ }
+ .first-box,
+ .second-box,
+ .third-box {
+ flex: 1 1 100%;
+ }
+ }
+}
+
+@media screen and (max-width: 700px) {
+ .custom-footer {
+ .first-box {
+ width: 100%;
+ }
+ .list {
+ margin-top: 1em;
+ display: inline-block;
+ vertical-align: top;
+ min-width: 50%;
+ font-size: $font-up-1;
+ }
+ .links {
+ display: inline-block;
+ }
+ }
+}
+
+.static-login .custom-footer {
+ margin-top: 3em;
+}
+
+// Log in with SimpleLogin button
+.login-modal #login-buttons:not(.hidden), .create-account #login-buttons:not(.hidden) {
+ min-width: 220px;
+}
+.btn-social.oidc .d-icon.d-icon-sign-in-alt {
+ background-image: url($simplelogin);
+ background-size: contain;
+ color: transparent;
+}
+
+// Hide post notice icon
+.post-notice.custom {
+ p:first-of-type::before {
+ content: "Staff Notice: ";
+ font-weight: bold;
+ }
+ .d-icon-user-shield {
+ display: none;
+ }
+}
+.post-notice:not(.custom) {
+ img {
+ display: none;
+ }
+}
+
+// Distinguish username from name
+.topic-post .names .username {
+ text-transform: lowercase;
+ a::before {
+ content: "@";
+ }
+}
+
+// don't crop images to circles on https://discuss.techlore.tech/g
+.groups-boxes .group-box .group-avatar-flair, .group-info {
+ .avatar-flair {
+ border-radius: 0;
+ }
+}
+
+// text selection color/highlight
+::selection {
+ background: var(--primary-med-or-secondary-med);
+ color: white;
+}
+
+abbr[title] {
+ text-decoration-style: dotted; // abbreviation style (webkit fix)
+ cursor: help;
+}
+
+abbr[title]:hover:after
+{
+ content: " (" attr(title) ")";
+ color: var(--primary-medium);
+}
+
+// non-staff views (not for security reasons!)
+body:not(.staff) {
+ // hide action-social-post tag from public view
+ [data-tag-name="action-social-post"] {
+ display: none;
+ }
+}
+
+// https://github.com/discourse/discourse-air/commit/a435c5f25d090e2631fd349fca649b72f8d2dade
.title-voting {
padding-left: 14px;
}
diff --git a/common/footer.html b/common/footer.html
new file mode 100644
index 00000000..01768714
--- /dev/null
+++ b/common/footer.html
@@ -0,0 +1,236 @@
+
diff --git a/common/head_tag.html b/common/head_tag.html
new file mode 100644
index 00000000..b8f3f08c
--- /dev/null
+++ b/common/head_tag.html
@@ -0,0 +1,8 @@
+
+
\ No newline at end of file
diff --git a/common/header.html b/common/header.html
index 976104f0..78af282a 100644
--- a/common/header.html
+++ b/common/header.html
@@ -1 +1,10 @@
-
+
diff --git a/desktop/body_tag.html b/desktop/body_tag.html
new file mode 100644
index 00000000..7497f1ac
--- /dev/null
+++ b/desktop/body_tag.html
@@ -0,0 +1,17 @@
+
diff --git a/desktop/desktop.scss b/desktop/desktop.scss
index c028435b..536fbdbe 100644
--- a/desktop/desktop.scss
+++ b/desktop/desktop.scss
@@ -1,3 +1,32 @@
@import "showcased-categories";
@import "chat-desktop";
@import "sidebar-desktop";
+
+.b-header {
+ background-color: #000000;
+}
+.b-header .contents {
+ display: flex;
+ justify-content: space-between;
+}
+.b-header .nav-pills > li > a,
+.b-header .panel > ul.icons a, .b-header .panel > ul.icons .d-icon {
+ color: #ffffff;
+}
+
+.d-header .title::after {
+ padding-left: 20px;
+ font-size: 1.5em;
+ content: "Techlore Discussions";
+ color: var(--header_primary);
+ font-family: var(--heading-font-family);
+}
+.archetype-regular #main.no-text .d-header .title::after,
+.archetype-private_message #main.no-text .d-header .title::after {
+ display:none;
+}
+
+html.has-full-page-chat body #main-outlet .full-page-chat {
+ height: calc(100vh - (var(--header-offset) + 80px));
+ --composer-height: 70px;
+}
diff --git a/docs/README.md b/docs/README.md
new file mode 100644
index 00000000..08fa813f
--- /dev/null
+++ b/docs/README.md
@@ -0,0 +1,44 @@
+# discourse-techlore
+
+
+
+**This is the theme for the [Techlore Discussions](https://discuss.techlore.tech) forum.** It is a fork of the [discourse-air](https://github.com/discourse/discourse-air) theme. This theme is only intended for our own use, so we do not provide support for self-hosting. This theme is installed alongside a handful of theme components as well:
+
+- [Dark Light Scheme Toggle](https://github.com/discourse/discourse-color-scheme-toggle.git)
+- [DiscoTOC](https://github.com/discourse/DiscoTOC.git)
+- [Clickable Topics](https://github.com/discourse/discourse-clickable-topic.git)
+- [Discourse Search Banner](https://github.com/discourse/discourse-search-banner.git)
+- [Experimental User Card](https://github.com/discourse/experimental-usercard.git)
+- [Highlight Groups](https://git.jonaharagon.net/jonah/discourse-highlight-groups.git)
+- [Modern Category + Group Boxes](https://github.com/jordanvidrine/discourse-category-group-boxes.git)
+- [Techlore Sidebar Sponsors](https://github.com/techlore/discourse-sidebar-sponsors.git)
+
+---
+
+## Tips
+
+> :exclamation: Please read through these tips upon installation, as there are a couple of settings that **NEED TO BE ENABLED** for this to theme to render properly.
+
+### Dark Light Scheme Toggle
+
+For this to work properly, at least 2 color scheme choices need to be enabled in your `/admin/customize/colors` area. At least two colors need to have `color scheme can be selected by users` enabled.
+
+
+
+Once this is done, users should be able to choose between two color schemes as their `light` and `dark` preferences in their user preferences interface menu.
+
+
+
+### Discourse Search Banner
+
+In the options for the `discourse-search-banner` theme component, the `plugin-outlet` options needs to be set to **BELOW-SITE-HEADER** for this theme to render properly.
+
+
+
+### Modern Category + Group Boxes
+
+This theme component requires your categories to use the **CATEGORY BOXES WITH SUBCATEGORIES** setting in your `/admin/site_settings/category/all_results?filter=categories` area.
+
+
+
+This theme component also allows the forum admin to organize their category page with header titles, and choose which categories appear under each header. To keep things simple, I have only allowed up to 5 headings to be used. **If no categories + heading settings are chosen, all categories will render as they do above, this is the default rendering option.**
diff --git a/docs/categories.png b/docs/categories.png
new file mode 100644
index 00000000..e6a377ab
Binary files /dev/null and b/docs/categories.png differ
diff --git a/mobile/mobile.scss b/mobile/mobile.scss
index 6ab1b24b..8ad93f2d 100644
--- a/mobile/mobile.scss
+++ b/mobile/mobile.scss
@@ -86,12 +86,12 @@ ol.category-breadcrumb {
.categories-list .list-controls {
background: var(--secondary);
padding: 0.5em;
- border-radius: 8px;
+ border-radius: 0.3em;
}
.list-controls .nav-pills {
li.navigation-toggle {
- border-radius: 8px;
+ border-radius: 0.3em;
border: none;
background-color: var(--secondary);
a:hover,
@@ -102,7 +102,7 @@ ol.category-breadcrumb {
}
.drop {
top: calc(100% + 0.5em);
- border-radius: 8px;
+ border-radius: 0.3em;
box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.25);
}
}
@@ -110,6 +110,9 @@ ol.category-breadcrumb {
.topic-list .topic-list-data {
padding: 1em 1em 0 1em;
max-width: unset;
+ .topic-excerpt {
+ max-width: 50vw;
+ }
}
.custom-search-banner-wrap .search-context {
@@ -118,7 +121,7 @@ ol.category-breadcrumb {
.top-lists {
background-color: var(--secondary);
- border-radius: 8px;
+ border-radius: 0.3em;
padding: 0.25em 0.25em 0.25em 0.5em;
margin-bottom: 0.5em;
}
@@ -145,7 +148,7 @@ ol.category-breadcrumb {
.fps-result {
background: var(--secondary);
padding: 1em;
- border-radius: 8px;
+ border-radius: 0.3em;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
border: 1px solid rgba(var(--primary-rgb), 0.1);
margin-bottom: 0.5em;
@@ -165,7 +168,7 @@ ol.category-breadcrumb {
.full-width .contents .topic-list .topic-list-header tr {
background-color: var(--secondary);
- border-radius: 8px;
+ border-radius: 0.3em;
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
border: 1px solid rgba(var(--primary-rgb), 0.1);
margin-bottom: 1em;
@@ -219,3 +222,12 @@ ol.category-breadcrumb {
padding-right: 0.25em;
}
}
+
+body.has-full-page-chat {
+ .d-header-wrap {
+ margin-bottom: 0;
+ }
+ .custom-footer {
+ display: none;
+ }
+}
diff --git a/scss/sidebar-desktop.scss b/scss/sidebar-desktop.scss
index 2cd0e4b8..c0fbc306 100644
--- a/scss/sidebar-desktop.scss
+++ b/scss/sidebar-desktop.scss
@@ -11,7 +11,7 @@
.sidebar-wrapper {
margin: 30px 0 50px;
background-color: var(--secondary);
- border-radius: 1em;
+ border-radius: 0.3em;
top: calc(var(--header-offset) + 30px);
height: calc(100vh - (var(--header-offset) + 80px));
@include box-shadow;