Fix padding on become and editor button

about.json

@@ -1,39 +1,33 @@
 {
-  "name": "Air Theme",
+  "name": "OrcasHub Theme",
   "about_url": null,
   "license_url": null,
   "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"
+    "https://github.com/discourse/discourse-custom-header-links.git",
+    "https://git.grosinger.net/tgrosinger/discourse-user-card-directory.git",
+    "https://github.com/discourse/DiscoTOC.git",
+    "https://github.com/paviliondev/discourse-tc-topic-list-previews.git"
   ],
+  "assets": {
+    "OrcasHub-Top-Logo": "assets/OrcasHub-Top-Logo.png"
+  },
   "modifiers": {
     "serialize_topic_excerpts": true
   },
   "color_schemes": {
-    "air-light": {
+    "OrcasHub": {
       "primary": "1c1c1c",
-      "secondary": "f9fcff",
+      "secondary": "ffffff",
       "tertiary": "3877e5",
       "quaternary": "7e8b93",
-      "header_background": "f9fcff",
-      "header_primary": "122b43",
+      "header_background": "374151",
+      "header_primary": "e0e0e0",
       "highlight": "e6cb37",
       "danger": "d05454",
       "success": "71bd9f",
       "love": "c16ad7"
-    },
-    "air-dark": {
-      "primary": "e0e0e0",
-      "secondary": "2d2d2d",
-      "tertiary": "9a5cfd",
-      "quaternary": "71bd9f",
-      "header_background": "202020",
-      "header_primary": "e0e0e0",
-      "highlight": "9a5cfd",
-      "danger": "d05454",
-      "success": "71bd9f",
-      "love": "c16ad7"
     }
   }
 }

common/after_header.html

@@ -0,0 +1,9 @@
+<div id="login-message">
+    <h2>
+    There are a lot more discussions going on if you log in!
+    </h2>
+
+    <a href="/login" class="widget-button btn btn-primary btn-small sign-up-button btn-text">
+        <span class="d-button-label">Log in or Sign Up</span>
+    </a>
+</div>

common/common.scss

