fraport/fradrive
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

styling for modal-closer and grid-fallback for forms

Browse Source
This commit is contained in:
Felix Hamann 2018-03-28 23:55:46 +02:00
parent 6c680a109c
commit b2a755ba56
3 changed files with 26 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
templates/standalone/inputs.lucius
View File

@ -196,6 +196,8 @@ input[type="checkbox"]:checked::after {
color: var(--fontsec); color: var(--fontsec);
transform: translate(0, 0); transform: translate(0, 0);
transition: all .1s; transition: all .1s;
display: inline-block;
width: 30%;
} }
.reactive-label--small { .reactive-label--small {
cursor: default; cursor: default;
@ -211,6 +213,7 @@ input[type="checkbox"]:checked::after {
.reactive-label { .reactive-label {
position: relative; position: relative;
transform: translate(2px, 30px); transform: translate(2px, 30px);
display: block;
} }
.reactive-label--small { .reactive-label--small {
transform: translate(2px, 0px); transform: translate(2px, 0px);

1
templates/widgets/modal.julius
View File

@ -42,6 +42,7 @@ document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('modal-open', this.openOnEvent.bind(this), false); document.addEventListener('modal-open', this.openOnEvent.bind(this), false);
closeBound = this.close.bind(this); closeBound = this.close.bind(this);
if (trigger) { if (trigger) {
trigger.classList.add('modal__trigger');
trigger.addEventListener('click', this.open.bind(this), false); trigger.addEventListener('click', this.open.bind(this), false);
} }
} }

30
templates/widgets/modal.lucius
View File

@ -8,11 +8,11 @@
min-width: 60vw; min-width: 60vw;
min-height: 100px; min-height: 100px;
max-height: calc(100vh - 30px); max-height: calc(100vh - 30px);
border-radius: 20px; border-radius: 7px;
z-index: -1; z-index: -1;
color: var(--fontbase); color: var(--fontbase);
padding: 20px; padding: 20px;
overflow: scroll; overflow: auto;
&.modal--open { &.modal--open {
z-index: 200; z-index: 200;
@ -51,14 +51,28 @@
} }
} }
.modal__trigger {
cursor: pointer;
}
.modal__closer { .modal__closer {
position: absolute; position: absolute;
top: 10px; top: 20px;
right: 10px; right: 20px;
display: block; display: flex;
width: 20px; align-items: center;
height: 50px; justify-content: center;
background-color: blue; width: 30px;
height: 30px;
background-color: var(--darkbase);
border-radius: 2px;
cursor: pointer;
&::before {
content: '\e014';
font-family: 'Glyphicons Halflings';
color: white;
}
} }
.no-scroll { .no-scroll {