Revision f97bb078
Von Hans P. Schlaepfer vor fast 4 Jahren hinzugefügt
| css/less/common-OUT.less | ||
|---|---|---|
| 1 |
// This file is not effacious. It is intended to delete it in the end. |
|
| 2 |
|
|
| 3 |
|
|
| 4 |
|
|
| 5 |
input.grow_on_focus {
|
|
| 6 |
width: 20px; |
|
| 7 |
transition: width 0.1s; |
|
| 8 |
-moz-transition: width 0.1s; |
|
| 9 |
-webkit-transition: width 0.1s; |
|
| 10 |
-o-transition: width 0.1s; |
|
| 11 |
|
|
| 12 |
&:focus { width: 150px }
|
|
| 13 |
|
|
| 14 |
} |
|
| 15 |
|
|
| 16 |
/* quirk to force certain constructs to block context */ |
|
| 17 |
.block-context { overflow: hidden }
|
|
| 18 |
|
|
| 19 |
|
|
| 20 |
/* various oneshot decoration for legacy purpose. dont use */ |
|
| 21 |
.small-text { font-size: @font-size-small; }
|
|
| 22 |
.bold { font-weight: bold ;}
|
|
| 23 |
|
|
| 24 |
.float-left { float: left; }
|
|
| 25 |
.float-right { float: right; }
|
|
| 26 |
|
|
| 27 |
|
|
| 28 |
/* position */ |
|
| 29 |
.position-relative { position: relative; }
|
|
| 30 |
.position-absolute { position: absolute; }
|
|
| 31 |
|
|
| 32 |
|
|
| css/less/custom_ tables.less | ||
|---|---|---|
| 1 |
// Benutzerdefinierte Tabellen-Angaben |
|
| 2 |
// Diese uebersteuern alle Anweisungen aus tables.less |
|
| 3 |
// Es dürfen nur Tabellen mit Zusatzklassen oder mit IDs uebersteuert werden. |
|
| 4 |
// Uebersteuern Sie nur wenige, bestehende Elemente, um ein einheitliches |
|
| 5 |
// Design zu gewaehrleisten |
|
| 6 |
// Diese Datei wird am Schluss von tables.less includiert. |
|
| 7 |
|
|
| 8 |
table{
|
|
| 9 |
|
|
| 10 |
// Zusatzklasse zur Tabelle (Beispiel) |
|
| 11 |
// Betreff: xyz |
|
| 12 |
// Autor: hanspeter.schlaepfer@revamp-it.ch |
|
| 13 |
&.meine-tabellen-klasse {
|
|
| 14 |
|
|
| 15 |
} |
|
| 16 |
|
|
| 17 |
// Tabelle mit spezieller ID (Beispiel) |
|
| 18 |
// Betreff: xyz |
|
| 19 |
// Autor: hanspeter.schlaepfer@revamp-it.ch |
|
| 20 |
&#meine-spezielle-tabelle {
|
|
| 21 |
|
|
| 22 |
} |
|
| 23 |
|
|
| 24 |
|
|
| 25 |
// Tabelle mit Konten-Uebersicht (Kontoplan) |
|
| 26 |
// Betreff: Kontoplan |
|
| 27 |
// Autor: hanspeter.schlaepfer@revamp-it.ch |
|
| 28 |
&#konten-plan {
|
|
| 29 |
tbody tr{
|
|
| 30 |
td:first-child {
|
|
| 31 |
text-align: right !important; |
|
| 32 |
} |
|
| 33 |
&.heading td {
|
|
| 34 |
font-size: @font-size-large; |
|
| 35 |
border-top: 1px #999 solid; |
|
| 36 |
} |
|
| 37 |
} |
|
| 38 |
tr:first-child {
|
|
| 39 |
&.heading td {
|
|
| 40 |
border: none; |
|
| 41 |
} |
|
| 42 |
} |
|
| 43 |
} |
|
| 44 |
|
|
| 45 |
|
|
| 46 |
// PENDENT: genauer anschauen |
|
| 47 |
|
|
| 48 |
&#eurtable {
|
|
| 49 |
border-collapse: collapse; |
|
| 50 |
width: 100%; |
|
| 51 |
} |
|
| 52 |
|
|
| 53 |
tr.category {
|
|
| 54 |
// background set via jquery |
|
| 55 |
} |
|
| 56 |
|
|
| 57 |
tr.chart {
|
|
| 58 |
border: 0; |
|
| 59 |
} |
|
| 60 |
|
|
| 61 |
td.chartname {
|
|
| 62 |
padding-left: 50px; |
|
| 63 |
} |
|
| 64 |
|
|
| 65 |
tr.chartrow {
|
|
| 66 |
font-size: 75%; |
|
| 67 |
} |
|
| 68 |
|
|
| 69 |
.guv_row_background {
|
|
| 70 |
background:#f0f0f0; |
|
| 71 |
} |
|
| 72 |
|
|
| 73 |
.tr_error {
|
|
| 74 |
background-color: #ffc9c9; |
|
| 75 |
} |
|
| 76 |
|
|
| 77 |
|
|
| 78 |
} |
|
| css/less/custom_variables.less | ||
|---|---|---|
| 1 |
// ---------------------------------------------------------------------------- |
|
| 2 |
// |
|
| 3 |
// CUSTOM VARIABLES (ONLY FOR OVERRIDES IN CUSTOM.LESS) |
|
| 4 |
// |
|
| 5 |
// ---------------------------------------------------------------------------- |
|
| 6 |
// DESCRIPTION: Place your custom variables here |
|
| 7 |
// For more information about variables see variables.less |
|
| 8 |
// Copy variables from variable.less into this files here |
|
| 9 |
// Do not change variables and less stuff in the original source files |
|
| 10 |
// then you will be happy with your git work |
|
| 11 |
// |
|
| 12 |
// CONTENTS: |
|
| 13 |
// - SUBJECT |
|
| 14 |
// - - My override variables |
|
| 15 |
// - - My own variables |
|
| 16 |
// ---------------------------------------------------------------------------- |
|
| 17 |
|
|
| 18 |
|
|
| 19 |
// |
|
| 20 |
// ********************************** |
|
| 21 |
// MY OVERRIDE VARIABLES |
|
| 22 |
// ********************************** |
|
| 23 |
|
|
| 24 |
|
|
| 25 |
|
|
| 26 |
|
|
| 27 |
|
|
| 28 |
|
|
| 29 |
// |
|
| 30 |
// ********************************** |
|
| 31 |
// MY SPECIAL VARIABLES |
|
| 32 |
// ********************************** |
|
| 33 |
|
|
| 34 |
//@my-class-padding: 0.2em ; // just an example |
|
| css/less/jquery.tooltipster-light.less | ||
|---|---|---|
| 1 |
.tooltipster-light {
|
|
| 2 |
border-radius: 5px; |
|
| 3 |
border: 1px solid #7D964D; |
|
| 4 |
background-color: #3C72A7; //#DDFE93 |
|
| 5 |
color: #fff; |
|
| 6 |
} |
|
| 7 |
.tooltipster-light .tooltipster-content {
|
|
| 8 |
font-size: @font-size-smaller; |
|
| 9 |
line-height: 16px; |
|
| 10 |
padding: 1.0em 1.4em; |
|
| 11 |
} |
|
| css/less/js.charpicker.less | ||
|---|---|---|
| 1 |
|
|
| 2 |
/* Chart-Picker */ |
|
| 3 |
/* Entnommen aus main.less, gehoert z.T. auch zu Jquery.Autocomplete */ |
|
| 4 |
|
|
| 5 |
|
|
| 6 |
|
|
| 7 |
.chart_picker, |
|
| 8 |
.part_picker {
|
|
| 9 |
display: inline-block; |
|
| 10 |
} |
|
| 11 |
.chart_picker:before, |
|
| 12 |
.part_picker:before {
|
|
| 13 |
display: inline-block; |
|
| 14 |
vertical-align: middle; |
|
| 15 |
height: 100%; |
|
| 16 |
} |
|
| 17 |
.customer-vendor-picker-undefined, |
|
| 18 |
.chartpicker-undefined, |
|
| 19 |
.projectpicker-undefined, |
|
| 20 |
.partpicker-undefined {
|
|
| 21 |
color: red; |
|
| 22 |
font-style: italic; |
|
| 23 |
} |
|
| 24 |
|
|
| 25 |
div.part_picker_part, |
|
| 26 |
div.chart_picker_chart {
|
|
| 27 |
padding: 5px; |
|
| 28 |
margin: 5px; |
|
| 29 |
border: 1px; |
|
| 30 |
border-color: darkgray; |
|
| 31 |
border-style: solid; |
|
| 32 |
-webkit-border-radius: 4px; |
|
| 33 |
-moz-border-radius: 4px; |
|
| 34 |
border-radius: 4px; |
|
| 35 |
background-color: white; |
|
| 36 |
cursor: pointer; |
|
| 37 |
} |
|
| 38 |
div.part_picker_part:hover, |
|
| 39 |
div.chart_picker_chart:hover {
|
|
| 40 |
color: #000; |
|
| 41 |
text-decoration: underline; |
|
| 42 |
} |
|
| 43 |
|
|
| 44 |
|
|
| 45 |
|
|
| 46 |
div.cpc_block, |
|
| 47 |
div.ppp_block {
|
|
| 48 |
overflow:hidden; |
|
| 49 |
float:left; |
|
| 50 |
width: 350px; |
|
| 51 |
} |
|
| 52 |
span.cpc_popup_button, |
|
| 53 |
span.ppp_popup_button {
|
|
| 54 |
display: inline-block; |
|
| 55 |
vertical-align: middle; |
|
| 56 |
margin-left: -24px; |
|
| 57 |
height: 20px; |
|
| 58 |
width: 20px; |
|
| 59 |
cursor: pointer; |
|
| 60 |
background: url("../../image/search.svg") no-repeat center right;
|
|
| 61 |
background-size: contain; |
|
| 62 |
} |
|
| 63 |
span.chart_picker input, |
|
| 64 |
span.part_picker input {
|
|
| 65 |
padding-right: 20px; |
|
| 66 |
box-sizing: border-box; |
|
| 67 |
-moz-box-sizing: border-box; |
|
| 68 |
-webkit-box-sizing: border-box; |
|
| 69 |
} |
|
| 70 |
span.chart_picker, |
|
| 71 |
span.part_picker {
|
|
| 72 |
white-space: nowrap; |
|
| 73 |
} |
|
| 74 |
div.ppp_block span.ppp_block_number, |
|
| 75 |
div.cpc_block span.cpc_block_number |
|
| 76 |
{
|
|
| 77 |
float:left; |
|
| 78 |
} |
|
| 79 |
div.ppp_block span.ppp_block_description {
|
|
| 80 |
float:right; |
|
| 81 |
margin-left:1em; |
|
| 82 |
font-weight:bold; |
|
| 83 |
} |
|
| 84 |
div.cpc_block span.cpc_block_description {
|
|
| 85 |
float:left; |
|
| 86 |
margin-left:1em; |
|
| 87 |
font-weight:bold; |
|
| 88 |
} |
|
| 89 |
div.ppp_line span.ppp_block_description, |
|
| 90 |
div.cpc_line span.cpc_block_description |
|
| 91 |
{
|
|
| 92 |
margin-left:1em; |
|
| 93 |
font-weight:bold; |
|
| 94 |
} |
|
| 95 |
div.cpc_block span.cpc_block_balance {
|
|
| 96 |
float:right; |
|
| 97 |
} |
|
| 98 |
div.cpc_block span.cpc_line_balance {
|
|
| 99 |
display:none; |
|
| 100 |
} |
|
| 101 |
div.cpc_line span.cpc_block_second_row {
|
|
| 102 |
display:none; |
|
| 103 |
} |
|
| 104 |
div.cpc_block span.cpc_block_second_row {
|
|
| 105 |
} |
|
| 106 |
|
|
| 107 |
|
|
| 108 |
|
|
| css/less/main-OUT.less | ||
|---|---|---|
| 1 |
// This file is not effacious. It is intended to delete it in the end. |
|
| 2 |
// Nicht gefundene CSS-Klassen und IDs |
|
| 3 |
|
|
| 4 |
|
|
| 5 |
// OBSOLETE: gibt es nicht |
|
| 6 |
body.admin > h1{
|
|
| 7 |
top: 21px; |
|
| 8 |
} |
|
| 9 |
|
|
| 10 |
// PENDENT: obsolete? |
|
| 11 |
body.menu {
|
|
| 12 |
color: #000000; |
|
| 13 |
} |
|
| 14 |
|
|
| 15 |
|
|
| 16 |
|
|
| 17 |
// PENDENT: welche Selektoren??? |
|
| 18 |
.accountlistheading {
|
|
| 19 |
padding: 0.3em; |
|
| 20 |
color: #006400; |
|
| 21 |
font-weight: bold; |
|
| 22 |
text-align: left; |
|
| 23 |
background-color: #EBEBEB; |
|
| 24 |
} |
|
| 25 |
|
|
| 26 |
|
|
| 27 |
.link_separator {
|
|
| 28 |
margin-left: 6px; |
|
| 29 |
margin-right: 6px; |
|
| 30 |
} |
|
| 31 |
|
|
| 32 |
span.toggle_selected {
|
|
| 33 |
font-weight: bold; |
|
| 34 |
} |
|
| 35 |
|
|
| 36 |
|
|
| 37 |
// Infos ueber Suchergebnissen |
|
| 38 |
div.info{
|
|
| 39 |
padding: 1.0em; |
|
| 40 |
span.info-detail{
|
|
| 41 |
margin: 0 5.0em 0 0; |
|
| 42 |
} |
|
| 43 |
} |
|
| css/less/style_number_1.less | ||
|---|---|---|
| 1 |
// ---------------------------------------------------------------------------- |
|
| 2 |
// |
|
| 3 |
// VARIABLES COLOR SCHEME 1 (BLUE) |
|
| 4 |
// |
|
| 5 |
// ---------------------------------------------------------------------------- |
|
| 6 |
// DESCRIPTION: |
|
| 7 |
// |
|
| 8 |
// CONTENTS: |
|
| 9 |
// - BASE COLORS |
|
| 10 |
// - Greys |
|
| 11 |
// - Branding |
|
| 12 |
// - Divers Color Specifications |
|
| 13 |
// - TYPOGRAPHY |
|
| 14 |
// - Font family |
|
| 15 |
// - Font size |
|
| 16 |
// - Line height |
|
| 17 |
// - Heading 1 - 6 |
|
| 18 |
// - Heading 1 (H1) |
|
| 19 |
// ---------------------------------------------------------------------------- |
|
| 20 |
|
|
| 21 |
|
|
| 22 |
|
|
| 23 |
// -------------------------------------- |
|
| 24 |
// BASE COLORS |
|
| 25 |
// -------------------------------------- |
|
| 26 |
// Original Kivitendo Colors |
|
| 27 |
// -------------- |
|
| 28 |
// Background: #EBEBEB burlywood |
|
| 29 |
// Links: #006400 DarkGreen |
|
| 30 |
// Link-hover #FE5F14 Orange / #FFFFE0 lightyellow |
|
| 31 |
// Titles, BG/VG: #79B61B Mid-green FFFFFF White |
|
| 32 |
// Tabcolor: #CAFFA3 |
|
| 33 |
|
|
| 34 |
// -------------- |
|
| 35 |
// Grey shades |
|
| 36 |
@gray-darker: #222222 ; |
|
| 37 |
@gray-dark: #555555 ; |
|
| 38 |
@gray-mediumdark: #666666 ; |
|
| 39 |
@gray: #888888 ; |
|
| 40 |
@gray-medium: #aaaaaa ; |
|
| 41 |
@gray-light: #cfcfcf ; |
|
| 42 |
@gray-lighter: #dedede ; |
|
| 43 |
@gray-morelighter: #e0e0e0 ; |
|
| 44 |
@gray-verylight: #ececec ; |
|
| 45 |
@gray-superlight: #efefef ; |
|
| 46 |
|
|
| 47 |
// -------------- |
|
| 48 |
// Color Specications |
|
| 49 |
// for message and other coloured stuff |
|
| 50 |
// ok |
|
| 51 |
@color-green-strong: #003c18; |
|
| 52 |
@color-green-light: #9ccb21; |
|
| 53 |
// error |
|
| 54 |
@color-red-strong: #ae0014; |
|
| 55 |
@color-red-light: #ffd6d6; |
|
| 56 |
// info/hint |
|
| 57 |
@color-blue-strong: #209ec8; |
|
| 58 |
@color-blue-light: #b6e6e5; |
|
| 59 |
// warning |
|
| 60 |
@color-orange-strong: #8D6A00; // more brown |
|
| 61 |
@color-orange-light: #f6d972; |
|
| 62 |
// divers |
|
| 63 |
@rainbow-green: #408000; |
|
| 64 |
@rainbow-blue: #0080FF; |
|
| 65 |
@rainbow-red: #FF0000; |
|
| 66 |
@rainbow-yellow: #FFFF00; |
|
| 67 |
|
|
| 68 |
// -------------- |
|
| 69 |
// Brand colors |
|
| 70 |
@brand-standard: #186484 ; // Standard color |
|
| 71 |
|
|
| 72 |
@brand-strong: @brand-standard ; // Strong brand color (for text) |
|
| 73 |
@brand-strong-dimmed: #3E869E ; // Standard light color for backgrounds |
|
| 74 |
@brand-strong-dimmed-hover: #3F92AD ; // Standard lighter color for backgrounds |
|
| 75 |
@brand-light: #82B2D0 ; // Standard lighter color for text in backgrounded blocks |
|
| 76 |
@brand-lighter: #B0D0E5 ; // |
|
| 77 |
@brand-verylight: #E1ECF4 ; // |
|
| 78 |
@brand-superlight: #E8F3FA ; // |
|
| 79 |
@brand-darkest: #124C60 ; // Standard darkest color (for borders etc.) |
|
| 80 |
@brand-text-color: #666666 ; // |
|
| 81 |
|
|
| 82 |
@brand-table-text-color: @brand-darkest ; // |
|
| 83 |
@brand-heading-color: @brand-darkest ; // Standard heading color |
|
| 84 |
@brand-heading-bg: @brand-strong-dimmed-hover ; // |
|
| 85 |
@brand-h1-color: @brand-lighter ; // |
|
| 86 |
@brand-h1-bg: @brand-strong-dimmed-hover ; // |
|
| 87 |
@brand-data-color: @brand-standard ; // |
|
| 88 |
@brand-data-label-color: @brand-strong ; // Standard-Label color |
|
| 89 |
@brand-text-color-accent: @brand-standard ; // |
|
| 90 |
@brand-link-color: @brand-strong-dimmed ; // |
|
| 91 |
@brand-link-color-hover: @brand-strong-dimmed-hover ; // |
|
| 92 |
|
|
| 93 |
|
|
| 94 |
|
|
| 95 |
// Text (Label & data) |
|
| 96 |
@brand-primary: @brand-text-color; |
|
| 97 |
@brand-label: @brand-data-label-color; |
|
| 98 |
@brand-label-bg: @brand-lighter; |
|
| css/less/variables_color.less | ||
|---|---|---|
| 1 |
// ---------------------------------------------------------------------------- |
|
| 2 |
// |
|
| 3 |
// VARIABLES (Less-Style) for general use (most of it is Bootstrap-Stuff) |
|
| 4 |
// |
|
| 5 |
// ---------------------------------------------------------------------------- |
|
| 6 |
// DESCRIPTION: |
|
| 7 |
// |
|
| 8 |
// CONTENTS: |
|
| 9 |
// - BASE COLORS |
|
| 10 |
// - Greys |
|
| 11 |
// - Branding |
|
| 12 |
// - Divers Color Specifications |
|
| 13 |
// - TYPOGRAPHY |
|
| 14 |
// - Font family |
|
| 15 |
// - Font size |
|
| 16 |
// - Line height |
|
| 17 |
// - Heading 1 - 6 |
|
| 18 |
// - Heading 1 (H1) |
|
| 19 |
// ---------------------------------------------------------------------------- |
|
| 20 |
|
|
| 21 |
|
|
| 22 |
|
|
| 23 |
// -------------------------------------- |
|
| 24 |
// BASE COLORS |
|
| 25 |
// -------------------------------------- |
|
| 26 |
// Original Kivitendo Colors |
|
| 27 |
// -------------- |
|
| 28 |
// Background: #EBEBEB burlywood |
|
| 29 |
// Links: #006400 DarkGreen |
|
| 30 |
// Link-hover #FE5F14 Orange / #FFFFE0 lightyellow |
|
| 31 |
// Titles, BG/VG: #79B61B Mid-green FFFFFF White |
|
| 32 |
// Tabcolor: #CAFFA3 |
|
| 33 |
|
|
| 34 |
// -------------- |
|
| 35 |
// Grey shades |
|
| 36 |
@gray-darker: #222222 ; |
|
| 37 |
@gray-dark: #555555 ; |
|
| 38 |
@gray-mediumdark: #666666 ; |
|
| 39 |
@gray: #888888 ; |
|
| 40 |
@gray-medium: #aaaaaa ; |
|
| 41 |
@gray-light: #cfcfcf ; |
|
| 42 |
@gray-lighter: #dedede ; |
|
| 43 |
@gray-morelighter: #e0e0e0 ; |
|
| 44 |
@gray-verylight: #ececec ; |
|
| 45 |
@gray-superlight: #efefef ; |
|
| 46 |
|
|
| 47 |
// -------------- |
|
| 48 |
// Color Specications |
|
| 49 |
// for message and other coloured stuff |
|
| 50 |
// ok |
|
| 51 |
@color-green-strong: #003c18; |
|
| 52 |
@color-green-light: #9ccb21; |
|
| 53 |
// error |
|
| 54 |
@color-red-strong: #ae0014; |
|
| 55 |
@color-red-light: #ffd6d6; |
|
| 56 |
// info/hint |
|
| 57 |
@color-blue-strong: #209ec8; |
|
| 58 |
@color-blue-light: #b6e6e5; |
|
| 59 |
// warning |
|
| 60 |
@color-orange-strong: #8D6A00; // more brown |
|
| 61 |
@color-orange-light: #f6d972; |
|
| 62 |
// divers |
|
| 63 |
@rainbow-green: #408000; |
|
| 64 |
@rainbow-blue: #0080FF; |
|
| 65 |
@rainbow-red: #FF0000; |
|
| 66 |
@rainbow-yellow: #FFFF00; |
|
| 67 |
|
|
| 68 |
// -------------- |
|
| 69 |
// Brand colors |
|
| 70 |
@brand-standard: #888888 ; // Standard color |
|
| 71 |
|
|
| 72 |
@brand-strong: @gray ; // Strong brand color (for text) |
|
| 73 |
@brand-strong-dimmed: #666666 ; // Standard light color for backgrounds |
|
| 74 |
@brand-strong-dimmed-hover: #666666 ; // Standard lighter color for backgrounds |
|
| 75 |
@brand-light: @gray-light ; // Standard lighter color for text in backgrounded blocks |
|
| 76 |
@brand-lighter: @gray-lighter ; // |
|
| 77 |
@brand-verylight: @gray-verylight ; // |
|
| 78 |
@brand-superlight: @gray-superlight ; // |
|
| 79 |
@brand-darkest: #222222 ; // Standard darkest color (for borders etc.) |
|
| 80 |
@brand-text-color: #666666 ; // |
|
| 81 |
|
|
| 82 |
@brand-table-text-color: @brand-darkest ; // |
|
| 83 |
@brand-heading-color: @brand-darkest ; // Standard heading color |
|
| 84 |
@brand-heading-bg: @brand-strong-dimmed-hover ; // |
|
| 85 |
@brand-h1-color: @brand-lighter ; // |
|
| 86 |
@brand-h1-bg: @brand-strong-dimmed-hover ; // |
|
| 87 |
@brand-data-color: @brand-standard ; // |
|
| 88 |
@brand-data-label-color: @brand-strong ; // Standard-Label color |
|
| 89 |
@brand-text-color-accent: @brand-standard ; // |
|
| 90 |
@brand-link-color: @brand-strong-dimmed ; // |
|
| 91 |
@brand-link-color-hover: @brand-strong-dimmed-hover ; // |
|
| 92 |
|
|
| 93 |
|
|
| 94 |
|
|
| 95 |
// Text (Label & data) |
|
| 96 |
@brand-primary: @brand-text-color; |
|
| 97 |
@brand-label: @brand-data-label-color; |
|
| 98 |
@brand-label-bg: @brand-lighter; |
|
| 99 |
|
|
| 100 |
|
|
| 101 |
// -------------- |
|
| 102 |
// Buttons |
|
| 103 |
// |
|
| 104 |
|
|
| 105 |
// Button with manipulation (submit etc.) |
|
| 106 |
@button-strong: @brand-lighter; |
|
| 107 |
@button-strong-bg: @brand-strong; |
|
| 108 |
@button-strong-border: @brand-darkest; |
|
| 109 |
@button-strong-hover: @brand-lighter; |
|
| 110 |
@button-strong-hover-bg: @brand-strong-dimmed-hover; |
|
| 111 |
@button-strong-hover-border: @brand-darkest; |
|
| 112 |
@button-strong-active: @brand-lighter; |
|
| 113 |
@button-strong-active-bg: @brand-strong-dimmed; |
|
| 114 |
@button-strong-active-border: @brand-darkest; |
|
| 115 |
// Button without data manipulation (reset, cancel, open, show etc.) |
|
| 116 |
@button-soft: @brand-strong; |
|
| 117 |
@button-soft-bg: @brand-light; |
|
| 118 |
@button-soft-border: @brand-darkest; |
|
| 119 |
@button-soft-hover: @brand-strong; |
|
| 120 |
@button-soft-hover-bg: @brand-lighter; |
|
| 121 |
@button-soft-hover-border: @brand-darkest; |
|
| 122 |
@button-soft-active: @brand-darkest; |
|
| 123 |
@button-soft-active-bg: @brand-strong-dimmed; |
|
| 124 |
@button-soft-active-border: @brand-darkest; |
|
| 125 |
|
|
| 126 |
|
|
| 127 |
// -------------------------------------- |
|
| 128 |
// SCAFFOLDING |
|
| 129 |
// -------------------------------------- |
|
| 130 |
@body-bg: @brand-verylight; // general |
|
| 131 |
@content-bg: @brand-superlight; // background first tabs |
|
| 132 |
@heading-bg: @brand-lighter ; // controlpanels & other stuff |
|
| 133 |
|
|
| 134 |
// Tabs |
|
| 135 |
@tabs-bg: @brand-verylight; // background tabs panel (data/content) |
|
| 136 |
@tabs-bg-hover: @brand-superlight; // background tabs panel (data/content) |
|
| 137 |
@tabs-bg-hover-active: @tabs-bg; // background tabs panel (data/content) |
|
| 138 |
@tabs-text-hover: @brand-strong; // background tabs panel (data/content) |
|
| 139 |
|
|
| 140 |
|
|
| 141 |
@text-color: @brand-primary; |
|
| 142 |
@heading-color: @brand-heading-color ; // labels & table headings |
|
| 143 |
@caption-color: @brand-heading-color ; // caption |
|
| 144 |
|
|
| 145 |
|
|
| 146 |
// Table list zebra effect |
|
| 147 |
// Zebra effect in list tables |
|
| 148 |
@t-row-zebra-bg-odd: @brand-lighter; |
|
| 149 |
@t-row-zebra-bg-even: @brand-verylight; |
|
| 150 |
@t-row-zebra-bg-hover: #ffffff; |
|
| 151 |
|
|
| 152 |
@t-row-zebra-bg-error: @brand-error-bg; |
|
| 153 |
@t-row-zebra-bg-special: #FEF2C5; // PENDENT: ANSCHAUEN |
|
| 154 |
@t-row-zebra-bg-highlight: #B4F4FE; // PENDENT: ANSCHAUEN |
|
| css/less/variables_color_1.less | ||
|---|---|---|
| 1 |
// ---------------------------------------------------------------------------- |
|
| 2 |
// |
|
| 3 |
// VARIABLES (Less-Style) for general use (most of it is Bootstrap-Stuff) |
|
| 4 |
// |
|
| 5 |
// ---------------------------------------------------------------------------- |
|
| 6 |
// DESCRIPTION: |
|
| 7 |
// |
|
| 8 |
// CONTENTS: |
|
| 9 |
// - BASE COLORS |
|
| 10 |
// - Greys |
|
| 11 |
// - Branding |
|
| 12 |
// - Divers Color Specifications |
|
| 13 |
// - TYPOGRAPHY |
|
| 14 |
// - Font family |
|
| 15 |
// - Font size |
|
| 16 |
// - Line height |
|
| 17 |
// - Heading 1 - 6 |
|
| 18 |
// - Heading 1 (H1) |
|
| 19 |
// ---------------------------------------------------------------------------- |
|
| 20 |
|
|
| 21 |
|
|
| 22 |
|
|
| 23 |
// -------------------------------------- |
|
| 24 |
// BASE COLORS |
|
| 25 |
// -------------------------------------- |
|
| 26 |
// Original Kivitendo Colors |
|
| 27 |
// -------------- |
|
| 28 |
// Background: #EBEBEB burlywood |
|
| 29 |
// Links: #006400 DarkGreen |
|
| 30 |
// Link-hover #FE5F14 Orange / #FFFFE0 lightyellow |
|
| 31 |
// Titles, BG/VG: #79B61B Mid-green FFFFFF White |
|
| 32 |
// Tabcolor: #CAFFA3 |
|
| 33 |
|
|
| 34 |
// -------------- |
|
| 35 |
// Grey shades |
|
| 36 |
@gray-darker: #222222 ; |
|
| 37 |
@gray-dark: #555555 ; |
|
| 38 |
@gray-mediumdark: #666666 ; |
|
| 39 |
@gray: #888888 ; |
|
| 40 |
@gray-medium: #aaaaaa ; |
|
| 41 |
@gray-light: #cfcfcf ; |
|
| 42 |
@gray-lighter: #dedede ; |
|
| 43 |
@gray-morelighter: #e0e0e0 ; |
|
| 44 |
@gray-verylight: #ececec ; |
|
| 45 |
@gray-superlight: #efefef ; |
|
| 46 |
|
|
| 47 |
// -------------- |
|
| 48 |
// Color Specications |
|
| 49 |
// for message and other coloured stuff |
|
| 50 |
// ok |
|
| 51 |
@color-green-strong: #003c18; |
|
| 52 |
@color-green-light: #9ccb21; |
|
| 53 |
// error |
|
| 54 |
@color-red-strong: #ae0014; |
|
| 55 |
@color-red-light: #ffd6d6; |
|
| 56 |
// info/hint |
|
| 57 |
@color-blue-strong: #209ec8; |
|
| 58 |
@color-blue-light: #b6e6e5; |
|
| 59 |
// warning |
|
| 60 |
@color-orange-strong: #8D6A00; // more brown |
|
| 61 |
@color-orange-light: #f6d972; |
|
| 62 |
// divers |
|
| 63 |
@rainbow-green: #408000; |
|
| 64 |
@rainbow-blue: #0080FF; |
|
| 65 |
@rainbow-red: #FF0000; |
|
| 66 |
@rainbow-yellow: #FFFF00; |
|
| 67 |
|
|
| 68 |
// -------------- |
|
| 69 |
// Brand colors |
|
| 70 |
@brand-standard: #186484 ; // Standard color |
|
| 71 |
|
|
| 72 |
@brand-strong: @brand-standard ; // Strong brand color (for text) |
|
| 73 |
@brand-strong-dimmed: #3E869E ; // Standard light color for backgrounds |
|
| 74 |
@brand-strong-dimmed-hover: #3F92AD ; // Standard lighter color for backgrounds |
|
| 75 |
@brand-light: #82B2D0 ; // Standard lighter color for text in backgrounded blocks |
|
| 76 |
@brand-lighter: #B0D0E5 ; // |
|
| 77 |
@brand-verylight: #E1ECF4 ; // |
|
| 78 |
@brand-superlight: #E8F3FA ; // |
|
| 79 |
@brand-darkest: #124C60 ; // Standard darkest color (for borders etc.) |
|
| 80 |
@brand-text-color: #666666 ; // |
|
| 81 |
|
|
| 82 |
@brand-table-text-color: @brand-darkest ; // |
|
| 83 |
@brand-heading-color: @brand-darkest ; // Standard heading color |
|
| 84 |
@brand-heading-bg: @brand-strong-dimmed-hover ; // |
|
| 85 |
@brand-h1-color: @brand-lighter ; // |
|
| 86 |
@brand-h1-bg: @brand-strong-dimmed-hover ; // |
|
| 87 |
@brand-data-color: @brand-standard ; // |
|
| 88 |
@brand-data-label-color: @brand-strong ; // Standard-Label color |
|
| 89 |
@brand-text-color-accent: @brand-standard ; // |
|
| 90 |
@brand-link-color: @brand-strong-dimmed ; // |
|
| 91 |
@brand-link-color-hover: @brand-strong-dimmed-hover ; // |
|
| 92 |
|
|
| 93 |
|
|
| 94 |
|
|
| 95 |
// Text (Label & data) |
|
| 96 |
@brand-primary: @brand-text-color; |
|
| 97 |
@brand-label: @brand-data-label-color; |
|
| 98 |
@brand-label-bg: @brand-lighter; |
|
| 99 |
|
|
| 100 |
// -------------- |
|
| 101 |
// Buttons |
|
| 102 |
// |
|
| 103 |
|
|
| 104 |
// Button with manipulation (submit etc.) |
|
| 105 |
@button-strong: @brand-lighter; |
|
| 106 |
@button-strong-bg: @brand-strong; |
|
| 107 |
@button-strong-border: @brand-darkest; |
|
| 108 |
@button-strong-hover: @brand-lighter; |
|
| 109 |
@button-strong-hover-bg: @brand-strong-dimmed-hover; |
|
| 110 |
@button-strong-hover-border: @brand-darkest; |
|
| 111 |
@button-strong-active: @brand-lighter; |
|
| 112 |
@button-strong-active-bg: @brand-strong-dimmed; |
|
| 113 |
@button-strong-active-border: @brand-darkest; |
|
| 114 |
// Button without data manipulation (reset, cancel, open, show etc.) |
|
| 115 |
@button-soft: @brand-strong; |
|
| 116 |
@button-soft-bg: @brand-light; |
|
| 117 |
@button-soft-border: @brand-darkest; |
|
| 118 |
@button-soft-hover: @brand-strong; |
|
| 119 |
@button-soft-hover-bg: @brand-lighter; |
|
| 120 |
@button-soft-hover-border: @brand-darkest; |
|
| 121 |
@button-soft-active: @brand-darkest; |
|
| 122 |
@button-soft-active-bg: @brand-strong-dimmed; |
|
| 123 |
@button-soft-active-border: @brand-darkest; |
|
| 124 |
|
|
| 125 |
// -------------------------------------- |
|
| 126 |
// SCAFFOLDING |
|
| 127 |
// -------------------------------------- |
|
| 128 |
@body-bg: @brand-verylight; // general |
|
| 129 |
@content-bg: #ffffff; // background first tabs |
|
| 130 |
@heading-bg: @brand-lighter ; // controlpanels & other stuff |
|
| 131 |
|
|
| 132 |
// Tabs |
|
| 133 |
@tabs-bg: @brand-verylight; // background tabs panel (data/content) |
|
| 134 |
@tabs-bg-hover: @brand-superlight; // background tabs panel (data/content) |
|
| 135 |
@tabs-bg-hover-active: @tabs-bg; // background tabs panel (data/content) |
|
| 136 |
@tabs-text-hover: @brand-strong; // background tabs panel (data/content) |
|
| 137 |
|
|
| 138 |
|
|
| 139 |
|
|
| 140 |
|
|
| 141 |
@text-color: @brand-primary; |
|
| 142 |
@heading-color: @brand-heading-color ; // labels & table headings |
|
| 143 |
@caption-color: @brand-heading-color ; // caption |
|
| css/less/variables_color_2.less | ||
|---|---|---|
| 1 |
// ---------------------------------------------------------------------------- |
|
| 2 |
// |
|
| 3 |
// VARIABLES (Less-Style) for general use (most of it is Bootstrap-Stuff) |
|
| 4 |
// |
|
| 5 |
// ---------------------------------------------------------------------------- |
|
| 6 |
// DESCRIPTION: |
|
| 7 |
// |
|
| 8 |
// CONTENTS: |
|
| 9 |
// - BASE COLORS |
|
| 10 |
// - Greys |
|
| 11 |
// - Branding |
|
| 12 |
// - Divers Color Specifications |
|
| 13 |
// - TYPOGRAPHY |
|
| 14 |
// - Font family |
|
| 15 |
// - Font size |
|
| 16 |
// - Line height |
|
| 17 |
// - Heading 1 - 6 |
|
| 18 |
// - Heading 1 (H1) |
|
| 19 |
// ---------------------------------------------------------------------------- |
|
| 20 |
|
|
| 21 |
|
|
| 22 |
|
|
| 23 |
// -------------------------------------- |
|
| 24 |
// BASE COLORS |
|
| 25 |
// -------------------------------------- |
|
| 26 |
// Original Kivitendo Colors |
|
| 27 |
// -------------- |
|
| 28 |
// Background: #EBEBEB burlywood |
|
| 29 |
// Links: #006400 DarkGreen |
|
| 30 |
// Link-hover #FE5F14 Orange / #FFFFE0 lightyellow |
|
| 31 |
// Titles, BG/VG: #79B61B Mid-green FFFFFF White |
|
| 32 |
// Tabcolor: #CAFFA3 |
|
| 33 |
|
|
| 34 |
// -------------- |
|
| 35 |
// Grey shades |
|
| 36 |
@gray-darker: #222222 ; |
|
| 37 |
@gray-dark: #555555 ; |
|
| 38 |
@gray-mediumdark: #666666 ; |
|
| 39 |
@gray: #888888 ; |
|
| 40 |
@gray-medium: #aaaaaa ; |
|
| 41 |
@gray-light: #cfcfcf ; |
|
| 42 |
@gray-lighter: #dedede ; |
|
| 43 |
@gray-morelighter: #e0e0e0 ; |
|
| 44 |
@gray-verylight: #ececec ; |
|
| 45 |
@gray-superlight: #efefef ; |
|
| 46 |
|
|
| 47 |
// -------------- |
|
| 48 |
// Color Specications |
|
| 49 |
// for message and other coloured stuff |
|
| 50 |
// ok |
|
| 51 |
@color-green-strong: #003c18; |
|
| 52 |
@color-green-light: #9ccb21; |
|
| 53 |
// error |
|
| 54 |
@color-red-strong: #ae0014; |
|
| 55 |
@color-red-light: #ffd6d6; |
|
| 56 |
// info/hint |
|
| 57 |
@color-blue-strong: #209ec8; |
|
| 58 |
@color-blue-light: #b6e6e5; |
|
| 59 |
// warning |
|
| 60 |
@color-orange-strong: #8D6A00; // more brown |
|
| 61 |
@color-orange-light: #f6d972; |
|
| 62 |
// divers |
|
| 63 |
@rainbow-green: #408000; |
|
| 64 |
@rainbow-blue: #0080FF; |
|
| 65 |
@rainbow-red: #FF0000; |
|
| 66 |
@rainbow-yellow: #FFFF00; |
|
| 67 |
|
|
| 68 |
// -------------- |
|
| 69 |
// Brand colors |
|
| 70 |
@brand-standard: hsl( 128, 60%, 44%) ; // Standard color |
|
| 71 |
//@brand-standard: hsl( 6, 79%, 40%) ; // Standard color |
|
| 72 |
//@brand-standard: hsl(211, 12%, 0%); // Standard color |
|
| 73 |
|
|
| 74 |
@brand-strong: @brand-standard ; // Strong brand color (for text) |
|
| 75 |
@brand-strong-dimmed: lighten( @brand-strong , 10% ) ; |
|
| 76 |
@brand-strong-dimmed-hover: lighten( @brand-strong , 20% ) ; |
|
| 77 |
@brand-darkest: darken( @brand-strong , 30% ) ; |
|
| 78 |
|
|
| 79 |
@brand-text-color: darken( @brand-strong , 50% ) ; |
|
| 80 |
|
|
| 81 |
@brand-light: lighten( @brand-strong , 30% ) ; |
|
| 82 |
@brand-lighter: lighten( @brand-strong , 40% ) ; |
|
| 83 |
@brand-verylight: lighten( @brand-strong , 50% ) ; |
|
| 84 |
@brand-superlight: lighten( @brand-strong , 60% ) ; |
|
| 85 |
@brand-superverylight: lighten( @brand-strong , 70% ) ; |
|
| 86 |
|
|
| 87 |
|
|
| 88 |
@brand-table-text-color: @brand-darkest ; // |
|
| 89 |
@brand-heading-color: @brand-darkest ; // Standard heading color |
|
| 90 |
@brand-heading-bg: @brand-strong-dimmed-hover ; // |
|
| 91 |
@brand-h1-color: @brand-lighter ; // |
|
| 92 |
@brand-h1-bg: @brand-strong ; // |
|
| 93 |
@brand-data-color: @brand-standard ; // |
|
| 94 |
@brand-data-label-color: @brand-strong ; // Standard-Label color |
|
| 95 |
@brand-text-color-accent: @brand-standard ; // |
|
| 96 |
@brand-link-color: @brand-strong-dimmed ; // |
|
| 97 |
@brand-link-color-hover: @brand-strong-dimmed-hover ; |
|
| 98 |
|
|
| 99 |
// Text (Label & data) |
|
| 100 |
@brand-primary: @brand-text-color; |
|
| 101 |
@brand-label: @brand-data-label-color; |
|
| 102 |
@brand-label-bg: @brand-lighter; |
|
| 103 |
|
|
| 104 |
// -------------- |
|
| 105 |
// Buttons |
|
| 106 |
// |
|
| 107 |
// Button with manipulation (submit etc.) |
|
| 108 |
@button-strong: @brand-lighter; |
|
| 109 |
@button-strong-bg: @brand-strong; |
|
| 110 |
@button-strong-border: @brand-darkest; |
|
| 111 |
@button-strong-hover: @brand-lighter; |
|
| 112 |
@button-strong-hover-bg: @brand-strong-dimmed-hover; |
|
| 113 |
@button-strong-hover-border: @brand-darkest; |
|
| 114 |
@button-strong-active: @brand-lighter; |
|
| 115 |
@button-strong-active-bg: @brand-strong-dimmed; |
|
| 116 |
@button-strong-active-border: @brand-darkest; |
|
| 117 |
// Button without data manipulation (reset, cancel, open, show etc.) |
|
| 118 |
@button-soft: @brand-strong; |
|
| 119 |
@button-soft-bg: @brand-light; |
|
| 120 |
@button-soft-border: @brand-darkest; |
|
| 121 |
@button-soft-hover: @brand-strong; |
|
| 122 |
@button-soft-hover-bg: @brand-lighter; |
|
| 123 |
@button-soft-hover-border: @brand-darkest; |
|
| 124 |
@button-soft-active: @brand-darkest; |
|
| 125 |
@button-soft-active-bg: @brand-strong-dimmed; |
|
| 126 |
@button-soft-active-border: @brand-darkest; |
|
| 127 |
|
|
| 128 |
// -------------------------------------- |
|
| 129 |
// SCAFFOLDING |
|
| 130 |
// -------------------------------------- |
|
| 131 |
@body-bg: @gray-light; // general |
|
| 132 |
@content-bg: @gray-light; // background first tabs |
|
| 133 |
@heading-bg: @brand-lighter ; // controlpanels & other stuff |
|
| 134 |
|
|
| 135 |
// Tabs |
|
| 136 |
@tabs-bg: @gray-light; // background tabs panel (data/content) |
|
| 137 |
@tabs-bg-hover: @gray-light; // background tabs panel (data/content) |
|
| 138 |
@tabs-bg-hover-active: @tabs-bg; // background tabs panel (data/content) |
|
| 139 |
@tabs-text-hover: @brand-strong; // background tabs panel (data/content) |
|
| 140 |
|
|
| 141 |
|
|
| 142 |
@text-color: @brand-primary; |
|
| 143 |
@heading-color: @brand-heading-color ; // labels & table headings |
|
| 144 |
@caption-color: @brand-heading-color ; // caption |
|
| 145 |
|
|
| 146 |
|
|
| 147 |
// Table list zebra effect |
|
| 148 |
// Zebra effect in list tables |
|
| 149 |
@t-row-zebra-bg-odd: @brand-lighter; |
|
| 150 |
@t-row-zebra-bg-even: @brand-verylight; |
|
| 151 |
@t-row-zebra-bg-hover: #ffffff; |
|
| 152 |
|
|
| 153 |
@t-row-zebra-bg-error: @brand-error-bg; |
|
| 154 |
@t-row-zebra-bg-special: #FEF2C5; // PENDENT: ANSCHAUEN |
|
| 155 |
@t-row-zebra-bg-highlight: #B4F4FE; // PENDENT: ANSCHAUEN |
|
| 156 |
|
|
Auch abrufbar als: Unified diff
Geloeschte & obsolete Less-Dateien