diff --git a/Tekst-Web/public/base.css b/Tekst-Web/public/base.css index ec24310c..acd3de0a 100644 --- a/Tekst-Web/public/base.css +++ b/Tekst-Web/public/base.css @@ -27,10 +27,8 @@ --font-size-gigantic: 26px; --border-radius: 4px; - --block-box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.04), 0 3px 6px 0 rgba(0, 0, 0, 0.03), - 0 5px 12px 4px rgba(0, 0, 0, 0.04); - --fixed-box-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.14), 0 3px 6px 0 rgba(0, 0, 0, 0.12), - 0 5px 12px 4px rgba(0, 0, 0, 0.1); + --block-box-shadow: 0 3px 6px 4px rgba(0, 0, 0, 0.04); + --affix-box-shadow: 0 5px 12px 4px rgba(0, 0, 0, 0.15); } /* For screens with a width of 900px and above, use slightly larger font sizes. */ diff --git a/Tekst-Web/src/components/TasksWidget.vue b/Tekst-Web/src/components/TasksWidget.vue index 860cb66b..a7b84b76 100644 --- a/Tekst-Web/src/components/TasksWidget.vue +++ b/Tekst-Web/src/components/TasksWidget.vue @@ -119,7 +119,7 @@ function handleTaskClick(id: string) { #tasks-widget .task-list { min-width: 280px; max-width: 80vw; - box-shadow: var(--fixed-box-shadow); + box-shadow: var(--affix-box-shadow); background-color: var(--base-color); border: 2px solid var(--accent-color); border-radius: var(--border-radius); diff --git a/Tekst-Web/src/components/browse/BrowseToolbar.vue b/Tekst-Web/src/components/browse/BrowseToolbar.vue index 15134405..548d91af 100644 --- a/Tekst-Web/src/components/browse/BrowseToolbar.vue +++ b/Tekst-Web/src/components/browse/BrowseToolbar.vue @@ -139,12 +139,11 @@ const buttonSize = computed(() => (state.smallScreen ? 'small' : 'large')); /* width: 100vw; */ left: 0px; z-index: 1801; - box-shadow: var(--fixed-box-shadow); + box-shadow: var(--affix-box-shadow); } .browse-toolbar { padding: var(--gap-sm); - box-shadow: var(--fixed-box-shadow); } .browse-toolbar-middle {