diff --git a/src/client/pages/emojis.category.vue b/src/client/pages/emojis.category.vue index 0c24b06d1605fdcf7365e05d2a531449690da2ce..091c3f20a9d389ae15940fae7a93d524b09ab56b 100644 --- a/src/client/pages/emojis.category.vue +++ b/src/client/pages/emojis.category.vue @@ -108,12 +108,12 @@ export default defineComponent({ margin: 8px 8px 0 0; padding: 4px 8px; font-size: 0.9em; - background: var(--panel); - border: solid 0.5px var(--divider); + background: var(--accentedBg); border-radius: 5px; &.active { - border-color: var(--accent); + background: var(--accent); + color: var(--fgOnAccent); } } } diff --git a/src/client/pages/emojis.vue b/src/client/pages/emojis.vue index c1f87047d3a7339e1dec3ef6d59df54190bc9ae6..8918de2338618be8ee0b8835ae01bdc955bcda11 100644 --- a/src/client/pages/emojis.vue +++ b/src/client/pages/emojis.vue @@ -1,5 +1,7 @@ <template> -<XCategory v-if="tab === 'category'"/> +<div :class="$style.root"> + <XCategory v-if="tab === 'category'"/> +</div> </template> <script lang="ts"> @@ -26,5 +28,9 @@ export default defineComponent({ }); </script> -<style lang="scss" scoped> +<style lang="scss" module> +.root { + max-width: 1000px; + margin: 0 auto; +} </style> diff --git a/src/client/ui/_common_/sidebar.vue b/src/client/ui/_common_/sidebar.vue index 87002c3e703bc59d9f663d802dac52b1bd32d5ea..6ebbd2d8627fb0e00b82d88433749f507190e91e 100644 --- a/src/client/ui/_common_/sidebar.vue +++ b/src/client/ui/_common_/sidebar.vue @@ -393,7 +393,7 @@ export default defineComponent({ &:before { content: ""; display: block; - width: calc(100% - 20px); + width: calc(100% - 24px); height: 100%; margin: auto; position: absolute; diff --git a/src/client/ui/universal.vue b/src/client/ui/universal.vue index cc754cba70543d4ac765d14205ce264dfebe5b27..ec9254b6971ddb7ec71608ef5b6af0ac33352b5f 100644 --- a/src/client/ui/universal.vue +++ b/src/client/ui/universal.vue @@ -312,8 +312,8 @@ export default defineComponent({ > .widgets { padding: 0 var(--margin); - //border-left: solid 0.5px var(--divider); - background: var(--navBg); + border-left: solid 0.5px var(--divider); + background: var(--bg); @media (max-width: $widgets-hide-threshold) { display: none;