Project

General

Profile

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
}
(31-31/49)