fix: Backdrop color for insert article modal in dark mode (#8711)

This commit is contained in:
Sivin Varghese
2024-01-16 18:36:43 +05:30
committed by GitHub
parent 8f1a1e0905
commit e67f8824d9
4 changed files with 6 additions and 7 deletions

View File

@@ -1,7 +1,7 @@
.modal-mask { .modal-mask {
// @include flex; // @include flex;
// @include flex-align(center, middle); // @include flex-align(center, middle);
@apply flex items-center justify-center bg-modal dark:bg-modal z-[9990] h-full left-0 fixed top-0 w-full; @apply flex items-center justify-center bg-modal-backdrop-light dark:bg-modal-backdrop-dark z-[9990] h-full left-0 fixed top-0 w-full;
} }
.page-top-bar { .page-top-bar {

View File

@@ -101,10 +101,10 @@
<transition name="modal-fade"> <transition name="modal-fade">
<div <div
v-show="$refs.upload && $refs.upload.dropActive" v-show="$refs.upload && $refs.upload.dropActive"
class="fixed top-0 bottom-0 left-0 right-0 z-20 flex flex-col items-center justify-center w-full h-full gap-2 text-slate-600 dark:text-slate-200 bg-white_transparent dark:bg-black_transparent" class="fixed top-0 bottom-0 left-0 right-0 z-20 flex flex-col items-center justify-center w-full h-full gap-2 text-slate-900 dark:text-slate-50 bg-modal-backdrop-light dark:bg-modal-backdrop-dark"
> >
<fluent-icon icon="cloud-backup" size="40" /> <fluent-icon icon="cloud-backup" size="40" />
<h4 class="page-sub-title text-slate-600 dark:text-slate-200"> <h4 class="page-sub-title text-slate-900 dark:text-slate-50">
{{ $t('CONVERSATION.REPLYBOX.DRAG_DROP') }} {{ $t('CONVERSATION.REPLYBOX.DRAG_DROP') }}
</h4> </h4>
</div> </div>

View File

@@ -1,6 +1,6 @@
<template> <template>
<div <div
class="fixed flex items-center justify-center w-screen h-screen bg-white/70 top-0 left-0 z-50" class="fixed flex items-center justify-center w-screen h-screen bg-modal-backdrop-light dark:bg-modal-backdrop-dark top-0 left-0 z-50"
> >
<div <div
v-on-clickaway="onClose" v-on-clickaway="onClose"

View File

@@ -32,9 +32,8 @@ module.exports = {
colors: { colors: {
transparent: 'transparent', transparent: 'transparent',
white: '#fff', white: '#fff',
white_transparent: 'rgba(255, 255, 255, 0.9)', 'modal-backdrop-light': 'rgba(0, 0, 0, 0.4)',
black_transparent: 'rgba(0, 0, 0, 0.9)', 'modal-backdrop-dark': 'rgba(0, 0, 0, 0.6)',
modal: 'rgba(0, 0, 0, 0.4)',
current: 'currentColor', current: 'currentColor',
woot: { woot: {
25: blue.blue2, 25: blue.blue2,