Vmeda.Online/src/app/app.md.scss

100 lines
3.1 KiB
SCSS
Raw Normal View History

2017-12-18 09:48:04 +00:00
.button-md {
min-height: $button-md-height;
}
// Light buttons color.
.button-md-light {
color: color($colors, primary, base);
}
2017-12-29 17:05:52 +00:00
.col[align-self-stretch] .card-md {
height: calc(100% - #{($card-md-margin-end + $card-md-margin-start)});
}
2017-12-28 11:55:54 +00:00
.bar-buttons core-context-menu .button-clear-md {
color: $toolbar-md-button-color;
}
2018-01-24 10:35:49 +00:00
.item-md ion-spinner[item-start] + .item-inner,
.item-md ion-spinner[item-start] + .item-input {
@include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2) - 1, null);
}
2018-01-24 14:39:05 +00:00
@each $color-name, $color-base, $color-contrast in get-colors($colors-md) {
.md .core-#{$color-name}-card {
@extend .card-md;
@extend .card-content-md;
}
}
2018-01-31 08:12:59 +00:00
.md .core-avoid-header ion-content {
top: $navbar-md-height;
height: calc(100% - #{($navbar-md-height)});
}
2017-12-18 09:48:04 +00:00
// Highlights inside the input element.
2017-12-29 12:47:00 +00:00
@if ($core-text-input-md-show-highlight) {
2017-12-18 09:48:04 +00:00
.card-md, .list-md {
// In order to get a 2px border we need to add an inset
// box-shadow 1px (this is to avoid the div resizing)
// The last item in a list has a border on the item, not the
// inner item, so add it to the item itself
.item-input.item-input-has-focus:last-child,
.item-input.input-has-focus:last-child {
@include md-input-highlight($text-input-md-highlight-color);
.item-inner ion-input {
box-shadow: none;
}
}
.item-input.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child,
.item-input.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus):last-child {
@include md-input-highlight($text-input-md-highlight-color-valid);
.item-inner ion-input {
box-shadow: none;
}
}
.item-input.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus):last-child {
@include md-input-highlight($text-input-md-highlight-color-invalid);
.item-inner ion-input {
box-shadow: none;
}
}
}
.item-md.item-input {
.item-inner {
border: 0;
}
&.item-block .item-inner ion-input {
border-bottom: 1px solid $list-border-color;
}
// TODO remove all uses of input-has-focus in v4
&.item-input-has-focus .item-inner ion-input,
&.input-has-focus .item-inner ion-input {
@include md-input-highlight($text-input-md-highlight-color);
}
// Show the valid highlight when it has the .ng-valid class and a value
// TODO remove all uses of input-has-focus in v4
// TODO remove all uses of input-has-value in v4
&.ng-valid.item-input-has-value:not(.input-has-focus):not(.item-input-has-focus) .item-inner ion-input,
&.ng-valid.input-has-value:not(.input-has-focus):not(.item-input-has-focus) .item-inner ion-input {
@include md-input-highlight($text-input-md-highlight-color-valid);
}
// Show the invalid highlight when it has the invalid class and has been touched
&.ng-invalid.ng-touched:not(.input-has-focus):not(.item-input-has-focus) .item-inner ion-input {
@include md-input-highlight($text-input-md-highlight-color-invalid);
}
}
2017-12-28 11:55:54 +00:00
}