fix: readd modal transitions
This commit is contained in:
parent
c70211ad32
commit
16b0d03601
12 changed files with 35 additions and 14 deletions
|
@ -248,4 +248,6 @@ store.dispatch('labels/loadAllLabels')
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -1,4 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
|
<!-- FIXME: transition should not be included in the modal -->
|
||||||
<transition name="modal">
|
<transition name="modal">
|
||||||
<section
|
<section
|
||||||
v-if="enabled"
|
v-if="enabled"
|
||||||
|
@ -196,18 +197,4 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Transitions */
|
|
||||||
|
|
||||||
.modal-enter,
|
|
||||||
.modal-leave-active {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.modal-enter .modal-container,
|
|
||||||
.modal-leave-active .modal-container {
|
|
||||||
transform: scale(0.9);
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
|
@ -264,4 +264,6 @@ export default {
|
||||||
.sharables-list:not(.card-content) {
|
.sharables-list:not(.card-content) {
|
||||||
overflow-y: auto
|
overflow-y: auto
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -365,3 +365,7 @@ export default {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@include modal-transition();
|
||||||
|
</style>
|
|
@ -382,4 +382,6 @@ export default {
|
||||||
transform: translate3d(0, -4px, 0);
|
transform: translate3d(0, -4px, 0);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -339,4 +339,6 @@ export default {
|
||||||
.media-content {
|
.media-content {
|
||||||
width: calc(100% - 48px - 2rem);
|
width: calc(100% - 48px - 2rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -364,4 +364,6 @@ export default {
|
||||||
:deep(.multiselect .search-results button) {
|
:deep(.multiselect .search-results button) {
|
||||||
padding: 0.5rem;
|
padding: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -16,6 +16,8 @@
|
||||||
// since $tablet is defined by bulma we can just define it after importing the utilities
|
// since $tablet is defined by bulma we can just define it after importing the utilities
|
||||||
$mobile: math.div($tablet, 2);
|
$mobile: math.div($tablet, 2);
|
||||||
|
|
||||||
|
@import "mixins";
|
||||||
|
|
||||||
$family-sans-serif: 'Open Sans', Helvetica, Arial, sans-serif;
|
$family-sans-serif: 'Open Sans', Helvetica, Arial, sans-serif;
|
||||||
$vikunja-font: 'Quicksand', sans-serif;
|
$vikunja-font: 'Quicksand', sans-serif;
|
||||||
|
|
||||||
|
|
12
src/styles/mixins.scss
Normal file
12
src/styles/mixins.scss
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
/* Transitions */
|
||||||
|
@mixin modal-transition() {
|
||||||
|
.modal-enter,
|
||||||
|
.modal-leave-active {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-enter .modal-container,
|
||||||
|
.modal-leave-active .modal-container {
|
||||||
|
transform: scale(0.9);
|
||||||
|
}
|
||||||
|
}
|
|
@ -740,4 +740,6 @@ $filter-container-height: '1rem - #{$switch-view-height}';
|
||||||
.move-card-leave-active {
|
.move-card-leave-active {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -932,4 +932,6 @@ $flash-background-duration: 750ms;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
|
@ -308,4 +308,6 @@ export default {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include modal-transition();
|
||||||
</style>
|
</style>
|
Loading…
Reference in a new issue