Color style unified
This commit is contained in:
parent
db7bc708e6
commit
f52d306db4
|
|
@ -20,7 +20,7 @@ vn-autocomplete {
|
|||
right: 0;
|
||||
top: 1.3em;
|
||||
height: 1em;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
border-radius: .2em;
|
||||
|
||||
& > vn-icon {
|
||||
|
|
@ -28,7 +28,7 @@ vn-autocomplete {
|
|||
font-size: 18px;
|
||||
|
||||
&:hover {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -53,11 +53,8 @@ ul.vn-autocomplete {
|
|||
padding: .8em;
|
||||
margin: 0;
|
||||
|
||||
&.active {
|
||||
background-color: $hover;
|
||||
}
|
||||
&.load-more {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
font-family: vn-font-bold;
|
||||
padding: .4em .8em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ vn-calendar {
|
|||
}
|
||||
|
||||
.weekdays {
|
||||
border-bottom: 1px solid $hover;
|
||||
border-top: 1px solid $hover;
|
||||
border-bottom: 1px solid $color-hover-cd;
|
||||
border-top: 1px solid $color-hover-cd;
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
|
|
@ -43,98 +43,98 @@ vn-calendar {
|
|||
}
|
||||
|
||||
.day.gray {
|
||||
color: $secondary-font-color
|
||||
color: $color-font-secondary
|
||||
}
|
||||
|
||||
.day.orange {
|
||||
font-weight: bold;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
|
||||
.day.orange-circle {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
& > span {
|
||||
background-color: $main-01
|
||||
background-color: $color-main
|
||||
}
|
||||
}
|
||||
|
||||
.day.orange-circle:hover {
|
||||
& > span {
|
||||
background-color: $main-01-05
|
||||
background-color: $color-main-medium
|
||||
}
|
||||
}
|
||||
|
||||
.day.light-orange {
|
||||
color: $main-01-05
|
||||
color: $color-main-medium
|
||||
}
|
||||
|
||||
.day.green {
|
||||
font-weight: bold;
|
||||
color: $main-02;
|
||||
color: $color-success;
|
||||
}
|
||||
|
||||
.day.green-circle {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
& > span {
|
||||
background-color: $main-02
|
||||
background-color: $color-success
|
||||
}
|
||||
}
|
||||
|
||||
.day.green-circle:hover {
|
||||
& > span {
|
||||
background-color: $main-02-05
|
||||
background-color: $color-success-medium
|
||||
}
|
||||
}
|
||||
|
||||
.day.light-green {
|
||||
font-weight: bold;
|
||||
color: $main-02-05
|
||||
color: $color-success-medium
|
||||
}
|
||||
|
||||
.day.blue {
|
||||
font-weight: bold;
|
||||
color: $main-03;
|
||||
color: $color-notice;
|
||||
}
|
||||
|
||||
.day.blue-circle {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
& > span {
|
||||
background-color: $main-03
|
||||
background-color: $color-notice
|
||||
}
|
||||
}
|
||||
|
||||
.day.blue-circle:hover {
|
||||
& > span {
|
||||
background-color: $main-03-05
|
||||
background-color: $color-notice-medium
|
||||
}
|
||||
}
|
||||
|
||||
.day.light-blue {
|
||||
font-weight: bold;
|
||||
color: $main-03-05
|
||||
color: $color-notice-medium
|
||||
}
|
||||
|
||||
.day.red {
|
||||
font-weight: bold;
|
||||
color: $alert-01
|
||||
color: $color-alert
|
||||
}
|
||||
|
||||
.day.red-circle {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
& > span {
|
||||
background-color: $alert-01
|
||||
background-color: $color-alert
|
||||
}
|
||||
}
|
||||
|
||||
.day.red-circle:hover {
|
||||
& > span {
|
||||
background-color: $alert-01-05
|
||||
background-color: $color-alert-medium
|
||||
}
|
||||
}
|
||||
|
||||
.day.light-red {
|
||||
font-weight: bold;
|
||||
color: $alert-01-05;
|
||||
color: $color-alert-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ vn-check {
|
|||
padding-left: 5px;
|
||||
position: absolute;
|
||||
bottom: 3px;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
font-size: 20px !important
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@ vn-chip {
|
|||
margin: 0 0.5em 0.5em 0;
|
||||
|
||||
.mdl-chip {
|
||||
background-color: rgba($main-01, 0.9);
|
||||
background-color: rgba($color-main, 0.9);
|
||||
color: #FFF
|
||||
}
|
||||
|
||||
.mdl-chip:active {
|
||||
background-color: $main-01
|
||||
background-color: $color-main
|
||||
}
|
||||
|
||||
& > vn-one > span > span {
|
||||
|
|
|
|||
|
|
@ -22,5 +22,5 @@ vn-date-picker {
|
|||
.flatpickr-months .flatpickr-month,
|
||||
.flatpickr-weekdays,
|
||||
span.flatpickr-weekday {
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
}
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
}
|
||||
& > div {
|
||||
position: relative;
|
||||
box-shadow: 0 0 .4em rgba(0, 0, 0, .4);
|
||||
box-shadow: 0 0 .4em $color-shadow;
|
||||
background-color: white;
|
||||
border-radius: .2em;
|
||||
overflow: auto;
|
||||
|
|
@ -62,7 +62,7 @@
|
|||
background-color: transparent;
|
||||
border: none;
|
||||
border-radius: .1em;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
font-family: vn-font-bold;
|
||||
padding: .7em;
|
||||
margin: -0.7em;
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ vn-drop-down {
|
|||
& .selected label {
|
||||
font-size: inherit;
|
||||
bottom: 2px;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
}
|
||||
}
|
||||
& > vn-icon[icon=clear] {
|
||||
|
|
@ -40,7 +40,7 @@ vn-drop-down {
|
|||
font-size: 18px;
|
||||
|
||||
&:hover {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
}
|
||||
}
|
||||
&:hover > vn-icon[icon=clear] {
|
||||
|
|
@ -67,12 +67,11 @@ vn-drop-down {
|
|||
margin-right: .6em;
|
||||
}
|
||||
&.active {
|
||||
background-color: #3D3A3B;
|
||||
color: white;
|
||||
@extend %active;
|
||||
}
|
||||
}
|
||||
.status {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ vn-fetched-tags {
|
|||
}
|
||||
& > vn-auto > .inline-tag {
|
||||
display: inline-block;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
margin-right: .4em;
|
||||
text-align: center;
|
||||
font-size: .8em;
|
||||
|
|
@ -28,10 +28,10 @@ vn-fetched-tags {
|
|||
padding: .1em;
|
||||
border-radius: .1em;
|
||||
width: 4em;
|
||||
border: 1px solid $secondary-font-color;
|
||||
border: 1px solid $color-font-secondary;
|
||||
|
||||
&.empty {
|
||||
border: 1px solid $main-bg;
|
||||
border: 1px solid $color-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,16 +2,17 @@
|
|||
|
||||
vn-icon-button {
|
||||
outline: 0;
|
||||
color: $color-main;
|
||||
|
||||
button {
|
||||
background: transparent !important;
|
||||
background-color: transparent !important;
|
||||
display: inline-block;
|
||||
color: $main-01;
|
||||
border: 0
|
||||
}
|
||||
color: inherit;
|
||||
border: 0;
|
||||
|
||||
button.mdl-button--colored {
|
||||
color: orange
|
||||
&.mdl-button--colored {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ vn-input-number {
|
|||
vn-icon[icon=add],
|
||||
vn-icon[icon=remove]{
|
||||
&:not(:hover){
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
}
|
||||
i {
|
||||
-moz-user-select: none;
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
@import "variables";
|
||||
vn-input-range {
|
||||
label {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
font-size: 12px;
|
||||
padding: 0 25px;
|
||||
}
|
||||
label.min-label, label.max-label {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
}
|
||||
label.max-label {
|
||||
float: right;
|
||||
|
|
|
|||
|
|
@ -2,19 +2,18 @@
|
|||
|
||||
vn-label-value > section {
|
||||
& > vn-label {
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
|
||||
&::after {
|
||||
content: ':';
|
||||
}
|
||||
}
|
||||
& > span {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
}
|
||||
|
||||
& > vn-icon {
|
||||
vertical-align: middle;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
font-size: 1.2em
|
||||
}
|
||||
}
|
||||
|
|
@ -8,10 +8,10 @@ vn-log {
|
|||
display: none;
|
||||
}
|
||||
.label {
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
}
|
||||
.value {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
}
|
||||
|
||||
.after, .before {
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ vn-paging {
|
|||
text-align: center;
|
||||
|
||||
ul {
|
||||
box-shadow: 0 0 .4em rgba(1,1,1,.4);
|
||||
box-shadow: 0 0 .4em $color-shadow;
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
margin: 20px 0;
|
||||
|
|
@ -20,7 +20,7 @@ vn-paging {
|
|||
margin-left: 0;
|
||||
}
|
||||
&.active > a {
|
||||
background: $main-header;
|
||||
background: $color-active;
|
||||
color: #fff;
|
||||
}
|
||||
& > a,
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@import "variables";
|
||||
|
||||
.vn-popover {
|
||||
display: none;
|
||||
z-index: 20;
|
||||
|
|
@ -6,7 +8,7 @@
|
|||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
color: initial;
|
||||
color: $color-font;
|
||||
|
||||
opacity: 0;
|
||||
transform: translateY(-.6em);
|
||||
|
|
@ -20,22 +22,22 @@
|
|||
}
|
||||
& > .popover {
|
||||
position: absolute;
|
||||
box-shadow: 0 .1em .4em rgba(1, 1, 1, .4);
|
||||
box-shadow: 0 .1em .4em $color-shadow;
|
||||
z-index: 0;
|
||||
|
||||
& > .arrow {
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
margin: -.5em;
|
||||
background-color: white;
|
||||
box-shadow: 0 .1em .4em rgba(1, 1, 1, .4);
|
||||
background-color: $color-bg-panel;
|
||||
box-shadow: 0 .1em .4em $color-shadow;
|
||||
position: absolute;
|
||||
transform: rotate(45deg);
|
||||
z-index: -1;
|
||||
}
|
||||
& > .content {
|
||||
border-radius: .1em;
|
||||
background-color: white;
|
||||
background-color: $color-bg-panel;
|
||||
height: inherit;
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@ vn-snackbar #shapes {
|
|||
}
|
||||
|
||||
vn-snackbar .shape {
|
||||
background-color: rgba(1, 1, 1, 0.8);
|
||||
box-shadow: 0 0 .4em rgba(1,1,1,.4);
|
||||
background-color: rgba(0, 0, 0, 0.8);
|
||||
box-shadow: 0 0 .4em $color-shadow;
|
||||
transition: transform 300ms ease-in-out;
|
||||
transform: translateY(20em);
|
||||
box-sizing: border-box;
|
||||
|
|
@ -52,7 +52,7 @@ vn-snackbar .shape {
|
|||
margin-left: .5em;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
float: right;
|
||||
border: none;
|
||||
padding: .5em;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ vn-step-control {
|
|||
justify-content: center;
|
||||
|
||||
.step-control {
|
||||
border-top: 2px solid $main-01;
|
||||
border-top: 2px solid $color-main;
|
||||
margin-bottom: 15px;
|
||||
|
||||
& > .steps {
|
||||
|
|
@ -21,7 +21,7 @@ vn-step-control {
|
|||
}
|
||||
|
||||
& > .steps > .step .circle {
|
||||
border: 2px solid $main-01;
|
||||
border: 2px solid $color-main;
|
||||
background-color: white;
|
||||
align-content: center;
|
||||
margin-top: -9.5px;
|
||||
|
|
@ -34,7 +34,7 @@ vn-step-control {
|
|||
}
|
||||
|
||||
& > .steps > .step .circle.active {
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
}
|
||||
|
||||
& > .buttons {
|
||||
|
|
|
|||
|
|
@ -25,14 +25,14 @@ vn-table {
|
|||
content: 'arrow_drop_down';
|
||||
position: absolute;
|
||||
padding-left: 2px;
|
||||
color: $lines;
|
||||
color: $color-spacer;
|
||||
opacity: 0
|
||||
}
|
||||
vn-th[field] > :hover:after {
|
||||
opacity: 1
|
||||
}
|
||||
vn-th[field].active > :after {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
opacity: 1
|
||||
}
|
||||
vn-th[field].desc > :after {
|
||||
|
|
@ -81,12 +81,15 @@ vn-table {
|
|||
}
|
||||
}
|
||||
}
|
||||
a.vn-tr {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
vn-thead, vn-tbody, vn-empty-rows {
|
||||
border-bottom: 3px solid $lines;
|
||||
border-bottom: 3px solid $color-spacer;
|
||||
}
|
||||
vn-tbody > vn-tr, vn-tbody > a.vn-tr{
|
||||
border-bottom: 1px solid $lines;
|
||||
border-bottom: 1px solid $color-spacer;
|
||||
transition: background-color 200ms ease-in-out;
|
||||
|
||||
&.clickable {
|
||||
|
|
|
|||
|
|
@ -9,13 +9,13 @@ vn-textarea {
|
|||
position: absolute;
|
||||
bottom: 0;
|
||||
pointer-events: none;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
transition-duration: .2s;
|
||||
transition-timing-function: cubic-bezier(.4,0,.2,1);
|
||||
}
|
||||
& textarea.ng-not-empty+label.placeholder{
|
||||
top: 5px;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
padding: 0;
|
||||
font-size: 12px;
|
||||
visibility: visible!important;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
@import "variables";
|
||||
|
||||
vn-textfield {
|
||||
margin: 20px 0!important;
|
||||
display: inline-block;
|
||||
|
|
@ -20,7 +21,7 @@ vn-textfield {
|
|||
|
||||
.leftIcons, .rightIcons, .suffix {
|
||||
display: flex;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
|
||||
.material-icons {
|
||||
font-size: 20px !important
|
||||
|
|
@ -62,13 +63,13 @@ vn-textfield {
|
|||
left: 0;
|
||||
padding: 4px 0!important;
|
||||
pointer-events: none;
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
transition-duration: .2s;
|
||||
transition-timing-function: cubic-bezier(.4,0,.2,1);
|
||||
}
|
||||
&.not-empty label{
|
||||
bottom: 24px;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
padding: 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
|
@ -104,10 +105,10 @@ vn-textfield {
|
|||
content: ' ';
|
||||
pointer-events: none;
|
||||
width: 100%;
|
||||
background-color: rgba(0,0,0,.12);
|
||||
background-color: $color-input-underline;
|
||||
}
|
||||
.selected.underline {
|
||||
background-color: rgb(255,152,0);
|
||||
background-color: $color-main;
|
||||
height: 2px;
|
||||
left: 50%;
|
||||
width: 0px !important;
|
||||
|
|
@ -121,7 +122,7 @@ vn-textfield {
|
|||
}
|
||||
label {
|
||||
bottom: 24px;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
font-size: 12px;
|
||||
}
|
||||
.selected.underline{
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
@import "variables";
|
||||
|
||||
.vn-tooltip {
|
||||
display: none;
|
||||
position: fixed;
|
||||
z-index: 150;
|
||||
background-color: #333;
|
||||
color: white;
|
||||
background-color: $color-active;
|
||||
color: $color-active-font;
|
||||
border-radius: .2em;
|
||||
|
||||
&.show {
|
||||
|
|
|
|||
|
|
@ -23,25 +23,25 @@ vn-treeview {
|
|||
}
|
||||
|
||||
li > vn-horizontal:hover {
|
||||
background-color: $hover
|
||||
background-color: $color-hover-cd
|
||||
}
|
||||
|
||||
li.selected > vn-horizontal > .description .text,
|
||||
li.included > vn-horizontal > .description .text {
|
||||
font-weight: bold;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
|
||||
li.included {
|
||||
& > vn-horizontal > .description > vn-horizontal > vn-check {
|
||||
.mdl-checkbox .mdl-checkbox__box-outline, {
|
||||
border: 2px solid $main-01-05;
|
||||
border: 2px solid $color-main-medium;
|
||||
}
|
||||
fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline, .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
|
||||
border: 2px solid rgba(0,0,0,.26);
|
||||
}
|
||||
.mdl-checkbox .mdl-checkbox__tick-outline {
|
||||
background: $main-01-05;
|
||||
background: $color-main-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ body {
|
|||
}
|
||||
.mdl-button {
|
||||
font-weight: bolder;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
.mdl-button--colored {
|
||||
color: white !important;
|
||||
|
|
@ -18,31 +18,31 @@ body {
|
|||
.mdl-textfield--floating-label.is-focused .mdl-textfield__label,
|
||||
.mdl-textfield--floating-label.is-dirty .mdl-textfield__label,
|
||||
.mdl-textfield--floating-label.has-placeholder .mdl-textfield__label {
|
||||
color: $main-01 !important;
|
||||
color: $color-main !important;
|
||||
}
|
||||
.mdl-checkbox.is-checked .mdl-checkbox__box-outline, {
|
||||
border: 2px solid $main-01;
|
||||
border: 2px solid $color-main;
|
||||
}
|
||||
fieldset[disabled] .mdl-checkbox .mdl-checkbox__box-outline, .mdl-checkbox.is-disabled .mdl-checkbox__box-outline {
|
||||
border: 2px solid rgba(0,0,0,.26);
|
||||
}
|
||||
.mdl-checkbox.is-checked .mdl-checkbox__tick-outline {
|
||||
background: $main-01;
|
||||
background: $color-main;
|
||||
}
|
||||
.mdl-textfield__label::after{
|
||||
background-color: $main-01 !important;
|
||||
background-color: $color-main !important;
|
||||
}
|
||||
.mdl-button--colored,
|
||||
.mdl-button--colored:focus,
|
||||
.mdl-button--colored:active {
|
||||
background-color: $main-01 !important;
|
||||
background-color: $color-main !important;
|
||||
}
|
||||
.mdl-button--colored:hover,
|
||||
.mdl-button--raised:hover {
|
||||
background-color: $main-01 !important;
|
||||
background-color: $color-main !important;
|
||||
}
|
||||
.mdl-button--fab{
|
||||
color: white !important;
|
||||
background-color: $main-01 !important;
|
||||
background-color: $color-main !important;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
@import "variables";
|
||||
|
||||
body {
|
||||
background-color: $bg-content;
|
||||
background-color: $color-bg;
|
||||
overflow: auto;
|
||||
}
|
||||
vn-app {
|
||||
|
|
@ -13,7 +13,7 @@ vn-app {
|
|||
left: 0;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
box-shadow: 0 .1em .2em rgba(1, 1, 1, .2);
|
||||
box-shadow: 0 .1em .2em $color-shadow;
|
||||
height: $topbar-height;
|
||||
padding: .4em;
|
||||
|
||||
|
|
@ -31,7 +31,7 @@ vn-app {
|
|||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
}
|
||||
& > .main-title {
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ vn-home {
|
|||
@extend %clickable-light;
|
||||
overflow:hidden;
|
||||
border-radius: 6px;
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
color: white;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ vn-left-menu {
|
|||
@extend %clickable;
|
||||
padding: .5em 1em;
|
||||
display: block;
|
||||
color: inherit;
|
||||
|
||||
& > vn-icon:nth-child(1) {
|
||||
vertical-align: middle;
|
||||
|
|
@ -32,8 +33,7 @@ vn-left-menu {
|
|||
}
|
||||
|
||||
& > li > a.active {
|
||||
background-color: $main-header;
|
||||
color: white;
|
||||
@extend %active;
|
||||
}
|
||||
|
||||
& > li > a.expanded {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ vn-login {
|
|||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
font-size: 1.1em;
|
||||
font-weight: normal;
|
||||
background-color: #3c393b;
|
||||
|
|
@ -22,7 +22,7 @@ vn-login {
|
|||
min-width: 15em;
|
||||
padding: 3em;
|
||||
background-color: white;
|
||||
box-shadow: 0 0 1em 0 rgba(1,1,1,.6);
|
||||
box-shadow: 0 0 1em 0 rgba(0, 0, 0, .6);
|
||||
border-radius: .5em;
|
||||
|
||||
& > img {
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ vn-main-menu {
|
|||
padding-left: .6em;
|
||||
|
||||
&:hover {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
}
|
||||
& > #user {
|
||||
|
|
@ -35,7 +35,7 @@ vn-main-menu {
|
|||
|
||||
& > li {
|
||||
@extend %clickable-light;
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
margin-bottom: .6em;
|
||||
padding: .8em;
|
||||
border-radius: .1em;
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@ vn-side-menu > .menu {
|
|||
bottom: 0;
|
||||
width: $menu-width;
|
||||
min-width: $menu-width;
|
||||
background-color: white;
|
||||
box-shadow: 0 .1em .2em rgba(1, 1, 1, .2);
|
||||
background-color: $color-bg-panel;
|
||||
box-shadow: 0 .1em .2em $color-shadow;
|
||||
overflow: auto;
|
||||
top: $topbar-height;
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ vn-topbar {
|
|||
display: flex;
|
||||
color: white;
|
||||
box-sizing: border-box;
|
||||
background-color: $bg-dark-bar;
|
||||
background-color: $color-header;
|
||||
align-items: center;
|
||||
|
||||
& > header {
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
vn-user-configuration-popover {
|
||||
vn-popover {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
vn-vertical {
|
||||
min-width: 250px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,29 +1,11 @@
|
|||
@import "./variables";
|
||||
|
||||
html [bg-main], .bg-main {
|
||||
background-color: $main-bg;
|
||||
.bg-panel {
|
||||
background-color: $color-bg-panel;
|
||||
}
|
||||
html [bg-minor], .bg-minor {
|
||||
background-color: $bg-minor;
|
||||
.item-hightlight {
|
||||
background-color: $color-hightlight;
|
||||
}
|
||||
html [bg-content], .bg-content {
|
||||
background-color: $bg-content;
|
||||
}
|
||||
html [bg-panel], .bg-panel {
|
||||
background-color: $bg-panel;
|
||||
}
|
||||
html [bg-dark-bar], .bg-dark-bar {
|
||||
background-color: $bg-dark-bar;
|
||||
}
|
||||
html [bg-dark-menu], .bg-dark-menu {
|
||||
background-color: darken($bg-dark-menu, 35%);
|
||||
}
|
||||
/* Color para items seleccionados */
|
||||
.bg-dark-item {
|
||||
background-color: $bg-dark-bar;
|
||||
color: $color-white;
|
||||
}
|
||||
/* Color para items inactivos */
|
||||
.bg-opacity-item {
|
||||
opacity: 0.6;
|
||||
.item-disabled {
|
||||
opacity: $color-disabled;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
html [border-none], .border-none {
|
||||
|
|
|
|||
|
|
@ -1,32 +0,0 @@
|
|||
$main-font-color:#222222;
|
||||
$secondary-font-color: #9b9b9b;
|
||||
$main-header: #3d3d3d;
|
||||
$hover: rgba(0, 0, 0, 0.1);
|
||||
$hover-opacity: .7;
|
||||
$main-bg: #e5e5e5;
|
||||
$main-01: #f7931e;
|
||||
$main-01-05: rgba($main-01, 0.5);
|
||||
$main-01-03: rgba($main-01, 0.3);
|
||||
$main-02: #a3d131;
|
||||
$main-02-05: rgba($main-02, 0.5);
|
||||
$main-02-03: rgba($main-02, 0.3);
|
||||
$main-03: #32b1ce;
|
||||
$main-03-05: rgba($main-03, 0.5);
|
||||
$main-03-03: rgba($main-03, 0.3);
|
||||
$lines: #9b9b9b;
|
||||
$alert-01: #f42121;
|
||||
$alert-01-03: rgba($alert-01, 0.5);
|
||||
$alert-01-05: rgba($alert-01, 0.5);
|
||||
|
||||
$color-green: #a3d131;
|
||||
$color-orange: #f7931e;
|
||||
$color-white: white;
|
||||
$color-dark: $main-header; //headerbar
|
||||
$color-dark-grey: #424242;
|
||||
$color-light-grey: $main-bg;
|
||||
$color-medium-grey: $secondary-font-color;
|
||||
$color-grey: #c4c4c4; //deprecated
|
||||
$color-medium-green: rgba($color-green, 0.5);
|
||||
$color-medium-orange: rgba($color-orange, 0.5);
|
||||
$color-light-green: rgba($color-green, 0.3);
|
||||
$color-light-orange: rgba($color-orange, 0.3);
|
||||
|
|
@ -1,14 +1,13 @@
|
|||
|
||||
@import "./effects";
|
||||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
.vn-descriptor {
|
||||
box-shadow: 0 .1em .2em rgba(1, 1, 1, .2);
|
||||
box-shadow: 0 .1em .2em $color-shadow;
|
||||
|
||||
& > .header {
|
||||
display: flex;
|
||||
background: $main-01;
|
||||
background: $color-main;
|
||||
color: white;
|
||||
justify-content: space-between;
|
||||
align-items: stretch;
|
||||
|
|
@ -21,6 +20,7 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: .5em;
|
||||
color: inherit;
|
||||
|
||||
& > vn-icon {
|
||||
font-size: 1.8em;
|
||||
|
|
@ -47,12 +47,11 @@
|
|||
|
||||
& > vn-icon {
|
||||
padding: $pad-small;
|
||||
color: #666;
|
||||
opacity: .4;
|
||||
color: $color-secondary;
|
||||
font-size: 1.5em;
|
||||
|
||||
&.bright {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,16 +2,6 @@
|
|||
display: block;
|
||||
}
|
||||
|
||||
.well {
|
||||
min-height: 20px;
|
||||
padding: 19px;
|
||||
margin-bottom: 20px;
|
||||
background-color: #f5f5f5;
|
||||
border: 1px solid #e3e3e3;
|
||||
border-radius: 4px;
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
|
||||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
%clickable {
|
||||
cursor: pointer;
|
||||
transition: background-color 250ms ease-out;
|
||||
|
||||
&:hover {
|
||||
background-color: $hover;
|
||||
background-color: $color-hover-cd;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -15,6 +15,11 @@
|
|||
transition: opacity 250ms ease-out;
|
||||
|
||||
&:hover {
|
||||
opacity: $hover-opacity;
|
||||
opacity: $color-hover-dc;
|
||||
}
|
||||
}
|
||||
|
||||
%active {
|
||||
background-color: $color-active;
|
||||
color: $color-active-font;
|
||||
}
|
||||
|
|
@ -1,24 +1,16 @@
|
|||
@import "./colors";
|
||||
@import "./variables";
|
||||
@import "./font-family";
|
||||
|
||||
body {
|
||||
color: $main-font-color;
|
||||
color: $color-font;
|
||||
font-family: vn-font;
|
||||
}
|
||||
html [uppercase], .uppercase {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
html [orange], .orange {color: $main-01}
|
||||
html [green], .green {color: $main-02}
|
||||
html [blue], .blue {color: $main-03}
|
||||
html [red], html [alert], .red, .alert {color: $alert-01}
|
||||
html [white], .white {color: $color-white}
|
||||
html [dark], .dark {color: $color-dark}
|
||||
html [dark-grey], .dark-grey {color: $color-dark-grey}
|
||||
html [light-grey], .light-grey {color: $color-light-grey}
|
||||
html [medium-grey], .medium-grey {color: $hover}
|
||||
html [medium-green], .medium-green {color: $color-medium-green}
|
||||
html [medium-orange], .medium-orange {color: $color-medium-orange}
|
||||
html [light-green], .light-green {color: $color-light-green}
|
||||
html [light-orange], .light-orange {color: $color-light-orange}
|
||||
html [color-main], .color-main {
|
||||
color: $color-main;
|
||||
}
|
||||
html [color-secondary], .color-secondary {
|
||||
color: $color-secondary;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,11 +4,10 @@ import './layout.scss';
|
|||
import './display.scss';
|
||||
import './margin.scss';
|
||||
import './padding.scss';
|
||||
import './background.scss';
|
||||
import './border.scss';
|
||||
import './background.scss';
|
||||
import './font-style.scss';
|
||||
import './misc.scss';
|
||||
import './colors.scss';
|
||||
import './effects.scss';
|
||||
import './order-product.scss';
|
||||
import './summary.scss';
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
@import "./variables";
|
||||
@import "./colors";
|
||||
@import "./effects";
|
||||
|
||||
a:focus,
|
||||
|
|
@ -19,11 +18,15 @@ input[type=reset]::-moz-focus-inner {
|
|||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
a {
|
||||
color: $color-main;
|
||||
text-decoration: none;
|
||||
}
|
||||
.link {
|
||||
text-decoration: underline;
|
||||
cursor: pointer;
|
||||
&:hover{
|
||||
color: $main-01!important;
|
||||
color: $color-main!important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -73,14 +76,14 @@ html [vn-center], .vn-center{
|
|||
|
||||
.list-element{
|
||||
padding: 8px 0 0 0;
|
||||
border-bottom: 1px solid $lines;
|
||||
border-bottom: 1px solid $color-spacer;
|
||||
i {
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
}
|
||||
.tooltip {
|
||||
.list-header{
|
||||
border-bottom: 3px solid $color-medium-grey;
|
||||
border-bottom: 3px solid $color-spacer;
|
||||
font-family: vn-font-bold;
|
||||
text-align: center
|
||||
}
|
||||
|
|
@ -90,23 +93,23 @@ html [vn-center], .vn-center{
|
|||
}
|
||||
.list-footer{
|
||||
font-family: vn-font-bold;
|
||||
border-top: 3px solid $lines;
|
||||
border-top: 3px solid $color-spacer;
|
||||
}
|
||||
.list-element.warning{
|
||||
background-color: $color-medium-orange;
|
||||
background-color: $color-main-medium;
|
||||
}
|
||||
.list-element.success{
|
||||
background-color: $color-medium-green;
|
||||
background-color: $color-success-medium;
|
||||
|
||||
}
|
||||
.list-element.success:hover{
|
||||
background-color: $color-light-green;
|
||||
background-color: $color-success-light;
|
||||
}
|
||||
.list-element.warning:hover{
|
||||
background-color: $color-light-orange;
|
||||
background-color: $color-main-light;
|
||||
}
|
||||
.flatpickr-month, .flatpickr-weekdays, span.flatpickr-weekday {
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
}
|
||||
|
||||
html [pointer], .pointer{
|
||||
|
|
@ -117,14 +120,6 @@ html [noDrop], .noDrop{
|
|||
cursor: no-drop;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
|
||||
&:link {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
html [compact], .compact{
|
||||
max-width: 950px;
|
||||
margin-left: auto;
|
||||
|
|
@ -174,7 +169,7 @@ a.vn-list-item {
|
|||
|
||||
vn-icon {
|
||||
opacity: .4;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
margin-left: .5em;
|
||||
transition: opacity 250ms ease-out;
|
||||
font-size: 2em;
|
||||
|
|
@ -198,7 +193,7 @@ fieldset[disabled] .mdl-checkbox .mdl-checkbox__label,
|
|||
}
|
||||
fieldset[disabled] .mdl-textfield .mdl-textfield__label,
|
||||
.mdl-textfield.is-disabled.is-disabled .mdl-textfield__label {
|
||||
color: $main-01 !important;
|
||||
color: $color-main !important;
|
||||
}
|
||||
|
||||
/** END - FORM ELEMENTS DISABLED **/
|
||||
|
|
@ -210,9 +205,8 @@ fieldset[disabled] .mdl-textfield .mdl-textfield__label,
|
|||
}
|
||||
|
||||
.counter {
|
||||
background-color: $main-header;
|
||||
@extend %active;
|
||||
display: inline-block;
|
||||
color: $color-white;
|
||||
text-align: center;
|
||||
border-radius: 3px;
|
||||
min-width: 1.5em;
|
||||
|
|
@ -242,10 +236,10 @@ fieldset[disabled] .mdl-textfield .mdl-textfield__label,
|
|||
}
|
||||
}
|
||||
& > thead, & > tbody {
|
||||
border-bottom: 3px solid $lines;
|
||||
border-bottom: 3px solid $color-spacer;
|
||||
}
|
||||
& > tbody > tr {
|
||||
border-bottom: 1px solid $lines;
|
||||
border-bottom: 1px solid $color-spacer;
|
||||
transition: background-color 200ms ease-in-out;
|
||||
|
||||
&.clickable {
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
@import 'colors';
|
||||
@import "./padding";
|
||||
@import './variables';
|
||||
|
||||
vn-dialog.modal-form {
|
||||
vn-horizontal.header{
|
||||
@extend .pad-small;
|
||||
background-color: $main-01;
|
||||
padding: $pad-small;
|
||||
background-color: $color-main;
|
||||
h5{
|
||||
color: white;
|
||||
margin: 0 auto;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
@media screen and (max-width: 1920px){
|
||||
.catalog-list .product {
|
||||
|
|
@ -34,7 +34,7 @@
|
|||
padding: 4px;
|
||||
|
||||
& > vn-one {
|
||||
border: 1px solid rgba($lines, 0.5);
|
||||
border: 1px solid rgba($color-spacer, 0.5);
|
||||
display: block
|
||||
}
|
||||
|
||||
|
|
@ -66,7 +66,7 @@
|
|||
}
|
||||
|
||||
& > span {
|
||||
color: $secondary-font-color;
|
||||
color: $color-font-secondary;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0.5em;
|
||||
font-weight: bold;
|
||||
|
|
@ -85,7 +85,7 @@
|
|||
font-size: 0.8em;
|
||||
|
||||
& > vn-one span:first-child {
|
||||
color: $secondary-font-color
|
||||
color: $color-font-secondary
|
||||
}
|
||||
|
||||
& > vn-one span:first-child, & > vn-one span:last-child {
|
||||
|
|
@ -93,7 +93,7 @@
|
|||
}
|
||||
|
||||
vn-icon[icon="add_circle"] {
|
||||
color: $main-01
|
||||
color: $color-main
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
.summary {
|
||||
|
|
@ -9,8 +8,8 @@
|
|||
& > h5 {
|
||||
padding: $pad-small;
|
||||
border: none;
|
||||
background: $main-01;
|
||||
color: $color-white;
|
||||
background: $color-main;
|
||||
color: white;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
line-height: 1.3em;
|
||||
|
|
@ -30,8 +29,8 @@
|
|||
padding: 7px;
|
||||
padding-bottom: 4px; /* Bottom line-height fix */
|
||||
font-family: unset;
|
||||
background-color: $main-01-03;
|
||||
border-bottom: .1em solid $main-01;
|
||||
background-color: $color-main-light;
|
||||
border-bottom: .1em solid $color-main;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
h1 {
|
||||
font-size: 32pt;
|
||||
|
|
@ -24,5 +24,5 @@ h1, h2, h3, h4, h5, h6 {
|
|||
margin-top: 0;
|
||||
margin-bottom: .2em;
|
||||
font-family: vn-font-bold;
|
||||
color: $main-font-color
|
||||
color: $color-font
|
||||
}
|
||||
|
|
@ -1,18 +1,8 @@
|
|||
@import "./colors";
|
||||
|
||||
$menu-width: 16em;
|
||||
$topbar-height: 4em;
|
||||
$mobile-width: 800px;
|
||||
|
||||
// Background color
|
||||
|
||||
$bg-main: $color-green;
|
||||
$bg-minor: $color-orange;
|
||||
$bg-content: $color-light-grey;
|
||||
$bg-panel: $color-white;
|
||||
$bg-dark-bar: $main-header;
|
||||
$bg-dark-menu: $color-dark-grey;
|
||||
|
||||
// Padding
|
||||
|
||||
$pad-none: 0;
|
||||
|
|
@ -30,5 +20,68 @@ $margin-large: 32px;
|
|||
// Border
|
||||
|
||||
$border-color: #AAA;
|
||||
$border-thin: 1px;
|
||||
$border-thick: 2px;
|
||||
$border-thin: .1em;
|
||||
$border-thick: .15em;
|
||||
|
||||
// Light theme
|
||||
|
||||
$color-header: #3d3d3d;
|
||||
$color-bg: #e5e5e5;
|
||||
$color-font:#222222;
|
||||
$color-font-secondary: #9b9b9b;
|
||||
$color-active: #3d3d3d;
|
||||
$color-active-font: white;
|
||||
$color-bg-panel: white;
|
||||
$color-main: #f7931e;
|
||||
$color-secondary: #ccc;
|
||||
$color-success: #a3d131;
|
||||
$color-notice: #32b1ce;
|
||||
$color-alert: #f42121;
|
||||
$color-spacer: #9b9b9b;
|
||||
$color-input-underline: rgba(0, 0, 0, .12);
|
||||
$color-shadow: rgba(0, 0, 0, .2);
|
||||
$color-hightlight: rgba(0, 0, 0, .15);
|
||||
$color-hover-cd: rgba(0, 0, 0, .1);
|
||||
$color-hover-dc: .7;
|
||||
$color-disabled: .6;
|
||||
|
||||
$color-main-medium: lighten($color-main, 20%);
|
||||
$color-main-light: lighten($color-main, 35%);
|
||||
$color-success-medium: lighten($color-success, 20%);
|
||||
$color-success-light: lighten($color-success, 35%);
|
||||
$color-notice-medium: lighten($color-notice, 20%);
|
||||
$color-notice-light: lighten($color-notice, 35%);
|
||||
$color-alert-medium: lighten($color-alert, 20%);
|
||||
$color-alert-light: lighten($color-alert, 35%);
|
||||
|
||||
// Dark theme
|
||||
/*
|
||||
$color-header: #3d3d3d;
|
||||
$color-bg: #222;
|
||||
$color-font:white;
|
||||
$color-font-secondary: #777;
|
||||
$color-active: #888;
|
||||
$color-active-font: white;
|
||||
$color-bg-panel: #3c3b3b;
|
||||
$color-main: #f7931e;
|
||||
$color-secondary: #ccc;
|
||||
$color-success: #a3d131;
|
||||
$color-notice: #32b1ce;
|
||||
$color-alert: #f42121;
|
||||
$color-spacer: #9b9b9b;
|
||||
$color-input-underline: rgba(255, 255, 255, .12);
|
||||
$color-shadow: rgba(0, 0, 0, .2);
|
||||
$color-hightlight: rgba(255, 255, 255, .15);
|
||||
$color-hover-cd: rgba(255, 255, 255, .1);
|
||||
$color-hover-dc: .7;
|
||||
$color-disabled: .6;
|
||||
|
||||
$color-main-medium: darken($color-main, 20%);
|
||||
$color-main-light: darken($color-main, 35%);
|
||||
$color-success-medium: darken($color-success, 20%);
|
||||
$color-success-light: darken($color-success, 35%);
|
||||
$color-notice-medium: darken($color-notice, 20%);
|
||||
$color-notice-light: darken($color-notice, 35%);
|
||||
$color-alert-medium: darken($color-alert, 20%);
|
||||
$color-alert-light: darken($color-alert, 35%);
|
||||
*/
|
||||
|
|
@ -85,8 +85,6 @@
|
|||
</vn-td>
|
||||
<vn-td number>
|
||||
<vn-icon-button
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-tooltip="Remove line"
|
||||
icon="delete"
|
||||
ng-click="$ctrl.deleteClaimedSale(saleClaimed.id)"
|
||||
|
|
|
|||
|
|
@ -59,8 +59,6 @@
|
|||
</vn-td>
|
||||
<vn-td number>
|
||||
<vn-icon-button
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-tooltip="Remove sale"
|
||||
icon="delete"
|
||||
ng-click="$ctrl.deleteClaimedSale($index)"
|
||||
|
|
|
|||
|
|
@ -90,7 +90,6 @@
|
|||
vn-acl="salesAssistant">
|
||||
</vn-autocomplete>
|
||||
<vn-icon-button
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-tooltip="Remove sale"
|
||||
icon="delete"
|
||||
|
|
|
|||
|
|
@ -2,15 +2,15 @@
|
|||
|
||||
vn-claim-index {
|
||||
.Pendiente {
|
||||
background-color: $main-01-05;
|
||||
background-color: $color-main-medium;
|
||||
}
|
||||
.Gestionado {
|
||||
background-color: $main-03-05;
|
||||
background-color: $color-notice-medium;
|
||||
}
|
||||
.Anulado, .Cuestionado {
|
||||
background-color: white;
|
||||
}
|
||||
.Resuelto {
|
||||
background-color: $main-02-05;
|
||||
background-color: $color-success-medium;
|
||||
}
|
||||
}
|
||||
|
|
@ -82,8 +82,6 @@
|
|||
</vn-textfield>
|
||||
<vn-none>
|
||||
<vn-icon-button
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-tooltip="Remove note"
|
||||
icon="delete"
|
||||
ng-click="$ctrl.removeObservation($index)"
|
||||
|
|
|
|||
|
|
@ -8,23 +8,30 @@
|
|||
</vn-crud-model>
|
||||
<div compact>
|
||||
<vn-card pad-large>
|
||||
<vn-horizontal ng-repeat="address in addresses" class="pad-medium-top" style="align-items: center;">
|
||||
<vn-one border-radius class="pad-small border-solid"
|
||||
ng-class="{'bg-main': address.isDefaultAddress,'bg-opacity-item': !address.isActive && !address.isDefaultAddress}">
|
||||
<vn-horizontal
|
||||
ng-repeat="address in addresses"
|
||||
class="pad-medium-top"
|
||||
style="align-items: center;">
|
||||
<vn-one
|
||||
border-radius
|
||||
class="pad-small border-solid"
|
||||
ng-class="{'item-hightlight': address.isDefaultAddress, 'item-disabled': !address.isActive && !address.isDefaultAddress}">
|
||||
<vn-horizontal style="align-items: center;">
|
||||
<vn-none pad-medium-h>
|
||||
<vn-icon-button icon="star"
|
||||
<vn-icon-button
|
||||
icon="star"
|
||||
ng-if="address.isDefaultAddress">
|
||||
</vn-icon-button>
|
||||
<vn-icon-button icon="star_border"
|
||||
<vn-icon-button
|
||||
ng-if="!address.isActive"
|
||||
icon="star_border"
|
||||
vn-tooltip="Active first to set as default">
|
||||
</vn-icon-button>
|
||||
<vn-icon-button orange
|
||||
<vn-icon-button
|
||||
ng-if="address.isActive && !address.isDefaultAddress"
|
||||
icon="star_border"
|
||||
vn-tooltip="Set as default"
|
||||
ng-click="$ctrl.setDefault(address)"
|
||||
ng-if="address.isActive && !address.isDefaultAddress">
|
||||
ng-click="$ctrl.setDefault(address)">
|
||||
</vn-icon-button>
|
||||
</vn-none>
|
||||
<vn-one border-solid-right>
|
||||
|
|
|
|||
|
|
@ -28,8 +28,7 @@
|
|||
</vn-textfield>
|
||||
<vn-none>
|
||||
<vn-icon
|
||||
pointer
|
||||
medium-grey
|
||||
pointer
|
||||
margin-medium-v
|
||||
vn-tooltip="Remove contact"
|
||||
icon="delete"
|
||||
|
|
|
|||
|
|
@ -1,11 +1,18 @@
|
|||
<div compact>
|
||||
<vn-card pad-large>
|
||||
<vn-horizontal ng-repeat="classification in $ctrl.classifications track by classification.id" class="pad-medium-top" style="align-items: center;">
|
||||
<vn-one border-radius class="pad-small border-solid" ng-class="{'bg-main': !classification.finished,'bg-opacity-item': classification.finished}">
|
||||
<vn-horizontal
|
||||
ng-repeat="classification in $ctrl.classifications track by classification.id"
|
||||
class="pad-medium-top"
|
||||
style="align-items: center;">
|
||||
<vn-one
|
||||
border-radius
|
||||
class="pad-small border-solid"
|
||||
ng-class="{'item-hightlight': !classification.finished,'item-disabled': classification.finished}">
|
||||
<vn-horizontal style="align-items: center;">
|
||||
<vn-none pad-medium-h orange>
|
||||
<vn-icon-button icon="lock" orange
|
||||
ng-if="!classification.finished"
|
||||
<vn-none pad-medium-h>
|
||||
<vn-icon-button
|
||||
ng-if="!classification.finished"
|
||||
icon="lock"
|
||||
vn-tooltip="Close contract"
|
||||
ng-click="$ctrl.closeContract(classification)">
|
||||
</vn-icon-button>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,6 @@
|
|||
|
||||
vn-client-summary {
|
||||
.alert span {
|
||||
color: $alert-01 !important
|
||||
color: $color-alert !important
|
||||
}
|
||||
}
|
||||
|
|
@ -2,9 +2,9 @@
|
|||
|
||||
vn-client-web-payment {
|
||||
vn-icon[icon=clear] {
|
||||
color: $alert-01;
|
||||
color: $color-alert;
|
||||
}
|
||||
vn-icon[icon=check] {
|
||||
color: $main-02;
|
||||
color: $color-success;
|
||||
}
|
||||
}
|
||||
|
|
@ -23,8 +23,6 @@
|
|||
</vn-textfield>
|
||||
<vn-none>
|
||||
<vn-icon
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-acl="buyer,replenisher"
|
||||
pointer
|
||||
vn-tooltip="Remove barcode"
|
||||
|
|
|
|||
|
|
@ -11,11 +11,11 @@ vn-item-diary {
|
|||
width: 400px;
|
||||
}
|
||||
.balanceNegative .balance {
|
||||
color: $alert-01;
|
||||
color: $color-alert;
|
||||
font-weight: bold;
|
||||
}
|
||||
.isIn .in {
|
||||
color: $main-02;
|
||||
color: $color-success;
|
||||
font-weight: bold;
|
||||
}
|
||||
.isToday .date{
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ vn-item-product {
|
|||
display: block;
|
||||
|
||||
.id {
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
color: white;
|
||||
margin-bottom: 0em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
@import "variables";
|
||||
vn-item-last-entries {
|
||||
.round {
|
||||
background-color: $lines;
|
||||
background-color: $color-spacer;
|
||||
border-radius: 25px;
|
||||
float: right;
|
||||
width: 25px;
|
||||
|
|
|
|||
|
|
@ -31,8 +31,6 @@
|
|||
</vn-textfield>
|
||||
<vn-none>
|
||||
<vn-icon
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-acl="buyer,replenisher"
|
||||
pointer
|
||||
vn-tooltip="Remove niche"
|
||||
|
|
|
|||
|
|
@ -63,9 +63,8 @@
|
|||
show-field="name"
|
||||
value-field="name">
|
||||
</vn-autocomplete>
|
||||
<vn-icon-button vn-none
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
<vn-icon-button
|
||||
vn-none
|
||||
vn-tooltip="Remove tag"
|
||||
icon="delete"
|
||||
ng-click="filter.tags.splice($index, 1)"
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
@import "./colors";
|
||||
@import "./variables";
|
||||
|
||||
vn-item-summary {
|
||||
p {
|
||||
|
|
@ -8,7 +8,7 @@ vn-item-summary {
|
|||
|
||||
.item-state {
|
||||
padding: .4em;
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
color: white;
|
||||
|
||||
p {
|
||||
|
|
|
|||
|
|
@ -65,8 +65,6 @@
|
|||
</vn-textfield>
|
||||
<vn-none>
|
||||
<vn-icon-button
|
||||
medium-grey
|
||||
margin-medium-v
|
||||
vn-tooltip="Remove tag"
|
||||
icon="delete"
|
||||
ng-click="model.remove($index)"
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
vn-dialog.modal-form {
|
||||
vn-horizontal.header{
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
h5{
|
||||
color: white;
|
||||
margin: 0 auto;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
@import "variables";
|
||||
|
||||
vn-order-catalog .catalog-header {
|
||||
border-color: $lines;
|
||||
border-bottom: 1px solid rgba($lines, 0.5);
|
||||
border-color: $color-spacer;
|
||||
border-bottom: 1px solid rgba($color-spacer, 0.5);
|
||||
|
||||
vn-one:first-child {
|
||||
padding-top: 2em;
|
||||
|
|
@ -11,6 +11,6 @@ vn-order-catalog .catalog-header {
|
|||
padding-top: 0.5em;
|
||||
}
|
||||
span {
|
||||
color: $secondary-font-color
|
||||
color: $color-font-secondary
|
||||
}
|
||||
}
|
||||
|
|
@ -5,8 +5,8 @@ vn-catalog-filter > div {
|
|||
& > .input {
|
||||
padding-left: $pad-medium;
|
||||
padding-right: $pad-medium;
|
||||
border-color: $lines;
|
||||
border-bottom: 1px solid rgba($lines, 0.5);
|
||||
border-color: $color-spacer;
|
||||
border-bottom: 1px solid rgba($color-spacer, 0.5);
|
||||
}
|
||||
.item-category {
|
||||
padding: $pad-small;
|
||||
|
|
@ -22,12 +22,12 @@ vn-catalog-filter > div {
|
|||
|
||||
& > vn-icon {
|
||||
padding: $pad-small;
|
||||
background-color: $secondary-font-color;
|
||||
background-color: $color-font-secondary;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
|
||||
&.active {
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
color: #FFF
|
||||
}
|
||||
& > i:before {
|
||||
|
|
|
|||
|
|
@ -53,7 +53,6 @@
|
|||
</vn-td>
|
||||
<vn-td ng-if="!$ctrl.order.isConfirmed">
|
||||
<vn-icon-button
|
||||
medium-grey
|
||||
vn-tooltip="Remove item"
|
||||
icon="delete"
|
||||
ng-click="$ctrl.showDeleteRow($index)"
|
||||
|
|
|
|||
|
|
@ -4,10 +4,10 @@
|
|||
<a translate-attr="{title: 'Return to module index'}" ui-sref="item.index">
|
||||
<vn-icon icon="chevron_left"></vn-icon>
|
||||
</a>
|
||||
<vn-icon icon="inbox"></vn-icon>
|
||||
<a translate-attr="{title: 'Preview'}" ui-sref="item.card.summary({id: $ctrl.item.id})">
|
||||
<vn-icon icon="desktop_windows"></vn-icon>
|
||||
</a>
|
||||
<vspan></span>
|
||||
</div>
|
||||
<div pad-medium>
|
||||
<vn-horizontal>
|
||||
|
|
@ -37,9 +37,15 @@
|
|||
<form name="form">
|
||||
<vn-horizontal
|
||||
ng-repeat="price in $ctrl.prices">
|
||||
<vn-one class="ellipsize text" title="{{::price.warehouse}}">{{::price.warehouse}}</vn-one>
|
||||
<vn-one
|
||||
class="ellipsize text"
|
||||
title="{{::price.warehouse}}">
|
||||
{{::price.warehouse}}
|
||||
</vn-one>
|
||||
<vn-one class="number text">
|
||||
<span orange ng-click="$ctrl.addQuantity(price)" class="link unselectable">{{::price.grouping}}</span><span> x {{::price.price | currency: 'EUR': 2}}</span>
|
||||
<span ng-click="$ctrl.addQuantity(price)"
|
||||
class="link unselectable">{{::price.grouping}}</span>
|
||||
<span> x {{::price.price | currency: 'EUR': 2}}</span>
|
||||
</vn-one>
|
||||
<vn-one>
|
||||
<vn-input-number
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@ vn-order-prices-popover {
|
|||
|
||||
vn-vertical.data{
|
||||
padding-right: 16px;
|
||||
border-right: 1px solid $main-01;
|
||||
border-right: 1px solid $color-main;
|
||||
}
|
||||
|
||||
vn-vertical.prices{
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
<td>
|
||||
<vn-icon
|
||||
ng-show="row.visible || row.available"
|
||||
orange
|
||||
color-main
|
||||
icon="warning"
|
||||
vn-tooltip="Visible: {{::row.visible || 0}} <br> {{::$ctrl.translate.instant('Available')}} {{::row.available || 0}}">
|
||||
</vn-icon>
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
|
||||
tpl-item{
|
||||
&.notActive {
|
||||
background-color: $main-bg;
|
||||
color: $secondary-font-color;
|
||||
background-color: $color-bg;
|
||||
color: $color-font-secondary;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -4,37 +4,37 @@ vn-ticket-index{
|
|||
vn-icon-menu{
|
||||
padding-top: 30px;
|
||||
padding-left: 10px;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
li {
|
||||
color: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.alert1 {
|
||||
background-color: $main-01-03;
|
||||
background-color: $color-main-light;
|
||||
&:hover {
|
||||
background-color: $main-01-05;
|
||||
background-color: $color-main-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.alertOk {
|
||||
background-color: $main-02-03;
|
||||
background-color: $color-success-light;
|
||||
&:hover {
|
||||
background-color: $main-02-05;
|
||||
background-color: $color-success-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.alertFree {
|
||||
background-color: $main-03-03;
|
||||
background-color: $color-notice-light;
|
||||
&:hover {
|
||||
background-color: $main-03-05;
|
||||
background-color: $color-notice-medium;
|
||||
}
|
||||
}
|
||||
|
||||
.alert0 {
|
||||
background-color: $alert-01-03;
|
||||
background-color: $color-alert-light;
|
||||
&:hover {
|
||||
background-color: $alert-01-05;
|
||||
background-color: $color-alert-medium;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -37,7 +37,6 @@
|
|||
<vn-auto pad-medium-top>
|
||||
<vn-icon
|
||||
pointer
|
||||
medium-grey
|
||||
vn-tooltip="Remove note"
|
||||
icon="delete"
|
||||
ng-click="model.remove($index)">
|
||||
|
|
|
|||
|
|
@ -40,8 +40,7 @@
|
|||
</vn-textfield>
|
||||
<vn-auto pad-medium-top>
|
||||
<vn-icon
|
||||
pointer
|
||||
medium-grey
|
||||
pointer
|
||||
vn-tooltip="Remove package"
|
||||
icon="delete"
|
||||
ng-click="model.remove($index)">
|
||||
|
|
|
|||
|
|
@ -80,14 +80,13 @@
|
|||
<a ui-sref="claim.card.basicData({id: sale.claim.claimFk})">
|
||||
<vn-icon
|
||||
ng-show="sale.claim.claimFk"
|
||||
orange
|
||||
icon="icon-claims"
|
||||
vn-tooltip="{{::$ctrl.$translate.instant('Claim')}}: {{::sale.claim.claimFk}}">
|
||||
</vn-icon>
|
||||
</a>
|
||||
<vn-icon
|
||||
ng-show="sale.visible || sale.available"
|
||||
orange
|
||||
color-main
|
||||
icon="warning"
|
||||
vn-tooltip="Visible: {{::sale.visible || 0}} <br> {{::$ctrl.$translate.instant('Available')}}: {{::sale.available || 0}}">
|
||||
</vn-icon>
|
||||
|
|
@ -254,7 +253,7 @@
|
|||
ng-click="$ctrl.linesToNewTicket()">
|
||||
</vn-button>
|
||||
<vn-icon
|
||||
medium-grey
|
||||
color-secondary
|
||||
vn-tooltip="You have to allow pop-ups in your web browser to use this functionality"
|
||||
icon="info">
|
||||
</vn-icon>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ vn-ticket-sale {
|
|||
}
|
||||
|
||||
vn-horizontal.header{
|
||||
background-color: $main-01;
|
||||
background-color: $color-main;
|
||||
h5{
|
||||
color: white;
|
||||
margin: 0 auto;
|
||||
|
|
@ -21,7 +21,7 @@ vn-ticket-sale {
|
|||
p.simulatorTitle{
|
||||
margin-bottom: 0px;
|
||||
font-size: 12px;
|
||||
color: $main-01;
|
||||
color: $color-main;
|
||||
}
|
||||
|
||||
vn-label-value{
|
||||
|
|
|
|||
|
|
@ -42,8 +42,7 @@
|
|||
</vn-autocomplete>
|
||||
<vn-auto pad-medium-top>
|
||||
<vn-icon
|
||||
pointer
|
||||
medium-grey
|
||||
pointer
|
||||
vn-tooltip="Remove service"
|
||||
icon="delete"
|
||||
ng-click="model.remove($index)">
|
||||
|
|
|
|||
|
|
@ -69,15 +69,13 @@
|
|||
<vn-td>
|
||||
<a ui-sref="claim.card.basicData({id: sale.claimBeginning.claimFk})">
|
||||
<vn-icon
|
||||
ng-show="sale.claimBeginning.claimFk"
|
||||
orange
|
||||
icon="icon-claims"
|
||||
vn-tooltip="{{::$ctrl.$translate.instant('Claim')}}: {{::sale.claimBeginning.claimFk}}">
|
||||
</vn-icon>
|
||||
</a>
|
||||
<vn-icon
|
||||
ng-show="sale.visible || sale.available"
|
||||
orange
|
||||
color-main
|
||||
icon="warning"
|
||||
vn-tooltip="Visible: {{::sale.visible || 0}} <br> {{::$ctrl.translate.instant('Available')}} {{::sale.available || 0}}">
|
||||
</vn-icon>
|
||||
|
|
|
|||
|
|
@ -6,12 +6,12 @@
|
|||
url="api/Workers"
|
||||
save="post">
|
||||
</vn-watcher>
|
||||
<form name="form" ng-submit="$ctrl.onSubmit()">
|
||||
<form name="form" ng-submit="$ctrl.onSubmit()" compact>
|
||||
<vn-card pad-large>
|
||||
<vn-vertical>
|
||||
<vn-horizontal>
|
||||
<vn-textfield
|
||||
vn-one
|
||||
vn-one
|
||||
label="Name"
|
||||
field="$ctrl.worker.firstName">
|
||||
</vn-textfield>
|
||||
|
|
|
|||
Loading…
Reference in New Issue