modals.joomla.less
1.59 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
//
// Modals
// --------------------------------------------------
/* Joomla JUI NOTE: Original .modal definition has to be commented */
// > Joomla JUI
// Base modal
div.modal {
position: fixed;
top: 5%;
left: 50%;
z-index: @zindexModal;
width: 80%;
margin-left: -40%;
background-color: @white;
border: 1px solid #999;
border: 1px solid rgba(0,0,0,.3);
*border: 1px solid #999; /* IE6-7 */
.border-radius(6px);
.box-shadow(0 3px 7px rgba(0,0,0,0.3));
.background-clip(padding-box);
// Remove focus outline from opened modal
outline: none;
&.fade {
.transition(e('opacity .3s linear, top .3s ease-out'));
top: -25%;
}
&.fade.in { top: 5%; }
}
//Modal for Batch views
.modal-batch {
overflow-y: visible;
}
// Modal viewport dimensions
.modal-body[class^="jviewport-height"],
.modal-body[class*="jviewport-height"] {
max-height: none;
}
.jviewport-height {
&10 { height: 10vh; }
&20 { height: 20vh; }
&30 { height: 30vh; }
&40 { height: 40vh; }
&50 { height: 50vh; }
&60 { height: 60vh; }
&70 { height: 70vh; }
&80 { height: 80vh; }
&90 { height: 90vh; }
&100 { height: 100vh; }
}
div.modal.jviewport-width {
&10 { width: 10vw; margin-left: -5vw; }
&20 { width: 20vw; margin-left: -10vw; }
&30 { width: 30vw; margin-left: -15vw; }
&40 { width: 40vw; margin-left: -20vw; }
&50 { width: 50vw; margin-left: -25vw; }
&60 { width: 60vw; margin-left: -30vw; }
&70 { width: 70vw; margin-left: -35vw; }
&80 { width: 80vw; margin-left: -40vw; }
&90 { width: 90vw; margin-left: -45vw; }
&100 { width: 100vw; margin-left: -50vw; }
}
// < Joomla JUI