WebPlay/client
1
1
Fork 0
Code Issues 10 Pull Requests Packages Projects Releases Wiki Activity

use radius for flat dialogs
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Artem Anufrij 2023-10-05 12:45:11 +02:00
parent d724825e06
commit d2c70fc006
1 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/components/base-components/Dialog.vue
View File

@ -24,7 +24,7 @@
</button> </button>
</div> </div>
</div> </div>
<div class="dialog-body" :class="{ hideXScroll: disableXscroll == true, hideYScroll: disableYscroll == true, }"> <div class="dialog-body" :class="{ hideXScroll: disableXscroll == true, hideYScroll: disableYscroll == true, 'flat-dialog-header': flatDialogHeader == true}">
<slot /> <slot />
<div class="dialog-body-content" v-if="dialogContent" v-html="dialogContent" /> <div class="dialog-body-content" v-if="dialogContent" v-html="dialogContent" />
</div> </div>
@ -254,8 +254,8 @@ export default {
max-height: 80%; max-height: 80%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border-top-left-radius: 4px; border-top-left-radius: 8px;
border-top-right-radius: 4px; border-top-right-radius: 8px;
position: absolute; position: absolute;
} }
@ -278,8 +278,8 @@ export default {
flex-shrink: 0; flex-shrink: 0;
background-color: var(--background); background-color: var(--background);
box-shadow: 0px 1px 4px var(--shadow); box-shadow: 0px 1px 4px var(--shadow);
border-top-left-radius: 4px; border-top-left-radius: 8px;
border-top-right-radius: 4px; border-top-right-radius: 8px;
z-index: 1; z-index: 1;
} }
@ -408,6 +408,7 @@ export default {
.dialog-header.flat-dialog-header>.dialog-header-right>button { .dialog-header.flat-dialog-header>.dialog-header-right>button {
color: var(--white); color: var(--white);
} }
.dialog-header.flat-dialog-header>.dialog-header-right>button:hover { .dialog-header.flat-dialog-header>.dialog-header-right>button:hover {
color: var(--gray); color: var(--gray);
} }
@ -419,6 +420,11 @@ export default {
flex-grow: 1; flex-grow: 1;
} }
.dialog-body.flat-dialog-header {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
.dialog-body.hideXScroll { .dialog-body.hideXScroll {
overflow-x: hidden; overflow-x: hidden;
} }