diff --git a/app.vue b/app.vue index f9027618..334d2034 100644 --- a/app.vue +++ b/app.vue @@ -11,10 +11,24 @@ export default defineComponent({ setup() { const { public: { appName, appTitle } } = useConfig() const mq = useMq() + const router = useRouter() const { store } = useVuex() const isMounted = ref(false) + const flow = computed(() => { + // A param to indicate a user flow (e.g. completing sign-up or sign-in). + return router.currentRoute.value.query.flow + }) + + const showChangeLog = computed(() => { + return router.currentRoute.value.path === '/docs/new' && !router.currentRoute.value.query.ci + }) + + const ligatures = computed(() => { + return store.state.settings.editor.ligatures + }) + onMounted(async () => { isMounted.value = true @@ -50,21 +64,12 @@ export default defineComponent({ }) return { + flow, + ligatures, + showChangeLog, sizes, } }, - computed: { - flow() { - // A param to indicate a user flow (e.g. completing sign-up or sign-in). - return this.$route.query.flow - }, - showChangeLog() { - return this.$route.path === '/docs/new' && !this.$route.query.ci - }, - ligatures() { - return this.$store.state.settings.editor.ligatures - }, - }, }) diff --git a/assets/css/tailwind.css b/assets/css/tailwind.css index 4e29e14b..f47dd125 100644 --- a/assets/css/tailwind.css +++ b/assets/css/tailwind.css @@ -11,7 +11,8 @@ --colors-primary: 59 130 246; } - .dark { + .dark, + [data-appearance=dark] { --layer-0-bg: 18 18 18; --layer-0-bg-hover: 39 39 42; --layer-0-bg-active: 39 39 42; @@ -80,12 +81,14 @@ } @media (prefers-color-scheme: dark) { - .auto { + .auto, + [data-appearance=auto] { @apply dark; } } - .light { + .light, + [data-appearance=light] { --layer-0-bg: 244 244 245; --layer-0-bg-hover: 228 228 231; --layer-0-bg-active: 228 228 231; @@ -154,12 +157,14 @@ } @media (prefers-color-scheme: light) { - .auto { + .auto, + [data-appearance=auto] { @apply light; } } - .custom { + .custom, + [data-appearance=custom] { --layer-0-bg: 10 0 31; --layer-0-bg-hover: 21 0 44; --layer-0-bg-active: 32 2 58; diff --git a/components/ChangeLog.vue b/components/ChangeLog.vue index be24442c..aa89ef24 100644 --- a/components/ChangeLog.vue +++ b/components/ChangeLog.vue @@ -1,112 +1,78 @@