1
|
// Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */
|
2
|
|
3
|
//
|
4
|
// Component: Overlay
|
5
|
//
|
6
|
// ========================================================================
|
7
|
|
8
|
|
9
|
// Variables
|
10
|
// ========================================================================
|
11
|
|
12
|
@overlay-panel-color: @global-contrast-color;
|
13
|
|
14
|
@overlay-panel-background: fade(@global-background, 90%);
|
15
|
|
16
|
@overlay-icon-size: 30px;
|
17
|
@overlay-icon-color: @global-contrast-color;
|
18
|
|
19
|
//
|
20
|
// New
|
21
|
//
|
22
|
|
23
|
@overlay-button-border: @global-contrast-color;
|
24
|
@overlay-button-color: @global-contrast-color;
|
25
|
@overlay-button-hover-color: @global-color;
|
26
|
|
27
|
@overlay-background-border-width: 15px;
|
28
|
@overlay-background-color: @global-color;
|
29
|
@overlay-background-heading-color: @global-heading-color;
|
30
|
|
31
|
|
32
|
// Sub-object `uk-overlay-panel`
|
33
|
// ========================================================================
|
34
|
|
35
|
.hook-overlay-panel() {}
|
36
|
|
37
|
|
38
|
// Sub-object `uk-overlay-background`
|
39
|
// ========================================================================
|
40
|
|
41
|
.hook-overlay-background() {
|
42
|
|
43
|
border: @overlay-background-border-width solid rgba(0,0,0,0);
|
44
|
-moz-background-clip: padding-box;
|
45
|
-webkit-background-clip: padding-box;
|
46
|
background-clip: padding-box;
|
47
|
color: @overlay-background-color;
|
48
|
|
49
|
h1, h2, h3, h4, h5, h6 { color: @overlay-background-heading-color; }
|
50
|
&.uk-overlay-icon:before { color: @overlay-background-color; }
|
51
|
|
52
|
+ .uk-overlay-panel,
|
53
|
~ .uk-overlay-panel {
|
54
|
|
55
|
color: @overlay-background-color;
|
56
|
h1, h2, h3, h4, h5, h6 { color: @overlay-background-heading-color; }
|
57
|
&.uk-overlay-icon:before { color: @overlay-background-color; }
|
58
|
|
59
|
}
|
60
|
|
61
|
}
|
62
|
|
63
|
|
64
|
// Sub-object `uk-overlay-image`
|
65
|
// ========================================================================
|
66
|
|
67
|
.hook-overlay-image() {}
|
68
|
|
69
|
|
70
|
// Sub-object `uk-overlay-icon`
|
71
|
// ========================================================================
|
72
|
|
73
|
.hook-overlay-icon() {}
|
74
|
|
75
|
|
76
|
// Miscellaneous
|
77
|
// ========================================================================
|
78
|
|
79
|
.hook-overlay-misc() {
|
80
|
|
81
|
.uk-overlay-panel:not(.uk-overlay-background) .uk-button:not(.uk-button-primary):not(.uk-button-success):not(.uk-button-danger):not(.uk-button-link):before { background: @overlay-button-border; }
|
82
|
|
83
|
.uk-overlay-panel:not(.uk-overlay-background):not(.uk-overlay-background) .uk-button:not(.uk-button-primary):not(.uk-button-success):not(.uk-button-danger):not(.uk-button-link),
|
84
|
.uk-overlay-panel:not(.uk-overlay-background) .uk-icon-button {
|
85
|
|
86
|
border-color: @overlay-button-border;
|
87
|
color: @overlay-button-color;
|
88
|
|
89
|
&:after { background: @overlay-button-border; }
|
90
|
|
91
|
&:hover,
|
92
|
&:focus {
|
93
|
border-color: @overlay-button-border;
|
94
|
color: @overlay-button-hover-color;
|
95
|
}
|
96
|
|
97
|
}
|
98
|
|
99
|
}
|