Subversion Repositories Integrator Subversion

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
1 espaco 1
/***
2
Theme Panel
3
***/
4
 
5
$base-color: lighten(#3D4A53, 1%);
6
 
7
.theme-panel {
8
    width: 400px;
9
    margin-top: -15px;
10
    margin-right: 0px;
11
    z-index: 100;
12
    float: right;
13
    position:relative;
14
 
15
    > .toggler {
16
        top:5px;
17
        right:1px;
18
        height: 40px;
19
        width: 40px;
20
        border-radius: 50% !important;
21
        cursor:pointer;
22
        position:absolute;
23
        text-align: center;
24
        background-color: #fff;
25
 
26
        > i {
27
            position: relative;
28
            top: 12px;
29
            font-size: 20px;
30
            color: darken(#C0CDDC, 10%);
31
        }
32
 
33
        &:hover {
34
            background: #ACB5C3;
35
 
36
            > i {
37
                color: #fff;
38
            }
39
        }
40
    }
41
 
42
    > .toggler-close {
43
        display: none;
44
        top:5px;
45
        right:1px;
46
        z-index: 101;
47
        cursor:pointer;
48
        position:absolute;
49
 
50
        > i {
51
            position: relative;
52
            top: 12px;
53
            right: 12px;
54
            font-size: 20px;
55
            color: darken(#fff, 5%);
56
        }
57
 
58
        &:hover {
59
            @include opacity(0.8);
60
        }
61
    }
62
 
63
    > .theme-options {
64
        box-shadow: 5px 5px rgba($base-color, 0.1);
65
        top:4px;
66
        right:0;
67
        display:none;
68
        position:absolute;
69
        z-index: 100;
70
        background:$base-color;
71
        border:1px solid darken($base-color, 3%);
72
        @include border-radius($general-border-radius);
73
 
74
        > .theme-option {
75
            color:#eee;
76
            padding: 11px;
77
            border-top:1px solid lighten($base-color, 3%);
78
            margin-top: 0px;
79
            margin-bottom: 0px;
80
 
81
            > span {
82
              text-transform:uppercase;
83
              display: inline-block;
84
              width: 115px;
85
              font-size: 13px;
86
              font-weight: 300;
87
            }
88
 
89
            > select.form-control {
90
              display: inline;
91
              width: 100px;
92
              padding: 2px;
93
              text-transform: lowercase;
94
            }
95
 
96
            &.theme-colors {
97
                border-top: 0;
98
 
99
                > span {
100
                  display: block;
101
                  width: auto;
102
                }
103
 
104
                > ul {
105
                  list-style:none;
106
                  padding: 0;
107
                  display: block;
108
                  margin-bottom: 10px !important;
109
                  margin-top: 15px;
110
 
111
                  > li {
112
                        width:46px;
113
                        height:45px;
114
                        margin:0 4px;
115
                        cursor:pointer;
116
                        list-style:none;
117
                        float: left;
118
                        border:solid 1px #707070;
119
 
120
                        &:first-child {
121
                            margin-left: 0;
122
                        }
123
 
124
                        &:hover,
125
                        &.current {
126
                            border:solid 2px #d64635;
127
                        }
128
 
129
                        /* theme colors */
130
                        &.color-default {
131
                            background: #2b3643;
132
                        }
133
 
134
                        &.color-dark {
135
                            background: #333438;
136
                        }
137
 
138
                        &.color-blue {
139
                            background: #26344B;
140
                        }
141
 
142
                        &.color-grey {
143
                            background: #4D5B69;
144
                        }
145
 
146
                        &.color-light {
147
                            background: #f5f5f5;
148
                        }
149
                    }
150
                }
151
            }
152
        }
153
    }
154
}