diff --git a/assets/components/networks/network.vue b/assets/components/networks/network.vue index 5ebb30c4..0c043b74 100644 --- a/assets/components/networks/network.vue +++ b/assets/components/networks/network.vue @@ -152,18 +152,18 @@ export default { } .sidebar { + background: $profile; height: 100%; width: 18rem; display: flex; flex-direction: column; flex-shrink: 0; - border-right: solid 1px $shadow-hint; color: $text-contrast; overflow: hidden; } .sidebar .title { - border-bottom: solid 1px $shadow-hint; + border-bottom: solid 1px $highlight-hint; } .logo { @@ -189,10 +189,14 @@ export default { .sites.compact { display: none; + background: $profile; + grid-row: 1; } .expand { display: none; + color: $text-contrast; + background: $profile; padding: .5rem; text-align: center; cursor: pointer; diff --git a/assets/components/sites/sites.vue b/assets/components/sites/sites.vue index 737e7870..3927614d 100644 --- a/assets/components/sites/sites.vue +++ b/assets/components/sites/sites.vue @@ -1,5 +1,18 @@ diff --git a/public/css/style.css b/public/css/style.css index bd12cbad..7d33bb3c 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -636,6 +636,9 @@ .sites.expanded[data-v-7bebaa3e] { grid-template-columns: repeat(2, 0.5fr); } +.logo[data-v-7bebaa3e] { + width: 15rem; +} /* $primary: #ff886c; */ @media (max-width: 1200px) { @@ -664,6 +667,7 @@ padding: 1rem; } .sidebar[data-v-e2e12602] { + background: #222; height: 100%; width: 18rem; display: -webkit-box; @@ -672,12 +676,11 @@ -webkit-box-direction: normal; flex-direction: column; flex-shrink: 0; - border-right: solid 1px rgba(0, 0, 0, 0.1); color: #fff; overflow: hidden; } .sidebar .title[data-v-e2e12602] { - border-bottom: solid 1px rgba(0, 0, 0, 0.1); + border-bottom: solid 1px rgba(255, 255, 255, 0.075); } .logo[data-v-e2e12602] { width: 100%; @@ -705,9 +708,13 @@ } .sites.compact[data-v-e2e12602] { display: none; + background: #222; + grid-row: 1; } .expand[data-v-e2e12602] { display: none; + color: #fff; + background: #222; padding: .5rem; text-align: center; cursor: pointer;