Revision 3fc38171
Von Andreas Rudin vor etwa 6 Jahren hinzugefügt
| css/less/variables.less | ||
|---|---|---|
| 5 | 5 |
// ---------------------------------------------------------------------------- |
| 6 | 6 |
// DESCRIPTION: |
| 7 | 7 |
// |
| 8 |
// |
|
| 9 |
// |
|
| 10 | 8 |
// CONTENTS: |
| 11 | 9 |
// - COLORS |
| 12 | 10 |
// - Greys |
| 13 | 11 |
// - Branding |
| 14 | 12 |
// - Divers Color Specifications |
| 15 |
// - DIMENSIONS |
|
| 16 |
// - Standard Dimensions |
|
| 17 |
// - Dimensions for Table Colums (COL) |
|
| 18 | 13 |
// - SCAFFOLDING |
| 19 | 14 |
// - Body/Content Background color, Text color |
| 20 | 15 |
// - Content Boxes (Wrapper & Columns Container) |
| ... | ... | |
| 46 | 41 |
// - MESSAGES |
| 47 | 42 |
// - Messages Old Style |
| 48 | 43 |
// - Flash Messages |
| 44 |
// - DIMENSIONS |
|
| 45 |
// - Standard Dimensions |
|
| 46 |
// - Dimensions for Table Colums (COL) |
|
| 49 | 47 |
// ---------------------------------------------------------------------------- |
| 50 | 48 |
|
| 51 | 49 |
|
| 52 |
|
|
| 53 |
|
|
| 54 |
// -------------- |
|
| 55 |
// Original Kivitendo Colors |
|
| 56 |
// |
|
| 57 |
// Background: #EBEBEB burlywood |
|
| 58 |
// Links: #006400 DarkGreen |
|
| 59 |
// Link-hover #FE5F14 Orange / #FFFFE0 lightyellow |
|
| 60 |
// Titles, BG/VG: #79B61B Mid-green FFFFFF White |
|
| 61 |
// Tabcolor: #CAFFA3 |
|
| 62 |
// |
|
| 63 |
|
|
| 64 |
|
|
| 65 |
|
|
| 66 |
|
|
| 67 | 50 |
// -------------------------------------- |
| 68 | 51 |
// COLORS |
| 69 | 52 |
// -------------------------------------- |
| 53 |
// Base Colors see variables_color_scheme.less |
|
| 70 | 54 |
|
| 71 | 55 |
|
| 72 |
// -------------- |
|
| 73 |
// Grey shades |
|
| 74 |
// |
|
| 75 |
|
|
| 76 |
@gray-darker: #222222 ; |
|
| 77 |
@gray-dark: #555555 ; |
|
| 78 |
@gray: #999999 ; |
|
| 79 |
@gray-light: #cecece ; |
|
| 80 |
@gray-lighter: #dedede ; |
|
| 81 |
@gray-verylight: #ececec ; |
|
| 82 |
@gray-superlight: #efefef ; |
|
| 83 |
|
|
| 84 |
|
|
| 85 |
// -------------- |
|
| 86 |
// Brand colors |
|
| 87 |
// |
|
| 88 |
|
|
| 89 |
@brand-primary: #000000; |
|
| 90 |
@brand-success: #FF0080; |
|
| 91 |
@brand-warning: #f0ad4e; |
|
| 92 |
@brand-danger: #d9534f; |
|
| 93 |
@brand-info: #5bc0de; |
|
| 94 |
|
|
| 95 | 56 |
|
| 96 |
@rainbow-green: #408000; |
|
| 97 |
@rainbow-blue: #0080FF; |
|
| 98 |
@rainbow-red: #FF0000; |
|
| 99 |
@rainbow-yellow: #FFFF00; |
|
| 100 |
|
|
| 101 |
|
|
| 102 |
// -------------- |
|
| 103 |
// Divers Color Specications |
|
| 57 |
// ------------------- |
|
| 58 |
// General text color (label & data) |
|
| 104 | 59 |
// |
| 60 |
// Standard text |
|
| 61 |
@brand-primary: @brand-text-color; |
|
| 62 |
@brand-label: @brand-data-label-color; |
|
| 63 |
@brand-label-bg: @brand-lighter; |
|
| 105 | 64 |
|
| 106 |
@color-darkgreen: #006400; |
|
| 107 |
@color-midgreen: #79B61B; |
|
| 108 |
@color-lightgreen: #CAFFA3; |
|
| 109 |
@color-softneongreen: #ADFFB6; |
|
| 110 |
|
|
| 111 |
@color-orange: #FE5F14; |
|
| 112 |
@color-strongorange: #FF6600; |
|
| 113 |
@color-lightorange: #FFE8C7; |
|
| 114 |
|
|
| 115 |
@color-lightestyellow: #FFFFE0; |
|
| 116 |
@color-lightyellow: #FFFF99; |
|
| 117 |
@color-mediumyellow: #FFEE66; |
|
| 65 |
// Messages & info types |
|
| 66 |
@brand-ok: @color-green-strong; |
|
| 67 |
@brand-ok-bg: @color-green-light; |
|
| 118 | 68 |
|
| 119 |
@color-pink: #FFCCCC;
|
|
| 120 |
@color-strongpink: #F5A9A9;
|
|
| 69 |
@brand-error: @color-red-strong;
|
|
| 70 |
@brand-error-bg: @color-red-light;
|
|
| 121 | 71 |
|
| 122 |
@color-darkred: #8B0000;
|
|
| 123 |
@color-darkestred: #AE0014;
|
|
| 72 |
@brand-info: @color-blue-strong;
|
|
| 73 |
@brand-info-bg: @color-blue-light;
|
|
| 124 | 74 |
|
| 125 |
@color-lightestblue: #DCF2FF;
|
|
| 126 |
@color-strongblue: #4690FF;
|
|
| 75 |
@brand-warning: @color-orange-strong;
|
|
| 76 |
@brand-warning-bg: @color-orange-light;
|
|
| 127 | 77 |
|
| 78 |
// Positive & negative colors |
|
| 79 |
@brand-positive: @color-green-strong; |
|
| 80 |
@brand-positive-bg: @color-green-light; |
|
| 81 |
@brand-negative: @color-red-strong; |
|
| 82 |
@brand-negative-bg: @color-red-light; |
|
| 128 | 83 |
|
| 129 | 84 |
|
| 130 |
// -------------------------------------- |
|
| 131 |
// DIMENSIONS (width) |
|
| 132 |
// -------------------------------------- |
|
| 133 |
|
|
| 134 |
|
|
| 135 |
// -------------- |
|
| 136 |
// Standard Dimensions |
|
| 137 |
// Only for Containers like DIV, TABLE, TH, TD, COL, P |
|
| 138 |
// |
|
| 139 |
// Table cells: COL, TD, TH, DIV |
|
| 85 |
// ------------------- |
|
| 86 |
// Messages & info types |
|
| 140 | 87 |
// |
| 88 |
@brand-ok: @color-green-strong; |
|
| 89 |
@brand-ok-bg: @color-green-light; |
|
| 141 | 90 |
|
| 142 |
@wi-smallest: 41.6px ; //2.6em ; // one or two ciphers |
|
| 143 |
@wi-verysmall: 80.0px ; //5.0em ; |
|
| 144 |
@wi-small: 128px ; // 8.0em ; // Date 2018/06/06 |
|
| 145 |
@wi-mediumsmall: 160px ; // 10.0em ; |
|
| 146 |
@wi-normal: 208px ; // 13.0em ; |
|
| 147 |
@wi-lightwide: 256px ; // 16.0em ; // min-width |
|
| 148 |
@wi-wide: 320px ; // 20.0em ; // min-width |
|
| 149 |
@wi-wider: 384px ; // 24.0em ; // min-width |
|
| 150 |
@wi-verywide: 576px ; // 36.0em ; // min-width |
|
| 151 |
|
|
| 91 |
@brand-error: @color-red-strong; |
|
| 92 |
@brand-error-bg: @color-red-light; |
|
| 152 | 93 |
|
| 94 |
@brand-info: @color-blue-strong; |
|
| 95 |
@brand-info-bg: @color-blue-light; |
|
| 153 | 96 |
|
| 154 |
// -------------- |
|
| 155 |
// Dimensions for DIVs |
|
| 156 |
// |
|
| 157 |
|
|
| 158 |
@div-wi-smallest: (@wi-smallest ) ; |
|
| 159 |
@div-wi-verysmall: (@wi-verysmall ) ; |
|
| 160 |
@div-wi-small: (@wi-small ) ; |
|
| 161 |
@div-wi-mediumsmall: (@wi-mediumsmall ) ; |
|
| 162 |
@div-wi-normal: (@wi-normal ) ; |
|
| 163 |
@div-wi-lightwide: (@wi-lightwide ) ; |
|
| 164 |
@div-wi-wide: (@wi-wide ) ; // min-width |
|
| 165 |
@div-wi-wider: (@wi-wider ) ; // min-width |
|
| 166 |
@div-wi-verywide: (@wi-verywide ) ; // min-width |
|
| 97 |
@brand-warning: @color-orange-strong; |
|
| 98 |
@brand-warning-bg: @color-orange-light; |
|
| 167 | 99 |
|
| 100 |
// Positive & negative colors |
|
| 101 |
@brand-positive: @color-green-strong; |
|
| 102 |
@brand-positive-bg: @color-green-light; |
|
| 103 |
@brand-negative: @color-red-strong; |
|
| 104 |
@brand-negative-bg: @color-red-light; |
|
| 168 | 105 |
|
| 169 |
// -------------- |
|
| 170 |
// Dimensions for Table Colums (TH, TD & Col) |
|
| 171 |
// |
|
| 172 | 106 |
|
| 173 |
@tcol-wi-smallest: (@wi-smallest ) ; |
|
| 174 |
@tcol-wi-verysmall: (@wi-verysmall ) ; |
|
| 175 |
@tcol-wi-small: (@wi-small ) ; |
|
| 176 |
@tcol-wi-mediumsmall: (@wi-mediumsmall ) ; |
|
| 177 |
@tcol-wi-normal: (@wi-normal ) ; |
|
| 178 |
@tcol-wi-lightwide: (@wi-lightwide ) ; |
|
| 179 |
@tcol-wi-wide: (@wi-wide ) ; // min-width |
|
| 180 |
@tcol-wi-wider: (@wi-wider ) ; // min-width |
|
| 181 |
@tcol-wi-verywide: (@wi-verywide ) ; // min-width |
|
| 182 | 107 |
|
| 183 | 108 |
// -------------- |
| 184 |
// Dimensions for combined rows with combination Table column widths
|
|
| 109 |
// Content Boxes
|
|
| 185 | 110 |
// |
| 186 | 111 |
|
| 187 |
@tcol-wi-small-small: (@tcol-wi-small + @tcol-wi-small ) ; |
|
| 188 |
@tcol-wi-small-mediumsmall: (@tcol-wi-small + @tcol-wi-mediumsmall ) ; |
|
| 189 |
@tcol-wi-small-normal: (@tcol-wi-small + @tcol-wi-normal ) ; |
|
| 190 |
@tcol-wi-small-lightwide: (@tcol-wi-small + @tcol-wi-lightwide ) ; |
|
| 191 |
@tcol-wi-small-wide: (@tcol-wi-small + @tcol-wi-wide ) ; |
|
| 192 |
@tcol-wi-small-wider: (@tcol-wi-small + @tcol-wi-wider ) ; |
|
| 193 |
@tcol-wi-small-verywide: (@tcol-wi-small + @tcol-wi-verywide ) ; |
|
| 112 |
@text-min-width: 400px ; |
|
| 113 |
@text-max-width: 600px ; |
|
| 194 | 114 |
|
| 195 |
@tcol-wi-mediumsmall-small: (@tcol-wi-mediumsmall + @tcol-wi-small ) ; |
|
| 196 |
@tcol-wi-mediumsmall-mediumsmall:(@tcol-wi-mediumsmall + @tcol-wi-mediumsmall ) ; |
|
| 197 |
@tcol-wi-mediumsmall-normal: (@tcol-wi-mediumsmall + @tcol-wi-normal ) ; |
|
| 198 |
@tcol-wi-mediumsmall-lightwide: (@tcol-wi-mediumsmall + @tcol-wi-lightwide ) ; |
|
| 199 |
@tcol-wi-mediumsmall-wide: (@tcol-wi-mediumsmall + @tcol-wi-wide ) ; |
|
| 200 |
@tcol-wi-mediumsmall-wider: (@tcol-wi-mediumsmall + @tcol-wi-wider ) ; |
|
| 201 |
@tcol-wi-mediumsmall-verywide: (@tcol-wi-mediumsmall + @tcol-wi-verywide ) ; |
|
| 202 | 115 |
|
| 203 |
@tcol-wi-normal-small: (@tcol-wi-normal + @tcol-wi-small ) ; |
|
| 204 |
@tcol-wi-normal-mediumsmall: (@tcol-wi-normal + @tcol-wi-mediumsmall ) ; |
|
| 205 |
@tcol-wi-normal-normal: (@tcol-wi-normal + @tcol-wi-normal ) ; |
|
| 206 |
@tcol-wi-normal-lightwide: (@tcol-wi-normal + @tcol-wi-lightwide ) ; |
|
| 207 |
@tcol-wi-normal-wide: (@tcol-wi-normal + @tcol-wi-wide ) ; |
|
| 208 |
@tcol-wi-normal-wider: (@tcol-wi-normal + @tcol-wi-wider ) ; |
|
| 209 |
@tcol-wi-normal-verywide: (@tcol-wi-normal + @tcol-wi-verywide ) ; |
|
| 116 |
// like Wrappers, Colums Containers, Flash-Messages and Record Selection |
|
| 117 |
@content-padding: 0 0 0 0; // 0 is OK otherwise there will be a border after the ui-tabs-panels |
|
| 118 |
@content-margin: 104px 0 1.0em 0; // PENDENT: ueberpruefen |
|
| 210 | 119 |
|
| 211 |
@tcol-wi-lightwide-small: (@tcol-wi-lightwide + @tcol-wi-small ) ; |
|
| 212 |
@tcol-wi-lightwide-mediumsmall: (@tcol-wi-lightwide + @tcol-wi-mediumsmall ) ; |
|
| 213 |
@tcol-wi-lightwide-normal: (@tcol-wi-lightwide + @tcol-wi-normal ) ; |
|
| 214 |
@tcol-wi-lightwide-lightwide: (@tcol-wi-lightwide + @tcol-wi-lightwide ) ; |
|
| 215 |
@tcol-wi-lightwide-wide: (@tcol-wi-lightwide + @tcol-wi-wide ) ; |
|
| 216 |
@tcol-wi-lightwide-wider: (@tcol-wi-lightwide + @tcol-wi-wider ) ; |
|
| 217 |
@tcol-wi-lightwide-verywide: (@tcol-wi-lightwide + @tcol-wi-verywide ) ; |
|
| 218 | 120 |
|
| 121 |
@margin-left-from-content: 0.6em ; // directly inside #content |
|
| 122 |
@margin-left-from-wrapper: 0 ; // directly inside .wrapper |
|
| 219 | 123 |
|
| 124 |
@margin-from-content: 1em 1em 1em @margin-left-from-content ; // directly inside #content |
|
| 125 |
@margin-from-wrapper: 0 0 0.4em @margin-left-from-wrapper ; // directly inside .wrapper |
|
| 220 | 126 |
|
| 127 |
// Paragraphs, messages |
|
| 128 |
@text-container-width: auto ; |
|
| 129 |
@text-container-min-width: @text-min-width ; |
|
| 130 |
@text-container-max-width: @text-max-width ; |
|
| 221 | 131 |
|
| 132 |
@messages_width: 60.0em; |
|
| 133 |
@messages-min-width: 60.0em; |
|
| 134 |
@messages-max-width: 40.0em; |
|
| 222 | 135 |
|
| 223 | 136 |
|
| 137 |
@contentbox-margin: 1.0em 1.0em 1.0em 0.6em ; |
|
| 138 |
@contentbox-padding: 0.6em 1.0em 1.2em 1.8em ; |
|
| 139 |
@contentbox-radius: 0.6em ; |
|
| 224 | 140 |
|
| 225 | 141 |
// -------------- |
| 226 |
// Dimensions for Form elements
|
|
| 142 |
// Content Panels
|
|
| 227 | 143 |
// |
| 144 |
@controlpanel-margin: @contentbox-margin ; |
|
| 145 |
@controlpanel-padding: 1.2em 1.0em 0.8em 1.2em ; |
|
| 146 |
@controlpanel-padding-bold: 0.8em 1.0em 1.4em 1.2em ; |
|
| 147 |
@controlpanel-bg: @brand-lighter ; |
|
| 148 |
@controlpanel-color: @brand-darkest ; |
|
| 149 |
@controlpanel-border: 1px @brand-darkest solid ; |
|
| 150 |
@controlpanel-radius: @contentbox-radius ; |
|
| 151 |
@controlpanel-bg-hover: @brand-darkest ; |
|
| 152 |
@controlpanel-bg-hover-text:@brand-light ; |
|
| 153 |
@controlpanel-active-bg: @brand-strong-dimmed ; |
|
| 154 |
@controlpanel-active-text: @brand-lighter ; |
|
| 228 | 155 |
|
| 229 |
@diff-input-select: 36px ; //1.6em ; |
|
| 230 |
|
|
| 231 |
// Input elements |
|
| 232 |
|
|
| 233 |
@input-wi-smallest: (@wi-smallest ) ; |
|
| 234 |
@input-wi-verysmall: (@wi-verysmall ) ; |
|
| 235 |
@input-wi-small: (@wi-small - @diff-input-select) ; |
|
| 236 |
@input-wi-mediumsmall: (@wi-mediumsmall - @diff-input-select) ; |
|
| 237 |
@input-wi-normal: (@wi-normal - @diff-input-select) ; |
|
| 238 |
@input-wi-lightwide: (@wi-lightwide - @diff-input-select) ; |
|
| 239 |
@input-wi-wide: (@wi-wide) - @diff-input-select ; // min-width |
|
| 240 |
@input-wi-wider: (@wi-wider) - @diff-input-select ; // min-width |
|
| 241 |
@input-wi-verywide: (@wi-verywide) - @diff-input-select ; // min-width |
|
| 242 |
|
|
| 243 |
// Select elements |
|
| 244 |
|
|
| 245 |
@select-wi-smallest: (@wi-smallest ) ; |
|
| 246 |
@select-wi-verysmall: (@wi-verysmall ) ; |
|
| 247 |
@select-wi-small: (@wi-small - @diff-input-select ) ; |
|
| 248 |
@select-wi-mediumsmall: (@wi-mediumsmall - @diff-input-select ) ; |
|
| 249 |
@select-wi-normal: (@wi-normal - @diff-input-select ) ; |
|
| 250 |
@select-wi-lightwide: (@wi-lightwide - @diff-input-select ) ; |
|
| 251 |
@select-wi-wide: (@wi-wide - @diff-input-select ) ; // min-width |
|
| 252 |
@select-wi-wider: (@wi-wider - @diff-input-select ) ; // min-width |
|
| 253 |
@select-wi-verywide: (@wi-verywide - @diff-input-select ) ; // min-width |
|
| 254 |
|
|
| 255 |
|
|
| 256 |
|
|
| 257 |
// Textarea elements with standard dimensions |
|
| 258 |
|
|
| 259 |
@textarea-wi-normal: (@wi-normal - @diff-input-select ) ; |
|
| 260 |
@textarea-wi-lightwide: (@wi-lightwide - @diff-input-select ) ; |
|
| 261 |
@textarea-wi-wide: (@wi-wide - @diff-input-select ) ; // min-width |
|
| 262 |
@textarea-wi-wider: (@wi-wider - @diff-input-select ) ; // min-width |
|
| 263 |
@textarea-wi-verywide: (@wi-verywide - @diff-input-select ) ; // min-width |
|
| 264 |
|
|
| 265 |
// Textarea elements with combined dimensions |
|
| 266 |
|
|
| 267 |
@diff-input-textarea-combined: 0px ; //1.6em ; |
|
| 268 |
//@textarea-margin-combined: 24px ; |
|
| 269 |
|
|
| 270 |
// @textarea-wi-small-small: (((@wi-small + @wi-small) - @diff-input-textarea-combined) ; |
|
| 271 |
// @textarea-wi-small-mediumsmall: (((@tcol-wi-small + @input-wi-mediumsmall)) - @diff-input-textarea-combined - 10px ) ; |
|
| 272 |
// @textarea-wi-small-normal: (((@wi-small + @wi-normal) - @diff-input-textarea-combined) ; |
|
| 273 |
// @textarea-wi-small-lightwide: (((@wi-small + @wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 274 |
// @textarea-wi-small-wide: (((@wi-small + @wi-wide) - @diff-input-textarea-combined) ; |
|
| 275 |
// @textarea-wi-small-wider: (((@wi-small + @wi-wider) - @diff-input-textarea-combined) ; |
|
| 276 |
// @textarea-wi-small-verywide: (((@wi-small + @wi-verywide) - @diff-input-textarea-combined) ; |
|
| 277 |
// |
|
| 278 |
// @textarea-wi-mediumsmall-small: (((@wi-mediumsmall + @wi-small) - @diff-input-textarea-combined) ; |
|
| 279 |
// @textarea-wi-mediumsmall-mediumsmall: (((@wi-mediumsmall + @wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 280 |
// @textarea-wi-mediumsmall-normal: (((@wi-mediumsmall + @wi-normal) - @diff-input-textarea-combined) ; |
|
| 281 |
// @textarea-wi-mediumsmall-lightwide: (((@wi-mediumsmall + @wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 282 |
// @textarea-wi-mediumsmall-wide: (((@wi-mediumsmall + @wi-wide) - @diff-input-textarea-combined) ; |
|
| 283 |
// @textarea-wi-mediumsmall-wider: (((@wi-mediumsmall + @wi-wider) - @diff-input-textarea-combined) ; |
|
| 284 |
// @textarea-wi-mediumsmall-verywide: (((@wi-mediumsmall + @wi-verywide) - @diff-input-textarea-combined) ; |
|
| 285 |
// |
|
| 286 |
// @textarea-wi-normal-small: (((@wi-normal + @wi-small) - @diff-input-textarea-combined) ; |
|
| 287 |
// @textarea-wi-normal-mediumsmall: (((@wi-normal + @wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 288 |
// @textarea-wi-normal-normal: (((@wi-normal + @wi-normal) - @diff-input-textarea-combined) ; |
|
| 289 |
// @textarea-wi-normal-lightwide: (((@wi-normal + @wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 290 |
// @textarea-wi-normal-wide: (((@wi-normal + @wi-wide) - @diff-input-textarea-combined) ; |
|
| 291 |
// @textarea-wi-normal-wider: (((@wi-normal + @wi-wider) - @diff-input-textarea-combined) ; |
|
| 292 |
// @textarea-wi-normal-verywide: (((@wi-normal + @wi-verywide) - @diff-input-textarea-combined) ; |
|
| 293 |
// |
|
| 294 |
// @textarea-wi-lightwide-small: (((@wi-lightwide + @wi-small) - @diff-input-textarea-combined) ; |
|
| 295 |
// @textarea-wi-lightwide-mediumsmall: (((@wi-lightwide + @wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 296 |
// @textarea-wi-lightwide-normal: (((@wi-lightwide + @wi-normal) - @diff-input-textarea-combined) ; |
|
| 297 |
// @textarea-wi-lightwide-lightwide: (((@wi-lightwide + @wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 298 |
// @textarea-wi-lightwide-wide: (((@wi-lightwide + @wi-wide) - @diff-input-textarea-combined) ; |
|
| 299 |
// @textarea-wi-lightwide-wider: (((@wi-lightwide + @wi-wider) - @diff-input-textarea-combined) ; |
|
| 300 |
// @textarea-wi-lightwide-verywide: (((@wi-lightwide + @wi-verywide) - @diff-input-textarea-combined) ; |
|
| 301 |
// |
|
| 302 |
// @textarea-wi-wide-small: (((@wi-wide + @wi-small) - @diff-input-textarea-combined) ; |
|
| 303 |
// @textarea-wi-wide-mediumsmall: (((@wi-wide + @wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 304 |
// @textarea-wi-wide-normal: (((@wi-wide + @wi-normal) - @diff-input-textarea-combined) ; |
|
| 305 |
// @textarea-wi-wide-lightwide: (((@wi-wide + @wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 306 |
// @textarea-wi-wide-wide: (((@wi-wide + @wi-wide) - @diff-input-textarea-combined) ; |
|
| 307 |
// @textarea-wi-wide-wider: (((@wi-wide + @wi-wider) - @diff-input-textarea-combined) ; |
|
| 308 |
// @textarea-wi-wide-verywide: (((@wi-wide + @wi-verywide) - @diff-input-textarea-combined) ; |
|
| 309 |
|
|
| 310 |
|
|
| 311 |
@textarea-wi-small-small: ((@tcol-wi-small + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 312 |
@textarea-wi-small-mediumsmall: ((@tcol-wi-small + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 313 |
@textarea-wi-small-normal: ((@tcol-wi-small + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 314 |
@textarea-wi-small-lightwide: ((@tcol-wi-small + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 315 |
@textarea-wi-small-wide: ((@tcol-wi-small + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 316 |
@textarea-wi-small-wider: ((@tcol-wi-small + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 317 |
@textarea-wi-small-verywide: ((@tcol-wi-small + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 318 |
|
|
| 319 |
@textarea-wi-mediumsmall-small: ((@tcol-wi-mediumsmall + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 320 |
@textarea-wi-mediumsmall-mediumsmall: ((@tcol-wi-mediumsmall + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 321 |
@textarea-wi-mediumsmall-normal: ((@tcol-wi-mediumsmall + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 322 |
@textarea-wi-mediumsmall-lightwide: ((@tcol-wi-mediumsmall + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 323 |
@textarea-wi-mediumsmall-wide: ((@tcol-wi-mediumsmall + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 324 |
@textarea-wi-mediumsmall-wider: ((@tcol-wi-mediumsmall + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 325 |
@textarea-wi-mediumsmall-verywide: ((@tcol-wi-mediumsmall + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 156 |
@controlpanel-h3-color: @brand-heading-color ; |
|
| 157 |
@controlpanel-h3-size: 110% ; |
|
| 158 |
@controlpanel-h3-style: normal ; |
|
| 159 |
@controlpanel-h3-weight: normal ; |
|
| 326 | 160 |
|
| 327 |
@textarea-wi-normal-small: ((@tcol-wi-normal + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 328 |
@textarea-wi-normal-mediumsmall: ((@tcol-wi-normal + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 329 |
@textarea-wi-normal-normal: ((@tcol-wi-normal + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 330 |
@textarea-wi-normal-lightwide: ((@tcol-wi-normal + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 331 |
@textarea-wi-normal-wide: ((@tcol-wi-normal + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 332 |
@textarea-wi-normal-wider: ((@tcol-wi-normal + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 333 |
@textarea-wi-normal-verywide: ((@tcol-wi-normal + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 334 |
|
|
| 335 |
@textarea-wi-lightwide-small: ((@tcol-wi-lightwide + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 336 |
@textarea-wi-lightwide-mediumsmall: ((@tcol-wi-lightwide + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 337 |
@textarea-wi-lightwide-normal: ((@tcol-wi-lightwide + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 338 |
@textarea-wi-lightwide-lightwide: ((@tcol-wi-lightwide + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 339 |
@textarea-wi-lightwide-wide: ((@tcol-wi-lightwide + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 340 |
@textarea-wi-lightwide-wider: ((@tcol-wi-lightwide + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 341 |
@textarea-wi-lightwide-verywide: ((@tcol-wi-lightwide + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 342 |
|
|
| 343 |
@textarea-wi-wide-small: ((@tcol-wi-wide + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 344 |
@textarea-wi-wide-mediumsmall: ((@tcol-wi-wide + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 345 |
@textarea-wi-wide-normal: ((@tcol-wi-wide + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 346 |
@textarea-wi-wide-lightwide: ((@tcol-wi-wide + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 347 |
@textarea-wi-wide-wide: ((@tcol-wi-wide + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 348 |
@textarea-wi-wide-wider: ((@tcol-wi-wide + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 349 |
@textarea-wi-wide-verywide: ((@tcol-wi-wide + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 350 |
|
|
| 351 |
|
|
| 352 |
|
|
| 353 |
// -------------------------------------- |
|
| 354 |
// SCAFFOLDING |
|
| 355 |
// -------------------------------------- |
|
| 356 |
|
|
| 357 |
@body-bg: #4f4f4f; |
|
| 358 |
@content-bg: #eeeeee; |
|
| 359 |
@text-color: @gray-darker; |
|
| 360 |
|
|
| 361 |
|
|
| 362 |
// -------------- |
|
| 363 |
// Content Boxes |
|
| 364 |
// |
|
| 365 |
// like Wrappers, Colums Containers, Flash-Messages and Record Selection |
|
| 366 |
|
|
| 367 |
@contentbox-margin: 1.0em 1.0em 0.0em 1.0em ; |
|
| 368 |
@contentbox-padding: 0 1.0em 1.0em 1.0em ; |
|
| 369 |
@contentbox-radius: 0.3em ; |
|
| 370 |
|
|
| 371 |
@message-margin: 1.0em 2.0em 0.6em 1.0em ; |
|
| 372 |
@message-padding: 0.6em 0.6em 0.5em 0.6em ; |
|
| 373 |
|
|
| 374 |
@instructionbox-bg: #E6E6E6 ; |
|
| 375 |
@instructionbox-border: 1px #808080 solid ; |
|
| 161 |
@controlpanel-h4-color: @brand-heading-color ; |
|
| 162 |
@controlpanel-h4-size: 105% ; |
|
| 163 |
@controlpanel-h4-weight: bold ; |
|
| 164 |
@controlpanel-h4-style: normal ; |
|
| 376 | 165 |
|
| 166 |
// select item control panel |
|
| 167 |
@controlpanel-select-item-padding: 0.6em 1.0em 0.6em 0.8em ; |
|
| 377 | 168 |
|
| 169 |
@instructionbox-bg: @controlpanel-bg ; |
|
| 170 |
@instructionbox-border: 1px @brand-darkest solid ; |
|
| 378 | 171 |
|
| 379 | 172 |
|
| 380 | 173 |
|
| 381 | 174 |
// -------------------------------------- |
| 382 | 175 |
// LINKS |
| 383 | 176 |
// -------------------------------------- |
| 384 |
|
|
| 385 |
@link-color: @brand-primary; |
|
| 177 |
@link-color: @brand-link-color; |
|
| 386 | 178 |
@link-hover-color: darken(@link-color, 15%); |
| 387 |
|
|
| 179 |
@link-decoration: none; |
|
| 180 |
@link-hover-decoration: underline; |
|
| 388 | 181 |
|
| 389 | 182 |
|
| 390 | 183 |
|
| ... | ... | |
| 395 | 188 |
// -------------- |
| 396 | 189 |
// Font family |
| 397 | 190 |
// |
| 398 |
|
|
| 399 | 191 |
@font-family-sans-serif: Verdana, "Helvetica Neue", Helvetica, Arial, sans-serif ; |
| 400 | 192 |
@font-family-serif: Georgia, "Times New Roman", Times, serif ; |
| 401 | 193 |
@font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace; |
| 402 |
@font-family-base: @font-family-sans-serif; |
|
| 403 | 194 |
|
| 195 |
@font-family-base: @font-family-sans-serif; |
|
| 404 | 196 |
|
| 405 | 197 |
// -------------- |
| 406 | 198 |
// Font size |
| 407 | 199 |
// |
| 408 |
|
|
| 409 |
@font-size-base: 12pt; // vorh.14px |
|
| 200 |
@font-size-base: 11pt; // vorh.14px |
|
| 410 | 201 |
@font-size-large: ceil(@font-size-base * 1.25); // ~18px |
| 411 | 202 |
@font-size-medium: ceil(@font-size-base * 1.0 ); // ~18px |
| 412 | 203 |
@font-size-small: ceil(@font-size-base * 0.85); // ~11px |
| 413 | 204 |
@font-size-smaller: ceil(@font-size-base * 0.76); // ~12px |
| 414 |
|
|
| 205 |
@font-size-verysmall: ceil(@font-size-base * 0.6); // ~12px |
|
| 415 | 206 |
|
| 416 | 207 |
// -------------- |
| 417 | 208 |
// Line height |
| 418 | 209 |
// |
| 419 |
|
|
| 420 | 210 |
@line-height-base: 1.428571429; // 20/14 |
| 421 | 211 |
@line-height-computed: floor(@font-size-base * @line-height-base); // ~20px |
| 422 | 212 |
|
| ... | ... | |
| 424 | 214 |
// -------------- |
| 425 | 215 |
// Heading 1-6 |
| 426 | 216 |
// |
| 427 |
|
|
| 428 |
@font-size-h1: floor(@font-size-base * 1.4); // ~36px |
|
| 429 |
@font-size-h2: floor(@font-size-base * 1.3); // ~30px |
|
| 430 |
@font-size-h3: ceil(@font-size-base * 1.0); // ~24px |
|
| 431 |
@font-size-h4: ceil(@font-size-base * 1.0); // ~18px |
|
| 432 |
@font-size-h5: @font-size-base; |
|
| 433 |
@font-size-h6: ceil(@font-size-base * 0.85); // ~12px |
|
| 434 |
|
|
| 435 | 217 |
@headings-font-family: @font-family-base; |
| 436 |
@headings-font-weight: 500; |
|
| 437 |
@headings-line-height: 1.1; |
|
| 438 |
@headings-color: #000; |
|
| 439 |
|
|
| 218 |
@headings-weight: 500; |
|
| 219 |
@headings-line-height: 1.3em; |
|
| 220 |
@headings-color: @brand-heading-color; |
|
| 221 |
@headings-color-accent: #000; |
|
| 222 |
|
|
| 223 |
@headings-color-error: @brand-error; |
|
| 224 |
@headings-color-confirm: @brand-ok; |
|
| 225 |
|
|
| 226 |
@h1-size: floor(@font-size-base * 1.1); // ~**px |
|
| 227 |
@h2-size: floor(@font-size-base * 1.2); // ~**px |
|
| 228 |
@h3-size: ceil(@font-size-base * 1.1); // ~**px |
|
| 229 |
@h4-size: ceil(@font-size-base * 1.0); // ~**px |
|
| 230 |
@h5-size: @font-size-base; |
|
| 231 |
@h6-size: ceil(@font-size-base * 0.85); // ~**px |
|
| 232 |
|
|
| 233 |
@h1-style: normal; |
|
| 234 |
@h2-style: normal; |
|
| 235 |
@h3-style: normal; |
|
| 236 |
@h4-style: normal; |
|
| 237 |
|
|
| 238 |
@h1-weight: bold; |
|
| 239 |
@h2-weight: bold; |
|
| 240 |
@h3-weight: normal; |
|
| 241 |
@h4-weight: normal; |
|
| 440 | 242 |
|
| 441 | 243 |
// -------------- |
| 442 | 244 |
// Heading 1 (H1) |
| 443 |
// |
|
| 245 |
// Fixed on top of every page together with the action bar |
|
| 246 |
@h1-color: @brand-h1-color; |
|
| 247 |
@h1-bg: @brand-h1-bg; |
|
| 248 |
@h1-padding: 0.7em 0.5em 0.7em 0.7em; |
|
| 249 |
@h1-margin: 0; |
|
| 444 | 250 |
|
| 445 |
@h1-text-color: #003c18; |
|
| 446 |
@h1-bg-color: #9ccb21; |
|
| 251 |
// Heading Controlpanels |
|
| 447 | 252 |
|
| 253 |
@h3-controlpanel-size: @h3-size; |
|
| 254 |
@h4-controlpanel-size: @h4-size; |
|
| 255 |
|
|
| 256 |
@h3-controlpanel-style: bold; |
|
| 257 |
@h4-controlpanel-style: bold; |
|
| 258 |
|
|
| 259 |
@h3-controlpanel-weight: normal; |
|
| 260 |
@he-controlpanel-weight: bold; |
|
| 261 |
|
|
| 262 |
|
|
| 263 |
// ------------------- |
|
| 264 |
// Data types |
|
| 265 |
// |
|
| 266 |
@heading-and-label-color: @brand-data-label-color ; |
|
| 267 |
@heading-and-label-bg: @brand-data-label-color ; |
|
| 268 |
@data-color: @brand-data-color ; |
|
| 269 |
|
|
| 270 |
@long-desc-size: @font-size-verysmall ; |
|
| 271 |
@long-desc-color: @brand-text-color ; |
|
| 448 | 272 |
|
| 449 | 273 |
|
| 450 | 274 |
|
| 451 | 275 |
// -------------------------------------- |
| 452 | 276 |
// Iconography |
| 453 | 277 |
// -------------------------------------- |
| 454 |
|
|
| 455 |
|
|
| 456 |
@icon-font-path: "../bootstrap/fonts/"; |
|
| 457 |
@icon-font-name: "glyphicons-halflings-regular"; |
|
| 278 |
//@icon-font-path: "../bootstrap/fonts/"; |
|
| 279 |
//@icon-font-name: "glyphicons-halflings-regular"; |
|
| 458 | 280 |
|
| 459 | 281 |
|
| 460 | 282 |
|
| ... | ... | |
| 463 | 285 |
// TABLES |
| 464 | 286 |
// -------------------------------------- |
| 465 | 287 |
|
| 466 |
|
|
| 467 | 288 |
// -------------- |
| 468 | 289 |
// Table & Caption |
| 469 | 290 |
// |
| 470 |
|
|
| 471 | 291 |
@table-bg: transparent; // overall background-color |
| 472 |
@table-bg-accent: #f9f9f9; // for striping
|
|
| 473 |
@table-bg-hover: #f5f5f5;
|
|
| 292 |
@table-bg-accent: @brand-lighter; // for striping
|
|
| 293 |
@table-bg-hover: #ffffff;
|
|
| 474 | 294 |
@table-bg-active: @table-bg-hover; |
| 475 |
@table-border-color: #ddd; // table and cell border
|
|
| 295 |
@table-border-color: @brand-darkest; // table and cell border
|
|
| 476 | 296 |
|
| 477 |
@t-caption-bg: transparent ; |
|
| 478 |
@t-caption-text-color: @headings-color ; |
|
| 297 |
@table-caption-bg: transparent ; |
|
| 298 |
@table-caption-color: @brand-darkest; |
|
| 299 |
@table-caption-size: @h3-size - 1pt ; |
|
| 300 |
@table-caption-style: @h3-style ; |
|
| 301 |
@table-caption-weight: @h3-weight ; |
|
| 479 | 302 |
|
| 480 | 303 |
|
| 481 | 304 |
// -------------- |
| 482 | 305 |
// Table Cells |
| 483 | 306 |
// |
| 484 |
|
|
| 485 | 307 |
@t-cell-padding: 8px; |
| 486 | 308 |
@t-cell-padding-condensed: 5px; |
| 487 | 309 |
|
| 488 |
@t-cell-head-bg: transparent; |
|
| 489 |
@t-cell-head-bg-accent: #BFBFBF; |
|
| 490 |
@t-cell-head-text: #555; |
|
| 491 |
@t-cell-head-text-accent: #888888; |
|
| 310 |
@t-cell-text-color: @brand-darkest; |
|
| 311 |
|
|
| 312 |
@t-cell-head-bg: @brand-strong; |
|
| 313 |
@t-cell-head-bg-accent: @gray-light; |
|
| 314 |
@t-cell-head-text: @brand-light; |
|
| 315 |
@t-cell-head-text-accent: @brand-lighter; |
|
| 316 |
|
|
| 317 |
@t-cell-label-text: @brand-strong-dimmed; |
|
| 318 |
@t-cell-label-text-accent: @brand-strong-dimmed-hover; |
|
| 319 |
@t-cell-data-text: @brand-darkest; |
|
| 320 |
@t-cell-data-text-accent: @brand-darkest; |
|
| 492 | 321 |
|
| 493 | 322 |
|
| 323 |
@t-cell-foot-text: @brand-darkest; |
|
| 324 |
|
|
| 325 |
// Zebra effect in list tables |
|
| 326 |
@t-row-zebra-bg-odd: @brand-lighter; |
|
| 327 |
@t-row-zebra-bg-even: @brand-light; |
|
| 328 |
@t-row-zebra-bg-hover: #ffffff; |
|
| 329 |
|
|
| 330 |
@t-row-zebra-bg-error: @brand-error-bg; |
|
| 331 |
@t-row-zebra-bg-special: #FEF2C5; // PENDENT: ANSCHAUEN |
|
| 332 |
@t-row-zebra-bg-highlight: #B4F4FE; // PENDENT: ANSCHAUEN |
|
| 494 | 333 |
|
| 495 | 334 |
|
| 496 | 335 |
// -------------------------------------- |
| ... | ... | |
| 499 | 338 |
|
| 500 | 339 |
@btn-font-weight: normal; |
| 501 | 340 |
// ------------------- |
| 502 |
// Standard-Button (with Submission)
|
|
| 503 |
//
|
|
| 341 |
// STANDARD-Button Strong (with Submission / data manipulation)
|
|
| 342 |
// |
|
| 504 | 343 |
// Standard |
| 505 |
@btn-default-color: #5562B2;
|
|
| 506 |
@btn-default-bg: #99CCFF;
|
|
| 507 |
@btn-default-border: #5562B2;
|
|
| 344 |
@btn-default-color: @brand-verylight;
|
|
| 345 |
@btn-default-bg: @brand-strong;
|
|
| 346 |
@btn-default-border: @brand-darkest;
|
|
| 508 | 347 |
// Hover |
| 509 |
@btn-default-hover-color: #ffffff;
|
|
| 510 |
@btn-default-hover-bg: #5562B2;
|
|
| 511 |
@btn-default-hover-border: #99CCFF;
|
|
| 348 |
@btn-default-hover-color: #ffffff; |
|
| 349 |
@btn-default-hover-bg: @brand-strong-dimmed;
|
|
| 350 |
@btn-default-hover-border: @brand-darkest;
|
|
| 512 | 351 |
// Active |
| 513 |
@btn-default-active-color: #ffffff;
|
|
| 514 |
@btn-default-active-bg: #757EFF;
|
|
| 515 |
@btn-default-active-border: #5562B2;
|
|
| 352 |
@btn-default-active-color: #ffffff; |
|
| 353 |
@btn-default-active-bg: @brand-strong-dimmed;
|
|
| 354 |
@btn-default-active-border: @brand-darkest;
|
|
| 516 | 355 |
|
| 517 | 356 |
// ------------------- |
| 518 |
// Neutral-Button (NO Submission)
|
|
| 519 |
//
|
|
| 357 |
// NEUTRAL-Button (NO Submission)
|
|
| 358 |
// |
|
| 520 | 359 |
// Standard |
| 521 |
@btn-neutral-color: #666666;
|
|
| 522 |
@btn-neutral-bg: #cdcdcd;
|
|
| 523 |
@btn-neutral-border: #666666;
|
|
| 360 |
@btn-neutral-color: @brand-strong;
|
|
| 361 |
@btn-neutral-bg: @brand-lighter;
|
|
| 362 |
@btn-neutral-border: @brand-darkest;
|
|
| 524 | 363 |
// Hover |
| 525 |
@btn-neutral-hover-color: #000000;
|
|
| 526 |
@btn-neutral-hover-bg: #BBBBBB;
|
|
| 527 |
@btn-neutral-hover-border: #666666;
|
|
| 364 |
@btn-neutral-hover-color: @brand-strong;
|
|
| 365 |
@btn-neutral-hover-bg: @brand-light;
|
|
| 366 |
@btn-neutral-hover-border: @brand-darkest;
|
|
| 528 | 367 |
// Active |
| 529 |
@btn-neutral-active-color: #3C72A7; |
|
| 530 |
@btn-neutral-active-bg: #9BC6EE; |
|
| 531 |
@btn-neutral-active-border: #3C72A7; |
|
| 532 |
|
|
| 368 |
@btn-neutral-active-color: #ffffff; |
|
| 369 |
@btn-neutral-active-bg: @brand-light; |
|
| 370 |
@btn-neutral-active-border: @brand-darkest; |
|
| 533 | 371 |
|
| 534 | 372 |
|
| 373 |
// ------------------- |
|
| 374 |
// Diverse Button states |
|
| 375 |
// |
|
| 535 | 376 |
|
| 536 |
@btn-primary-color: #fff; |
|
| 377 |
@btn-primary-color: #ffffff;
|
|
| 537 | 378 |
@btn-primary-bg: @brand-primary; |
| 538 | 379 |
@btn-primary-border: darken(@btn-primary-bg, 5%); |
| 539 | 380 |
|
| 540 |
@btn-success-color: #fff; |
|
| 541 |
@btn-success-bg: @brand-success;
|
|
| 542 |
@btn-success-border: darken(@btn-success-bg, 5%);
|
|
| 381 |
@btn-success-color: #ffffff;
|
|
| 382 |
@btn-success-bg: @color-green-strong;
|
|
| 383 |
@btn-success-border: darken(@color-green-light, 5%);
|
|
| 543 | 384 |
|
| 544 |
@btn-warning-color: #fff; |
|
| 385 |
@btn-warning-color: #ffffff;
|
|
| 545 | 386 |
@btn-warning-bg: @brand-warning; |
| 546 | 387 |
@btn-warning-border: darken(@btn-warning-bg, 5%); |
| 547 | 388 |
|
| 548 |
@btn-danger-color: #fff; |
|
| 549 |
@btn-danger-bg: @brand-danger; |
|
| 550 |
@btn-danger-border: darken(@btn-danger-bg, 5%); |
|
| 551 |
|
|
| 552 |
@btn-info-color: #fff; |
|
| 389 |
@btn-info-color: #ffffff; |
|
| 553 | 390 |
@btn-info-bg: @brand-info; |
| 554 | 391 |
@btn-info-border: darken(@btn-info-bg, 5%); |
| 555 | 392 |
|
| ... | ... | |
| 666 | 503 |
// -------------- |
| 667 | 504 |
// Dashboard (frame-header) |
| 668 | 505 |
// |
| 669 |
|
|
| 670 |
@dashbrd_bg: #666 ; |
|
| 671 |
@dashbrd_text: #bbb ; |
|
| 672 |
@dashbrd_link: #aaa ; |
|
| 673 |
@dashbrd_link_hover: #fff ; |
|
| 506 |
@dashbrd_bg: @brand-darkest ; |
|
| 507 |
@dashbrd_text: @brand-light ; |
|
| 508 |
@dashbrd_link: @brand-light ; |
|
| 509 |
@dashbrd_link_hover: #ffffff ; |
|
| 674 | 510 |
@dashbrd_link_deco: underline ; |
| 675 |
@dashbrd_input_bg: #aaa;
|
|
| 676 |
@dashbrd_input_text: #000 ; |
|
| 511 |
@dashbrd_input_bg: @brand-light;
|
|
| 512 |
@dashbrd_input_text: #000000 ;
|
|
| 677 | 513 |
|
| 678 | 514 |
|
| 679 | 515 |
// -------------- |
| ... | ... | |
| 700 | 536 |
// -------------- |
| 701 | 537 |
// Context-Menu (layout-actionbar) |
| 702 | 538 |
// |
| 703 |
@actionbar-bg: #bcec6d;
|
|
| 704 |
@actionbar-bg-active: #bcec6d;
|
|
| 705 |
@actionbar-font-color: #1a920f;
|
|
| 706 |
@actionbar-font-color-active: #1a920f;
|
|
| 707 |
@actionbar-border-color: #30b21e;
|
|
| 708 |
@actionbar-border-color-active: #21af20;
|
|
| 539 |
@actionbar-bg: @brand-light;
|
|
| 540 |
@actionbar-bg-active: @brand-light;
|
|
| 541 |
@actionbar-font-color: #ffffff;
|
|
| 542 |
@actionbar-font-color-active: #ffffff;
|
|
| 543 |
@actionbar-border-color: @brand-strong;
|
|
| 544 |
@actionbar-border-color-active: @brand-strong;
|
|
| 709 | 545 |
|
| 710 | 546 |
|
| 711 | 547 |
|
| ... | ... | |
| 744 | 580 |
// -------------------------------------- |
| 745 | 581 |
// Messages |
| 746 | 582 |
// -------------------------------------- |
| 583 |
@message-margin: 3.6em 2.0em 0.6em 1.0em ; |
|
| 584 |
@message-padding: 0.6em 0.6em 0.5em 0.6em ; |
|
| 747 | 585 |
|
| 748 |
// -------------- |
|
| 749 |
// Flash Messages |
|
| 750 |
// |
|
| 751 | 586 |
// Error |
| 752 |
@message_error_bg: #FFD6D6 ;
|
|
| 753 |
@message_error_border: 1px solid #ae0014 ;
|
|
| 754 |
@message_error_text: #AE0014 ;
|
|
| 587 |
@message_error_bg: @brand-error-bg ;
|
|
| 588 |
@message_error_border: 1px solid @brand-error ;
|
|
| 589 |
@message_error_text: @brand-error ;
|
|
| 755 | 590 |
// OK |
| 756 |
@message_ok_bg: #C9EE8E ;
|
|
| 757 |
@message_ok_border: 1px solid #088604 ;
|
|
| 758 |
@message_ok_text: #088604 ;
|
|
| 591 |
@message_ok_bg: @brand-ok-bg ;
|
|
| 592 |
@message_ok_border: 1px solid @brand-ok ;
|
|
| 593 |
@message_ok_text: @brand-ok ;
|
|
| 759 | 594 |
// Info & Hint |
| 760 |
@message_info_bg: #BEE1E6 ;
|
|
| 761 |
@message_info_border: 1px solid #0039c1 ;
|
|
| 762 |
@message_info_text: #0039C1 ;
|
|
| 595 |
@message_info_bg: @brand-info-bg ;
|
|
| 596 |
@message_info_border: 1px solid @brand-info ;
|
|
| 597 |
@message_info_text: @brand-info ;
|
|
| 763 | 598 |
// Warning |
| 764 |
@message_warning_bg: #F6D972 ;
|
|
| 765 |
@message_warning_border: 1px solid #6D613E ;
|
|
| 766 |
@message_warning_text: #6D613E ;
|
|
| 599 |
@message_warning_bg: @brand-warning-bg ;
|
|
| 600 |
@message_warning_border: 1px solid @brand-warning ;
|
|
| 601 |
@message_warning_text: @brand-warning ;
|
|
| 767 | 602 |
// Hint (like Info above, just to make it sure working) |
| 768 | 603 |
@message_hint_bg: @message_info_bg ; |
| 769 | 604 |
@message_hint_border: @message_info_border ; |
| ... | ... | |
| 771 | 606 |
|
| 772 | 607 |
|
| 773 | 608 |
|
| 609 |
// -------------------------------------- |
|
| 610 |
// DIMENSIONS (width) |
|
| 611 |
// -------------------------------------- |
|
| 612 |
|
|
| 613 |
|
|
| 614 |
// -------------- |
|
| 615 |
// Standard Dimensions |
|
| 616 |
// Only for Containers like DIV, TABLE, TH, TD, COL, P |
|
| 617 |
// |
|
| 618 |
// Table cells: COL, TD, TH, DIV |
|
| 619 |
// |
|
| 620 |
@wi-smallest: 42px ; // 2.6em ; // one or two ciphers |
|
| 621 |
@wi-verysmall: 80px ; // 5.0em ; |
|
| 622 |
@wi-small: 128px ; // 8.0em ; // also date e.g. 2018/06/06 |
|
| 623 |
@wi-mediumsmall: 160px ; // 10.0em ; |
|
| 624 |
@wi-normal: 208px ; // 13.0em ; |
|
| 625 |
@wi-lightwide: 256px ; // 16.0em ; |
|
| 626 |
@wi-wide: 320px ; // 20.0em ; |
|
| 627 |
@wi-wider: 384px ; // 24.0em ; |
|
| 628 |
@wi-verywide: 576px ; // 36.0em ; |
|
| 629 |
|
|
| 630 |
// -------------- |
|
| 631 |
// Dimensions for DIVs |
|
| 632 |
// |
|
| 633 |
@div-wi-smallest: (@wi-smallest ) ; |
|
| 634 |
@div-wi-verysmall: (@wi-verysmall ) ; |
|
| 635 |
@div-wi-small: (@wi-small ) ; |
|
| 636 |
@div-wi-mediumsmall: (@wi-mediumsmall ) ; |
|
| 637 |
@div-wi-normal: (@wi-normal ) ; |
|
| 638 |
@div-wi-lightwide: (@wi-lightwide ) ; |
|
| 639 |
@div-wi-wide: (@wi-wide ) ; // min-width |
|
| 640 |
@div-wi-wider: (@wi-wider ) ; // min-width |
|
| 641 |
@div-wi-verywide: (@wi-verywide ) ; // min-width |
|
| 642 |
|
|
| 643 |
// -------------- |
|
| 644 |
// Dimensions for Table Colums (TH, TD & Col) |
|
| 645 |
// |
|
| 646 |
@tcol-wi-smallest: (@wi-smallest ) ; |
|
| 647 |
@tcol-wi-verysmall: (@wi-verysmall ) ; |
|
| 648 |
@tcol-wi-small: (@wi-small ) ; |
|
| 649 |
@tcol-wi-mediumsmall: (@wi-mediumsmall ) ; |
|
| 650 |
@tcol-wi-normal: (@wi-normal ) ; |
|
| 651 |
@tcol-wi-lightwide: (@wi-lightwide ) ; |
|
| 652 |
@tcol-wi-wide: (@wi-wide ) ; // min-width |
|
| 653 |
@tcol-wi-wider: (@wi-wider ) ; // min-width |
|
| 654 |
@tcol-wi-verywide: (@wi-verywide ) ; // min-width |
|
| 774 | 655 |
|
| 656 |
// -------------- |
|
| 657 |
// Dimensions for combined rows with combination Table column widths |
|
| 658 |
// |
|
| 659 |
@tcol-wi-small-small: (@tcol-wi-small + @tcol-wi-small ) ; |
|
| 660 |
@tcol-wi-small-mediumsmall: (@tcol-wi-small + @tcol-wi-mediumsmall ) ; |
|
| 661 |
@tcol-wi-small-normal: (@tcol-wi-small + @tcol-wi-normal ) ; |
|
| 662 |
@tcol-wi-small-lightwide: (@tcol-wi-small + @tcol-wi-lightwide ) ; |
|
| 663 |
@tcol-wi-small-wide: (@tcol-wi-small + @tcol-wi-wide ) ; |
|
| 664 |
@tcol-wi-small-wider: (@tcol-wi-small + @tcol-wi-wider ) ; |
|
| 665 |
@tcol-wi-small-verywide: (@tcol-wi-small + @tcol-wi-verywide ) ; |
|
| 775 | 666 |
|
| 667 |
@tcol-wi-mediumsmall-small: (@tcol-wi-mediumsmall + @tcol-wi-small ) ; |
|
| 668 |
@tcol-wi-mediumsmall-mediumsmall:(@tcol-wi-mediumsmall + @tcol-wi-mediumsmall ) ; |
|
| 669 |
@tcol-wi-mediumsmall-normal: (@tcol-wi-mediumsmall + @tcol-wi-normal ) ; |
|
| 670 |
@tcol-wi-mediumsmall-lightwide: (@tcol-wi-mediumsmall + @tcol-wi-lightwide ) ; |
|
| 671 |
@tcol-wi-mediumsmall-wide: (@tcol-wi-mediumsmall + @tcol-wi-wide ) ; |
|
| 672 |
@tcol-wi-mediumsmall-wider: (@tcol-wi-mediumsmall + @tcol-wi-wider ) ; |
|
| 673 |
@tcol-wi-mediumsmall-verywide: (@tcol-wi-mediumsmall + @tcol-wi-verywide ) ; |
|
| 674 |
|
|
| 675 |
@tcol-wi-normal-small: (@tcol-wi-normal + @tcol-wi-small ) ; |
|
| 676 |
@tcol-wi-normal-mediumsmall: (@tcol-wi-normal + @tcol-wi-mediumsmall ) ; |
|
| 677 |
@tcol-wi-normal-normal: (@tcol-wi-normal + @tcol-wi-normal ) ; |
|
| 678 |
@tcol-wi-normal-lightwide: (@tcol-wi-normal + @tcol-wi-lightwide ) ; |
|
| 679 |
@tcol-wi-normal-wide: (@tcol-wi-normal + @tcol-wi-wide ) ; |
|
| 680 |
@tcol-wi-normal-wider: (@tcol-wi-normal + @tcol-wi-wider ) ; |
|
| 681 |
@tcol-wi-normal-verywide: (@tcol-wi-normal + @tcol-wi-verywide ) ; |
|
| 682 |
|
|
| 683 |
@tcol-wi-lightwide-small: (@tcol-wi-lightwide + @tcol-wi-small ) ; |
|
| 684 |
@tcol-wi-lightwide-mediumsmall: (@tcol-wi-lightwide + @tcol-wi-mediumsmall ) ; |
|
| 685 |
@tcol-wi-lightwide-normal: (@tcol-wi-lightwide + @tcol-wi-normal ) ; |
|
| 686 |
@tcol-wi-lightwide-lightwide: (@tcol-wi-lightwide + @tcol-wi-lightwide ) ; |
|
| 687 |
@tcol-wi-lightwide-wide: (@tcol-wi-lightwide + @tcol-wi-wide ) ; |
|
| 688 |
@tcol-wi-lightwide-wider: (@tcol-wi-lightwide + @tcol-wi-wider ) ; |
|
| 689 |
@tcol-wi-lightwide-verywide: (@tcol-wi-lightwide + @tcol-wi-verywide ) ; |
|
| 690 |
|
|
| 691 |
// -------------- |
|
| 692 |
// Dimensions for Form elements |
|
| 693 |
// |
|
| 694 |
@diff-input-select: 36px ; //1.6em ; |
|
| 695 |
|
|
| 696 |
// Input elements |
|
| 697 |
@form-element-margin-right: 5px ; |
|
| 698 |
|
|
| 699 |
@input-wi-smallest: (@wi-smallest ) ; |
|
| 700 |
@input-wi-verysmall: (@wi-verysmall ) ; |
|
| 701 |
@input-wi-small: (@wi-small - @diff-input-select) ; |
|
| 702 |
@input-wi-mediumsmall: (@wi-mediumsmall - @diff-input-select) ; |
|
| 703 |
@input-wi-normal: (@wi-normal - @diff-input-select) ; |
|
| 704 |
@input-wi-lightwide: (@wi-lightwide - @diff-input-select) ; |
|
| 705 |
@input-wi-wide: (@wi-wide) - @diff-input-select ; // min-width |
|
| 706 |
@input-wi-wider: (@wi-wider) - @diff-input-select ; // min-width |
|
| 707 |
@input-wi-verywide: (@wi-verywide) - @diff-input-select ; // min-width |
|
| 708 |
|
|
| 709 |
// Input elements with combined dimensions |
|
| 710 |
|
|
| 711 |
// Minus size combinations (take care of the double hyphen --) |
|
| 712 |
@input-wi-lightwide--verysmall: ( @input-wi-lightwide - @input-wi-verysmall ) - 1 ; |
|
| 713 |
@input-wi-wide--verysmall: ( @input-wi-wide - @input-wi-verysmall ) - ( @form-element-margin-right ) + 4px ; |
|
| 714 |
|
|
| 715 |
// Select elements |
|
| 716 |
@select-wi-smallest: (@wi-smallest ) ; |
|
| 717 |
@select-wi-verysmall: (@wi-verysmall ) ; |
|
| 718 |
@select-wi-small: (@wi-small - @diff-input-select ) ; |
|
| 719 |
@select-wi-mediumsmall: (@wi-mediumsmall - @diff-input-select ) ; |
|
| 720 |
@select-wi-normal: (@wi-normal - @diff-input-select ) ; |
|
| 721 |
@select-wi-lightwide: (@wi-lightwide - @diff-input-select ) ; |
|
| 722 |
@select-wi-wide: (@wi-wide - @diff-input-select ) ; // min-width |
|
| 723 |
@select-wi-wider: (@wi-wider - @diff-input-select ) ; // min-width |
|
| 724 |
@select-wi-verywide: (@wi-verywide - @diff-input-select ) ; // min-width |
|
| 725 |
|
|
| 726 |
// Select elements with combined dimensions |
|
| 727 |
@diff-select-combined: 0 ; |
|
| 728 |
|
|
| 729 |
@select-wi-small-normal: ((@wi-small + (@wi-normal - @diff-input-select)) - @diff-select-combined ) ; |
|
| 730 |
@select-wi-small-lightwide: ((@wi-small + (@wi-lightwide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 731 |
@select-wi-small-wide: ((@wi-small + (@wi-wide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 732 |
@select-wi-small-wider: ((@wi-small + (@wi-wider - @diff-input-select)) - @diff-select-combined ) ; |
|
| 733 |
@select-wi-small-verywide: ((@wi-small + (@wi-verywide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 734 |
@select-wi-mediumsmall-normal: ((@wi-mediumsmall + (@wi-normal - @diff-input-select)) - @diff-select-combined ) ; |
|
| 735 |
@select-wi-mediumsmall-lightwide: ((@wi-mediumsmall + (@wi-lightwide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 736 |
@select-wi-mediumsmall-wide: ((@wi-mediumsmall + (@wi-wide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 737 |
@select-wi-mediumsmall-wider: ((@wi-mediumsmall + (@wi-wider - @diff-input-select)) - @diff-select-combined ) ; |
|
| 738 |
@select-wi-mediumsmall-verywide: ((@wi-mediumsmall + (@wi-verywide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 739 |
@select-wi-normal-normal: ((@wi-normal + (@wi-normal - @diff-input-select)) - @diff-select-combined ) ; |
|
| 740 |
@select-wi-normal-lightwide: ((@wi-normal + (@wi-lightwide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 741 |
@select-wi-normal-wide: ((@wi-normal + (@wi-wide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 742 |
@select-wi-normal-wider: ((@wi-normal + (@wi-wider - @diff-input-select)) - @diff-select-combined ) ; |
|
| 743 |
@select-wi-normal-verywide: ((@wi-normal + (@wi-verywide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 744 |
@select-wi-lightwide-normal: ((@wi-lightwide + (@wi-normal - @diff-input-select)) - @diff-select-combined ) ; |
|
| 745 |
@select-wi-lightwide-lightwide: ((@wi-lightwide + (@wi-lightwide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 746 |
@select-wi-lightwide-wide: ((@wi-lightwide + (@wi-wide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 747 |
@select-wi-lightwide-wider: ((@wi-lightwide + (@wi-wider - @diff-input-select)) - @diff-select-combined ) ; |
|
| 748 |
@select-wi-lightwide-verywide: ((@wi-lightwide + (@wi-verywide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 749 |
@select-wi-wide-normal: ((@wi-wide + (@wi-normal - @diff-input-select)) - @diff-select-combined ) ; |
|
| 750 |
@select-wi-wide-lightwide: ((@wi-wide + (@wi-lightwide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 751 |
@select-wi-wide-wide: ((@wi-wide + (@wi-wide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 752 |
@select-wi-wide-wider: ((@wi-wide + (@wi-wider - @diff-input-select)) - @diff-select-combined ) ; |
|
| 753 |
@select-wi-wide-verywide: ((@wi-wide + (@wi-verywide - @diff-input-select)) - @diff-select-combined ) ; |
|
| 754 |
|
|
| 755 |
// Textarea elements with standard dimensions |
|
| 756 |
@textarea-wi-normal: (@wi-normal - @diff-input-select ) ; |
|
| 757 |
@textarea-wi-lightwide: (@wi-lightwide - @diff-input-select ) ; |
|
| 758 |
@textarea-wi-wide: (@wi-wide - @diff-input-select ) ; // min-width |
|
| 759 |
@textarea-wi-wider: (@wi-wider - @diff-input-select ) ; // min-width |
|
| 760 |
@textarea-wi-verywide: (@wi-verywide - @diff-input-select ) ; // min-width |
|
| 761 |
|
|
| 762 |
// Textarea elements with combined dimensions |
|
| 763 |
@diff-input-textarea-combined: 0px ; //1.6em ; |
|
| 764 |
//@textarea-margin-combined: 24px ; |
|
| 765 |
|
|
| 766 |
@textarea-wi-small-small: ((@tcol-wi-small + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 767 |
@textarea-wi-small-mediumsmall: ((@tcol-wi-small + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 768 |
@textarea-wi-small-normal: ((@tcol-wi-small + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 769 |
@textarea-wi-small-lightwide: ((@tcol-wi-small + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 770 |
@textarea-wi-small-wide: ((@tcol-wi-small + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 771 |
@textarea-wi-small-wider: ((@tcol-wi-small + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 772 |
@textarea-wi-small-verywide: ((@tcol-wi-small + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 773 |
|
|
| 774 |
@textarea-wi-mediumsmall-small: ((@tcol-wi-mediumsmall + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 775 |
@textarea-wi-mediumsmall-mediumsmall: ((@tcol-wi-mediumsmall + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 776 |
@textarea-wi-mediumsmall-normal: ((@tcol-wi-mediumsmall + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 777 |
@textarea-wi-mediumsmall-lightwide: ((@tcol-wi-mediumsmall + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 778 |
@textarea-wi-mediumsmall-wide: ((@tcol-wi-mediumsmall + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 779 |
@textarea-wi-mediumsmall-wider: ((@tcol-wi-mediumsmall + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 780 |
@textarea-wi-mediumsmall-verywide: ((@tcol-wi-mediumsmall + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 781 |
|
|
| 782 |
@textarea-wi-normal-small: ((@tcol-wi-normal + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 783 |
@textarea-wi-normal-mediumsmall: ((@tcol-wi-normal + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 784 |
@textarea-wi-normal-normal: ((@tcol-wi-normal + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 785 |
@textarea-wi-normal-lightwide: ((@tcol-wi-normal + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 786 |
@textarea-wi-normal-wide: ((@tcol-wi-normal + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 787 |
@textarea-wi-normal-wider: ((@tcol-wi-normal + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 788 |
@textarea-wi-normal-verywide: ((@tcol-wi-normal + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 789 |
|
|
| 790 |
@textarea-wi-lightwide-small: ((@tcol-wi-lightwide + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 791 |
@textarea-wi-lightwide-mediumsmall: ((@tcol-wi-lightwide + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 792 |
@textarea-wi-lightwide-normal: ((@tcol-wi-lightwide + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 793 |
@textarea-wi-lightwide-lightwide: ((@tcol-wi-lightwide + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 794 |
@textarea-wi-lightwide-wide: ((@tcol-wi-lightwide + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 795 |
@textarea-wi-lightwide-wider: ((@tcol-wi-lightwide + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 796 |
@textarea-wi-lightwide-verywide: ((@tcol-wi-lightwide + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
| 797 |
|
|
| 798 |
@textarea-wi-wide-small: ((@tcol-wi-wide + @input-wi-small) - @diff-input-textarea-combined) ; |
|
| 799 |
@textarea-wi-wide-mediumsmall: ((@tcol-wi-wide + @input-wi-mediumsmall) - @diff-input-textarea-combined) ; |
|
| 800 |
@textarea-wi-wide-normal: ((@tcol-wi-wide + @input-wi-normal) - @diff-input-textarea-combined) ; |
|
| 801 |
@textarea-wi-wide-lightwide: ((@tcol-wi-wide + @input-wi-lightwide) - @diff-input-textarea-combined) ; |
|
| 802 |
@textarea-wi-wide-wide: ((@tcol-wi-wide + @input-wi-wide) - @diff-input-textarea-combined) ; |
|
| 803 |
@textarea-wi-wide-wider: ((@tcol-wi-wide + @input-wi-wider) - @diff-input-textarea-combined) ; |
|
| 804 |
@textarea-wi-wide-verywide: ((@tcol-wi-wide + @input-wi-verywide) - @diff-input-textarea-combined) ; |
|
Auch abrufbar als: Unified diff
HP Aenderungen bis Oktober 2018