Skip to content
Permalink
Browse files

fix(toolbar): wrong primary button appearance in Material

  • Loading branch information...
joneff committed Apr 9, 2019
1 parent f1814aa commit 21af3665af31f57f49788767dcf7ed5cced82b0e
Showing with 11 additions and 39 deletions.
  1. +5 −35 packages/default/scss/toolbar/_theme.scss
  2. +6 −4 packages/material/scss/toolbar/_theme.scss
@@ -1,10 +1,3 @@
// Toolbar button types
// null - default buttons type
// thin - flat buttons appearance in the normal state and normal buttons appearance in other states
// flat - flat buttons type
// outline - outline buttons type
$toolbar-button-mode: flat !default;

@include exports("toolbar/theme") {

// Theme
@@ -18,29 +11,6 @@ $toolbar-button-mode: flat !default;
background-clip: border-box;
}

// Button normal state
@if $toolbar-button-mode == thin {
> .k-button,
> .k-button-group > .k-button {

&:not(:hover):not(.k-state-hover):not(:active):not(.k-state-active) {
color: inherit;
border-color: transparent;
background: none;
}
}

} @else if $toolbar-button-mode == flat {
> .k-button:not(.k-overflow-anchor),
> .k-button-group > .k-button {
@extend .k-button.k-flat;
}
} @else if $toolbar-button-mode == outline {
> .k-button,
> .k-button-group > .k-button {
@extend .k-button.k-outline;
}
}

//SplitButton
.k-split-button {
@@ -81,12 +51,15 @@ $toolbar-button-mode: flat !default;
}
}


// Overflow anchor
.k-overflow-anchor {
border-width: 0;
color: inherit;
background: transparent;
}


// Expanded state
.k-state-border-up,
.k-state-border-down {
@@ -99,11 +72,13 @@ $toolbar-button-mode: flat !default;
}
}


// Separator
.k-separator {
border-color: $toolbar-separator-border;
}


// Button disabled state
.k-button.k-state-disabled {
&::after {
@@ -115,11 +90,6 @@ $toolbar-button-mode: flat !default;
// Button group
.k-button-group {}

// Overflow anchor
.k-overflow-anchor {
border-width: 0;
}

}

}
@@ -3,18 +3,20 @@
@include exports("toolbar/theme/material") {

.k-toolbar {
@include appearance( toolbar );

background-color: $toolbar-bg;

.k-dropdown-button,
.k-split-button,
.k-button {
.k-dropdown-button:not(.k-primary),
.k-split-button:not(.k-primary),
.k-button:not(.k-primary) {
background-color: initial;
}

.k-button.k-state-disabled,
.k-state-disabled > .k-button {
color: $button-disabled-text;
// TODO: this we need to rework the buttons
background-color: transparent !important; // sass-lint:disable-line no-important
}

// Split button

0 comments on commit 21af366

Please sign in to comment.
You can’t perform that action at this time.