Project

General

Profile

1
// colors
2
@text_primary_color:			#212121;
3
@text_secondary_color:			#727272;
4
@text_muted:                    #aaa;
5
@site_background:               #fff;
6

    
7
@border_color:                  rgba(0,0,0,0.12);
8
@border_color_hex:              #e0e0e0;
9
@border_color_light:            rgba(0,0,0,0.08);
10
@background_color_default:      rgba(0,0,0,0.085);
11
@background_color_default_hex:  #ededed;
12
@hover_bg:                      #f5f5f5;
13

    
14
@white:                         #fff;
15

    
16
@danger_color:                  @md-color-red-600;
17
@primary_color:                 @md-color-blue-500;
18
@primary_color_dark:            @md-color-blue-700;
19
@success_color:                 @md-color-light-green-600;
20
@warning_color:                 @md-color-amber-700;
21
@muted_color:                   @md-color-grey-400;
22

    
23
// theme
24
@theme_primary_color:           @md-color-blue-500;
25
@theme_light_color:             @md-color-blue-50;
26
@theme_dark_color:              @md-color-blue-700;
27
@accent_color:                  @md-color-light-green-600;
28

    
29
/* md buttons */
30
@hover_btn:                     rgba(153,153,153,0.2);
31
@active_btn:                    rgba(153,153,153,0.4);
32

    
33
// input colors
34
@input_on_color:                @md-color-teal-500;
35
@input_off_color:               rgba(0,0,0,.54);
36
@input_disabled_color:          rgba(0,0,0,.26);
37
@input_disabled_color_hex:      #bdbdbd;
38

    
39
// swiftOut easing
40
@md_easing:                     cubic-bezier(0.4,0,0.2,1);
41

    
42
// main header
43
@header_main_height:            64px;
44
@header_main_mobile_height:     48px;
45
@header_main_height_double:     (@header_main_height*2)+10;
46
@header_main_zIndex:            1104;
47

    
48
// top bar
49
@top_bar_height:                40px;
50

    
51
// main sidebar
52
@sidebar_main_width:            240px;
53
@sidebar_main_width_mini:       60px;
54

    
55
// secondary sidebar
56
@sidebar_secondary_width:       280px;
57

    
58
// media queries
59
@screen_xlarge:                 ~"only screen and (min-width: 1220px)";
60
@screen_large:                  ~"only screen and (min-width: 960px)";
61
@screen_medium:                 ~"only screen and (min-width: 768px)";
62
@screen_small:                  ~"only screen and (min-width: 480px)";
63

    
64
@screen_xlarge_max:             ~"only screen and (max-width: 1219px)";
65
@screen_large_max:              ~"only screen and (max-width: 959px)";
66
@screen_medium_max:             ~"only screen and (max-width: 767px)";
67
@screen_small_max:              ~"only screen and (max-width: 479px)";
68

    
69
// box-sizing: border-box (this and all childrens)
70
.border-box() {
71
    &,
72
    &:before,
73
    &:after,
74
    *,
75
    *:before,
76
    *:after {
77
        box-sizing: border-box;
78
    }
79
}
80

    
81
// Retina background-image support with non-retina fall back
82
.retina_image(@file-1x, @file-2x, @width-1x, @height-1x) {
83
    background-image: url("@{file-1x}");
84
    background-repeat: no-repeat;
85
    @media only screen and (-webkit-min-device-pixel-ratio: 2),
86
            only screen and ( min--moz-device-pixel-ratio: 2),
87
            only screen and ( -o-min-device-pixel-ratio: 2/1),
88
            only screen and ( min-device-pixel-ratio: 2),
89
            only screen and ( min-resolution: 192dppx),
90
            only screen and ( min-resolution: 2dppx) {
91
        background-image: url("@{file-2x}");
92
        background-size: @width-1x @height-1x;
93
    }
94
}
95

    
96
// remove default styles for ordered/unordered list
97
.reset_list(@margin: 0, @padding: 0) {
98
    margin: @margin;
99
    padding: @padding;
100
    list-style: none;
101
    > li {
102
        padding: 0;
103
        margin: 0;
104
        list-style: none;
105
    }
106
}
107

    
108
// clearfix
109
.clearfix() {
110
    &:before,
111
    &:after {
112
        content: " ";
113
        display: table;
114
    }
115
    &:after {
116
        clear: both;
117
    }
118
}
119

    
120
// custom fonts
121
.md_font(@weight: 400, @size: 14px, @height: 20px) {
122
    font: @weight @size e('/') @height "Roboto", sans-serif;
123
}
124
.code_font(@weight: 400, @size: 14px, @height: 18px) {
125
    font: @weight @size e('/') @height "Source Code Pro",Consolas, Monaco, 'Andale Mono', monospace !important;
126
}
127

    
128
.md_font_family() {
129
    font-family: "Roboto", sans-serif;
130
}
131

    
132
// text truncate
133
.truncate_line(@width: 100%) {
134
    text-overflow: ellipsis;
135
    display: inline-block;
136
    vertical-align: top;
137
    white-space: nowrap;
138
    overflow: hidden;
139
    width: @width;
140
}
(3-3/4)