Revision cd670dfa
Von Hans Peter Schlaepfer vor etwa 5 Jahren hinzugefügt
- ID cd670dfafdb3560614634765e2a377946ff1809b
- Vorgänger ff33b093
| css/less/developing_demo.less | ||
|---|---|---|
| 1 |
/* ------------------------------------------------------------- */ |
|
| 2 |
/* DEVELOPING DEMO (developing_demo.less) */ |
|
| 3 |
/* ------------------------------------------------------------- */ |
|
| 4 |
|
|
| 1 | 5 |
// ---------------------------------------------------------------------------- |
| 2 | 6 |
// |
| 3 | 7 |
// DEVELOPERS DEMO |
| ... | ... | |
| 13 | 17 |
// ---------------------------------------------------------------------------- |
| 14 | 18 |
|
| 15 | 19 |
|
| 16 |
@import 'variables'; |
|
| 20 |
@import 'variables.less';
|
|
| 17 | 21 |
|
| 18 | 22 |
// -------------- |
| 19 | 23 |
// Grey shades |
| 20 |
.gray-darker { background-color: @gray-darker }
|
|
| 21 |
.gray-dark { background-color: @gray-dark }
|
|
| 22 |
.gray-mediumdark { background-color: @gray-mediumdark }
|
|
| 23 |
.gray { background-color: @gray }
|
|
| 24 |
.gray-medium { background-color: @gray-medium }
|
|
| 25 |
.gray-light { background-color: @gray-light }
|
|
| 26 |
.gray-lighter { background-color: @gray-lighter }
|
|
| 27 |
.gray-morelighter { background-color: @gray-morelighter }
|
|
| 24 |
.gray-darker { background-color: @gray-darker }
|
|
| 25 |
.gray-verydark { background-color: @gray-verydark }
|
|
| 26 |
.gray-dark { background-color: @gray-dark }
|
|
| 27 |
.gray-standard { background-color: @gray-standard }
|
|
| 28 |
.gray-light { background-color: @gray-light }
|
|
| 29 |
.gray-lighter { background-color: @gray-lighter }
|
|
| 28 | 30 |
.gray-verylight { background-color: @gray-verylight }
|
| 29 |
.gray-superlight { background-color: @gray-superlight }
|
|
| 31 |
.gray-superlight{ background-color: @gray-superlight }
|
|
| 30 | 32 |
// -------------- |
| 31 | 33 |
// Divers Color Specications |
| 32 | 34 |
// for message and other coloured stuff |
| ... | ... | |
| 102 | 104 |
// -------------------------------------- |
| 103 | 105 |
// SCAFFOLDING |
| 104 | 106 |
// -------------------------------------- |
| 105 |
.body-bg { background-color: @body-bg } // general
|
|
| 107 |
.body-bg { background-color: @body-bg } // general PENDENT: obsolete
|
|
| 106 | 108 |
.content-bg { background-color: @content-bg } // background first tabs
|
| 107 | 109 |
.tabs-bg { background-color: @tabs-bg } // background tabs panel (data/content)
|
| 108 | 110 |
.heading-bg { background-color: @heading-bg } // controlpanels & other stuff
|
| 109 |
.controlpanel-bg { background-color: @controlpanel-bg } // controlpanels
|
|
| 111 |
.controlpanel-bg { background-color: @controlpanel-bg-color } // controlpanels
|
|
| 110 | 112 |
|
| 111 | 113 |
.text-color { background-color: @text-color }
|
| 112 | 114 |
.heading-color { background-color: @heading-color } // labels & table headings
|
| ... | ... | |
| 116 | 118 |
h1, |
| 117 | 119 |
h2{
|
| 118 | 120 |
clear: both; |
| 119 |
color: @gray !important; |
|
| 121 |
color: @gray-standard !important;
|
|
| 120 | 122 |
padding: 0 ; |
| 121 | 123 |
margin: 0 ; |
| 122 | 124 |
} |
| ... | ... | |
| 131 | 133 |
padding: 0 ; |
| 132 | 134 |
|
| 133 | 135 |
h3{
|
| 134 |
color: @gray !important; |
|
| 136 |
color: @gray-standard !important;
|
|
| 135 | 137 |
font-size: 9pt; |
| 136 | 138 |
font-weight: normal; |
| 137 | 139 |
height: 2.8em ; |
| ... | ... | |
| 158 | 160 |
|
| 159 | 161 |
|
| 160 | 162 |
|
| 163 |
/* -------------------------------------- */ |
|
| 164 |
/* Colors for Developers Color Demo */ |
|
| 165 |
/* -------------------------------------- */ |
|
| 166 |
|
|
| 167 |
|
|
| 168 |
// ----------------------- |
|
| 169 |
// GREY SHADES |
|
| 170 |
// ----------------------- |
|
| 171 |
.gray-superdark: #000000 ; // Black |
|
| 172 |
.gray-verydark: #222222 ; |
|
| 173 |
.gray-darker: #555555 ; |
|
| 174 |
.gray-dark: #888888 ; |
|
| 175 |
|
|
| 176 |
.gray-standard: #aaaaaa ; |
|
| 177 |
|
|
| 178 |
.gray-light: #cfcfcf ; |
|
| 179 |
.gray-lighter: #dedede ; |
|
| 180 |
.gray-verylight: #ececec ; |
|
| 181 |
.gray-superlight: #ffffff ; // White |
|
| 182 |
|
|
| 183 |
|
|
| 184 |
// ----------------------- |
|
| 185 |
// BRAND COLORS |
|
| 186 |
// ----------------------- |
|
| 187 |
.brand-superdark: @gray-superdark ; // Black |
|
| 188 |
.brand-verydark: @gray-verydark ; |
|
| 189 |
.brand-darker: @gray-darker ; |
|
| 190 |
.brand-dark: @gray-dark ; |
|
| 191 |
|
|
| 192 |
.brand-standard: @gray-standard ; |
|
| 193 |
|
|
| 194 |
.brand-light: @gray-light ; |
|
| 195 |
.brand-lighter: @gray-lighter ; |
|
| 196 |
.brand-verylight: @gray-verylight ; |
|
| 197 |
.brand-superlight: @gray-superlight ; // White |
|
| 198 |
|
|
| 199 |
|
|
| 161 | 200 |
|
| 201 |
// ----------------------- |
|
| 202 |
// Special Color Specifications for messages |
|
| 203 |
// ----------------------- |
|
| 162 | 204 |
|
| 205 |
// OK (Green) |
|
| 206 |
.color-green-strong: #003c18; |
|
| 207 |
.color-green-light: #9ccb21; |
|
| 163 | 208 |
|
| 209 |
// Error (Red) |
|
| 210 |
.color-red-strong: #ae0014; |
|
| 211 |
.color-red-light: #ffd6d6; |
|
| 164 | 212 |
|
| 213 |
// Info/Hint (Blue) |
|
| 214 |
.color-blue-strong: #209ec8; |
|
| 215 |
.color-blue-light: #b6e6e5; |
|
| 165 | 216 |
|
| 217 |
// Warning (Orange) |
|
| 218 |
.color-orange-strong: #8D6A00; // more brown |
|
| 219 |
.color-orange-light: #f6d972; |
|
| 166 | 220 |
|
| 221 |
// Divers |
|
| 222 |
.rainbow-green: #408000; |
|
| 223 |
.rainbow-blue: #0080FF; |
|
| 224 |
.rainbow-red: #FF0000; |
|
| 225 |
.rainbow-yellow: #FFFF00; |
|
| 167 | 226 |
|
Auch abrufbar als: Unified diff
Erweiterung und Optimierung less und css fuer Design 4.0