@@ -1,44 +1,101 @@
+// Login CTA
+#login-message {
+    display: none;
+}
+
+html.anon {
+    body:not(.category-resources) {
+
+        // Display this message on all pages except in Community Resources
+        #login-message {
+            text-align: center;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            margin: 16px 0;
+
+            a:hover {
+                color: var(--secondary-very-high);
+            }
+        }
+    }
+}
+
+// Login form
+.login-right-side {
+    display: none;
+}
+
+// Header image above nav bar
+.outer {
+    padding-top: 1.5rem;
+    padding-bottom: 1.5rem;
+    display: flex;
+    justify-content: center;
+    background-color: var(--header_background);
+}
+
+.top-header-image {
+    background-image: url($OrcasHub-Top-Logo);
+}
+
+// Hide the default logo in the header bar
+#site-logo,
+.home-logo-wrapper-outlet {
+    display: none;
+}
+
 // custom search banner customizations
 .custom-search-banner-wrap {
     margin: 0 auto !important;
     max-width: unset;
     color: var(--secondary);
+
     h1 {
         font-size: 4em;
     }
+
     p {
         font-size: 1.25em !important;
         font-weight: bold;
         margin-bottom: 1em;
     }
+
     .btn {
         height: 100%;
     }
+
     .search-menu input[type="text"] {
         border: 1px solid transparent;
         border-radius: 0.25em;
         min-height: 40px;
+
         &:focus {
             outline: 3px solid rgba(var(--primary-rgb), 0.35);
         }
     }
+
     .widget-link.show-help {
         color: rgba(var(--primary-rgb), 0.75);
         border-radius: 0.5em;
         padding: 0.5em;
         background-color: rgba(var(--secondary-rgb), 0.25);
+
         &:hover {
             color: var(--primary);
         }
     }
+
     .search-menu .search-input {
         border-color: var(--tertiary-hover);
         outline: 1px solid var(--tertiary-hover);
     }
+
     .results {
         top: 43px;
         border-radius: 0.25em;
     }
+
     .search-context {
         top: 3.25em;
         right: 1em;
@@ -61,12 +118,15 @@
     .custom-search-banner-wrap {
         padding: 1em 0 2em;
         color: var(--tertiary);
+
         .mobile-view & {
             color: var(--secondary);
         }
+
         h1 {
             margin-bottom: 0;
         }
+
         .search-widget {
             margin-top: 2em;
         }
@@ -97,9 +157,11 @@
     .badge-category-bg {
         border-radius: 0.125em;
     }
+
     .badge-category-parent-bg {
         border-top-left-radius: 0.125em;
         border-bottom-left-radius: 0.125em;
+
         +.badge-category-bg {
             border-top-left-radius: 0px;
             border-bottom-left-radius: 0px;
@@ -119,6 +181,7 @@
     padding: 0.15em 0.25em 0.15em 0.35em;
     background-color: var(--primary-low);
     color: var(--primary) !important;
+
     &:hover {
         background-color: var(--primary-low-mid);
         color: var(--primary);
@@ -137,6 +200,21 @@
     margin-right: 0px;
 }
 
+.custom-category-boxes {
+    .category-box {
+        box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
+            rgba(0, 0, 0, 0) 0px 0px 0px 0px,
+            rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
+            rgba(0, 0, 0, 0.1) 0px 1px 2px -1px !important;
+    }
+
+    .category-logo {
+        height: 100px !important;
+        width: 100px !important;
+    }
+}
+
+
 #site-text-logo {
     color: var(--primary);
 }
@@ -145,6 +223,7 @@
     .cm-header-links {
         display: none;
     }
+
     .list-controls .nav-pills .drop li:first-of-type {
         display: none;
     }
@@ -169,6 +248,7 @@ input[type="color"],
 div.ac-wrap {
     border-radius: 4px;
 }
+
 .d-header {
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
 }
@@ -181,6 +261,7 @@ div.ac-wrap {
     border-radius: 0.25em;
     margin-left: 0.3em;
     border: 1px solid transparent;
+
     svg {
         font-size: 1.25em;
     }
@@ -198,6 +279,7 @@ div.ac-wrap {
 
 .drop-down-mode .d-header-icons .active .icon {
     border: 1px solid transparent;
+
     .d-icon {
         color: var(--tertiary);
     }
@@ -216,7 +298,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: .375rem;
     border: 1px solid transparent;
 }
 
@@ -240,33 +322,15 @@ div.ac-wrap {
 
 // graceful ish style
 @mixin box-shadow($value: 0px) {
-  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: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
+        rgba(0, 0, 0, 0) 0px 0px 0px 0px,
+        rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
+        rgba(0, 0, 0, 0.1) 0px 1px 2px -1px;
 }
 
 html {
     body {
-    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-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%);
+        background-color: var(--secondary);
     }
 }
 
@@ -274,21 +338,26 @@ html body #main-outlet {
     margin-top: 30px;
     margin-bottom: 50px;
     background: var(--secondary);
-  border-radius: 1em;
+    border-radius: .5rem;
     padding: 3em 3em 5%;
     max-width: 1150px;
+
     .archetype-regular & {
         min-height: 500px;
     }
+
     @media screen and (max-width: 700px) {
         padding: 1.5em;
         margin-top: 0;
     }
+
     padding-bottom: 5% !important; //overriding inline style
     @include box-shadow;
+
     @media screen and (max-width: 1120px) {
         width: 80%;
     }
+
     @media screen and (max-width: 1075px) {
         width: 85%;
     }
@@ -299,12 +368,49 @@ html body #main-outlet {
     border-radius: 0.5em;
 }
 
+// User directory (people)
+
+.users-directory {
+    .directory-controls {
+        justify-content: right !important;
+    }
+
+    .period-controls {
+        display: none;
+    }
+}
+
+// User Card (profile)
+
+.user-card {
+    .badge-section,
+    .metadata-row {
+        display: none;
+    }
+}
+
+// Category List
+
+.custom-category-boxes-container {
+    .custom-category-boxes {
+        .category-box {
+            border-radius: .5rem !important;
+        }
+    }
+}
+
+// Hide the "about this category" heading
+.category-heading {
+    display: none;
+}
+
 // Topic List
 
 @keyframes background-fade-highlight {
     0% {
         background-color: var(--highlight-low);
     }
+
     100% {
         background-color: var(--secondary);
     }
@@ -314,71 +420,89 @@ html body #main-outlet {
     border-collapse: separate;
     border-spacing: 0 0.25em;
     display: contents;
+
     .topic-list-header {
         tr {
             display: flex;
             border-bottom: none;
         }
+
         display: contents;
+
         .topic-list-data.default {
             width: 63%;
         }
+
         .topic-list-data.posters {
             width: 7%;
         }
+
         .topic-list-data.posts {
             width: 15%;
         }
+
         .topic-list-data.activity {
             width: 15%;
         }
     }
+
     .topic-list-body {
         display: contents;
+
         .topic-list-item-separator {
             width: 100%;
             margin: 0.75em 0;
             display: flex;
+
             .topic-list-data {
                 width: 100%;
             }
         }
+
         .topic-list-item {
             width: 100%;
             display: flex;
             margin-bottom: 0.5em;
             background-color: var(--secondary);
             border: 1px solid rgba(var(--primary-rgb), 0.2);
-      border-radius: 1em;
+            border-radius: .5rem;
             position: relative;
             transition: box-shadow 100ms ease-in-out;
             box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.05);
             overflow: hidden;
+
             &.visited {
                 border: 1px solid rgba(var(--primary-rgb), 0.1);
+
                 .discourse-tag {
                     opacity: 0.75;
                 }
+
                 &:hover {
                     border: 1px solid rgba(var(--primary-rgb), 0.25);
+
                     .discourse-tag {
                         opacity: 1;
                     }
                 }
             }
+
             &:hover {
                 background-color: var(--secondary);
                 box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.1);
                 border: 1px solid rgba(var(--primary-rgb), 0.3);
+
                 a.title:not(.badge-notification),
                 a.topic-excerpt {
                     color: var(--primary) !important;
                 }
             }
+
             .topic-list-data.main-link {
                 width: 63%;
                 order: 2;
             }
+
             .topic-list-data.posters {
                 width: 7%;
                 order: 1;
@@ -386,10 +510,12 @@ html body #main-outlet {
                 display: flex;
                 justify-content: center;
                 align-items: center;
+
                 a:not(.latest) {
                     display: none;
                 }
             }
+
             .topic-list-data.posts {
                 width: 15%;
                 order: 3;
@@ -397,6 +523,7 @@ html body #main-outlet {
                 justify-content: center;
                 align-items: center;
             }
+
             .topic-list-data.age {
                 width: 15%;
                 order: 4;
@@ -420,6 +547,7 @@ html body #main-outlet {
     justify-content: center;
     align-content: center;
     align-items: center;
+
     .avatar {
         margin-right: 0;
     }
@@ -430,19 +558,24 @@ html body #main-outlet {
         .main-link {
             min-height: 100%;
             min-height: 100%;
+
             .link-top-line {
                 display: block;
                 margin-bottom: 0.25em;
             }
+
             .title {
                 font-weight: bold;
             }
+
             .link-area {
                 display: flex;
+
                 .link-title-area {
                     margin-right: 1em;
                     font-size: $font-up-1;
                 }
+
                 .link-meta-area {
                     font-size: $font-down-3;
                     display: flex;
@@ -450,41 +583,50 @@ html body #main-outlet {
                 }
             }
         }
+
         .posters {
             .avatar {
                 width: 40px;
                 height: 40px;
-        border-radius: 8px;
+                border-radius: .375rem;
             }
+
             a.latest {
                 .avatar {
                     margin-right: 0;
                 }
             }
+
             a:not(.latest) {
                 margin-left: -22px;
+
                 .avatar {
                     border: 3px solid var(--secondary);
                 }
             }
         }
+
         .posts-map,
         .num.age.activity {
             a {
                 padding: 0;
             }
         }
+
         .posts-map {
             position: relative;
+
             .number {
                 margin-right: 0.25em;
             }
         }
+
         .post-activity {
             .d-icon-reply {
                 color: var(--primary-medium);
                 margin-right: 0.25em;
             }
+
             .relative-date {
                 color: var(--primary-medium);
             }
@@ -496,41 +638,114 @@ html body #main-outlet {
     margin-top: 2em;
 }
 
-// published page additions
-.published-page-content-wrapper {
+.d-icon-lock {
+    display: none;
+}
+
+// Community Resources Category
+.category-resources {
+    // Topic List
+
+    .topic-list-header {
+        display: none !important;
+    }
+
+    .topic-list-body {
+        .topic-list-data {
+            // Center content in the topic list
+            display: flex;
+            align-items: center;
+        }
+
+        .num.views,
+        .num.posts,
+        .num.activity,
+        .posters,
+        .topic-statuses {
+            display: none !important;
+        }
+    }
+
+    // Topic Posts
+
+    .topic-map,
+    .topic-avatar,
+    .more-topics__container,
+    .names.trigger-user-card {
+        // Hide the lock icon in the topic header of the post
+        display: none !important;
+    }
+
+    .topic-meta-data {
+        display: flex;
+        justify-content: right;
+    }
+}
+
+.become-editor-link {
+    display: none;
+    margin: -40px auto 30px auto;
+    padding-left: 3em;
     max-width: 1000px;
-  margin-top: 30px;
-  margin-bottom: 50px;
-  background: var(--secondary);
-  border-radius: 1em;
-  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);
-  z-index: 1;
-  position: relative;
+
+    a {
+        color: var(--primary-high);
+        text-decoration: underline;
+    }
+
+    a:visited {
+        color: var(--primary-high);
+    }
 }
 
 .published-page {
-  .background-container {
+    .become-editor-link {
+        display: block;
+    }
+}
+
+// published page additions
+.published-page-header {
+    background-color: unset;
+    box-shadow: unset;
+    top: unset;
+    position: unset;
+    margin-top: 30px;
+
+    .published-page-header-wrapper {
+        justify-content: center;
+        background: var(--secondary);
+        max-width: 1000px;
+        border-radius: 1em 1em 0 0;
+        padding-top: 3em;
+
+        a {
             display: none;
         }
-  &::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;
+
+        .published-page-title {
+            color: var(--primary);
         }
     }
+}
+
+.published-page-content-wrapper {
+    max-width: 1000px;
+    margin-top: 0;
+    margin-bottom: 50px;
+    background: var(--secondary);
+    border-radius: 0 0 1em 1em;
+    padding: 3em 3em 5%;
+
+    ul,
+    ol {
+        margin-left: 1.25em;
+    }
+}
+
+.published-page-author {
+    display: none !important;
+}
 
 .quote-button {
     background-color: var(--primary-low-mid);
@@ -558,3 +773,80 @@ html body #main-outlet {
 .topic-list .main-link.focused {
     box-shadow: none;
 }
+
+// Footer
+.orcashub-footer {
+    background-color: rgb(31 41 55);
+
+    .outer-container {
+        max-width: 80rem;
+        margin-left: auto;
+        margin-right: auto;
+        padding: 3rem 1.5rem;
+    }
+
+    .inner-container {
+        padding-bottom: 2rem;
+
+        @media (min-width: 1280) {
+            display: grid;
+            grid-template-columns: repeat(4, minmax(0, 1fr));
+            gap: 2rem;
+        }
+    }
+
+    .grid {
+        display: grid;
+        gap: 2rem;
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+
+        @media (min-width: 1280) {
+            grid-column: span 4/span 4;
+        }
+    }
+
+    .grid-row {
+        @media (min-width: 768px) {
+            display: grid;
+            grid-template-columns: repeat(2, minmax(0, 1fr));
+            gap: 2rem;
+        }
+    }
+
+    .second-group {
+        margin-top: 3rem;
+
+        @media (min-width: 768px) {
+            margin-top: 0;
+        }
+    }
+
+    h3 {
+        color: white;
+        font-size: 16px;
+        font-weight: 500;
+        line-height: 1.5rem;
+    }
+
+    ul {
+        margin: 0;
+        list-style: none;
+    }
+
+    li {
+        a {
+            color: rgb(209 213 219);
+            font-size: 16px;
+            line-height: 1.5rem;
+        }
+
+        a:hover {
+            color: white;
+        }
+
+        a:visited {
+            color: rgb(209 213 219) !important;
+        }
+    }
+
+}

common/footer.html

@@ -0,0 +1,52 @@
+<div class="become-editor-link">
+    <a href="https://orcas.community/editor">
+        Become an editor
+    </a>
+</div>
+
+<footer class="orcashub-footer">
+    <div class="outer-container">
+        <div class="inner-container">
+            <div class="grid">
+                <div class="grid-row">
+                    <div>
+                        <h3>Classifieds</h3>
+                        <ul>
+                            <li><a href="https://orcas.community/classified/for-sale">For Sale</a></li>
+                            <li><a href="https://orcas.community/classified/for-free">For Free</a></li>
+                            <li><a href="https://orcas.community/classified/want-to-buy">Looking For</a></li>
+                            <li><a href="https://orcas.community/classified/want-to-borrow">Want to Borrow</a></li>
+                            <li><a href="https://orcas.community/classified/new">New Post</a> </li>
+                        </ul>
+                    </div>
+                    <div class="second-group">
+                        <h3>Housing</h3>
+                        <ul>
+                            <li><a href="https://orcas.community/housing?filters=basic_for-rent">For Rent</a></li>
+                            <li><a href="https://orcas.community/housing?filters=basic_request">Requests</a> </li>
+                            <li><a href="https://orcas.community/housing/new">New Post</a> </li>
+                        </ul>
+                    </div>
+                </div>
+                <div class="grid-row">
+                    <div>
+                        <h3>Other Services</h3>
+                        <ul>
+                            <li><a href="/" target="_blank">Groups</a> </li>
+                            <li><a href="https://orcas.community/events">Events</a> </li>
+                            <li><a href="https://sanjuans.online/" target="_blank">San Juans Online</a></li>
+                        </ul>
+                    </div>
+                    <div class="second-group">
+                        <h3>About</h3>
+                        <ul>
+                            <li><a href="https://orcas.community/terms-of-service">Terms of Service</a></li>
+                            <li><a href="https://orcas.community/privacy-policy">Privacy Policy</a></li>
+                            <li><a href="https://opencollective.com/orcas-community" target="_blank">Donate</a></li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</footer>

common/header.html

@@ -1 +1,5 @@
-<div class="background-container"></div>
+<div class="outer">
+    <a href="https://orcas.community/">
+        <div class="top-header-image"></div>
+	</a>
+</div>

desktop/desktop.scss

@@ -1,3 +1,47 @@
 @import "showcased-categories";
 @import "chat-desktop";
 @import "sidebar-desktop";
+
+.top-header-image {
+    height: 128px;
+    width: 246px;
+}
+
+// Header links
+.custom-header-links {
+    .headerLink a {
+        padding: .5rem .75rem;
+        margin: 0 .1rem;
+        color: var(--header_primary);
+        font-weight: 500;
+        font-size: .9rem;
+        line-height: 1.25rem;
+
+        &:hover {
+            color: white;
+        }
+    }
+
+    li:nth-last-child(2) {
+        a {
+            color: white;
+            background-color: #111827;
+            border-radius: .375rem;
+        }
+    }
+}
+
+// Sidebar
+
+.sidebar-section[data-section-name="orcashub"] {
+    // Hide OrcasHub section in the sidebar on desktop since it's show in the header.
+    display: none !important;
+}
+
+// Footer
+
+.custom-footer {
+    .list {
+        margin: 2rem 5em 4rem;
+    }
+}

javascripts/discourse/initializers/customize-edit-category-general.js

@@ -7,7 +7,7 @@ export default {
   initialize() {
     withPluginApi("0.8.14", (api) => {
       api.modifyClass("component:edit-category-general", {
-        pluginId: "discourse-air",
+        pluginId: "orcashub-discourse-theme",
 
         didInsertElement() {
           this._super(...arguments);

javascripts/discourse/initializers/init-topic-excerpts.js

@@ -2,7 +2,7 @@ import { apiInitializer } from "discourse/lib/api";
 
 export default apiInitializer("0.8", (api) => {
   api.modifyClass("component:topic-list-item", {
-    pluginId: "discourse-air",
+    pluginId: "orcashub-discourse-theme",
     expandPinned: true,
   });
 });

mobile/mobile.scss

@@ -1,5 +1,11 @@
 @import "chat-mobile";
 
+.top-header-image {
+    height: 80px;
+    width: 154px;
+    background-size: 154px 80px;
+}
+
 .custom-search-banner-wrap {
   h1 {
     font-size: 2.5em !important;
@@ -200,3 +206,32 @@ ol.category-breadcrumb {
     padding-right: 0.25em;
   }
 }
+
+// Footer
+.custom-footer {
+    .list {
+        margin: 2rem 0;
+    }
+}
+
+// Community Resources Category
+.category-resources {
+
+    // Topic List
+
+    .topic-list-data {
+        .right {
+            margin-left: 0 !important;
+            display: flex;
+            align-items: center;
+        }
+    }
+
+    // Topic Post
+
+    .topic-avatar,
+    .topic-meta-data {
+        display: none !important;
+    }
+}
+

package.json

@@ -1,7 +1,7 @@
 {
-  "name": "discourse-air",
+  "name": "orcashub-discourse-theme",
   "version": "1.0.0",
-  "repository": "https://github.com/discourse/discourse-air",
+  "repository": "https://git.grosinger.net/tgrosinger/orcashub-discourse-theme",
   "author": "Jordan Vidrine",
   "license": "GPL-2.0-or-later",
   "devDependencies": {

scss/sidebar-desktop.scss

@@ -1,17 +1,17 @@
 // sidebar
 
 @mixin box-shadow($value: 0px) {
-  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: rgba(0, 0, 0, 0) 0px 0px 0px 0px,
+    rgba(0, 0, 0, 0) 0px 0px 0px 0px,
+    rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
+    rgba(0, 0, 0, 0.1) 0px 1px 2px -1px;
 }
 
 #main-outlet-wrapper {
   .sidebar-wrapper {
     margin: 30px 0 50px;
     background-color: var(--secondary);
-    border-radius: 1em;
+    border-radius: .5rem;
     top: calc(var(--header-offset) + 30px);
     height: calc(100vh - (var(--header-offset) + 80px));
     @include box-shadow;