Skip to content

Commit

Permalink
fix(rcue): Addsmissed changes to RCUE sass files from patternfly#1049
Browse files Browse the repository at this point in the history 
Some RCUE sass files were not generated due to the timing of the rcue addition and modifications
made in patternfly#1049
  • Loading branch information
@jeff-phillips-18
jeff-phillips-18 committed May 18, 2018
1 parent 2c69ebf commit e2f0a56
Show file tree
Hide file tree
Showing 4 changed files with 150 additions and 93 deletions.
15 changes: 10 additions & 5 deletions src/sass/converted/rcue/_context-selector.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,13 @@
width: $contextselector-pf-bootstrap-select-width-desktop !important;
}
&.open {
background: $navbar-pf-navbar-primary-active-bg-color-stop;
> .dropdown-toggle {
color: $navbar-pf-vertical-active-color;
&,
&:hover,
&:focus {
background: $navbar-pf-item-open-bg-color;
color: $navbar-pf-item-active-color;
}
&:focus {
outline: 0 !important; // don't show restored focus ring when open
}
Expand All @@ -28,7 +32,6 @@
padding-left: $contextselector-pf-dropdown-toggle-padding-left;
padding-top: $contextselector-pf-dropdown-toggle-padding-top;
&:focus {
color: $navbar-pf-vertical-active-color;
// restore the focus ring
// Default
outline: thin dotted !important;
Expand All @@ -37,10 +40,12 @@
outline-offset: -2px !important;
}
&:hover {
background: $navbar-pf-navbar-primary-active-bg-color-stop;
color: $navbar-pf-vertical-active-color;
outline: 0 !important; // don't show restored focus ring when open
}
&:focus,
&:hover {
background-color: $navbar-pf-item-hover-bg-color;
}
.filter-option {
text-overflow: ellipsis;
}
Expand Down
41 changes: 29 additions & 12 deletions src/sass/converted/rcue/_navbar-vertical.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,24 +33,28 @@
max-height: ($navbar-pf-vertical-height - $navbar-pf-vertical-border-width); // to keep Firefox from oversizing icons
padding: $navbar-pf-vertical-nav-item-iconic-padding;
position: relative;
margin: 0;
border: 0;

&:hover {
outline: 0!important;
}

&:hover,
&:focus {
color: $navbar-pf-vertical-active-color;
background-color: transparent;
outline: thin dotted;
outline: 5px auto -webkit-focus-ring-color;
}

.caret,
.fa,
.glyphicon,
.pficon {
color: $navbar-pf-vertical-active-color;
}
&:hover,
&:focus {
background-color: $navbar-pf-item-hover-bg-color;
text-decoration: none;
}

.badge {
background-color: $notification-badge-color;
border-radius: 20px;
color: $navbar-pf-vertical-active-color;
color: $navbar-pf-item-active-color;
cursor: pointer;
font-size: ($font-size-base - 3);
font-weight: 700;
Expand All @@ -61,6 +65,7 @@
min-width: 10px;
min-height: 10px;
top: 18px;

&.badge-pf-bordered {
border: 1px solid $navbar-pf-vertical-bg-color;
}
Expand All @@ -71,25 +76,37 @@
.pficon {
color: $navbar-pf-vertical-color;
font-size: ($font-size-base + 4);
position: relative;
}

.caret {
font-size: $font-size-base;
width: auto;
}

> .dropdown-title {
position: relative;
display: inline-block;
line-height: 1.55;
}

> .pficon-user {
padding-right: calc($navbar-pf-item-icon-padding-right + 3px);
float: left;
}
}

.open > .nav-item-iconic {
&,
&:hover,
&:focus {
background: transparent;
background: $navbar-pf-item-open-bg-color;
color: $navbar-pf-item-active-color;

.caret,
.fa,
.pficon {
color: $navbar-pf-vertical-active-color;
color: $navbar-pf-item-active-color;
}
}
}
Expand Down
179 changes: 105 additions & 74 deletions src/sass/converted/rcue/_navbar.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,36 +29,53 @@
}
.navbar-nav {
margin: 0;
> .active > a,
> .active > a:hover,
> .active > a:focus {
background-color: $navbar-pf-navbar-nav-active-bg-color;
color: $navbar-pf-active-color;
> .active {
> a,
> button {
&,
&:hover,
&:focus {
background-color: $navbar-pf-item-open-bg-color;
color: $navbar-pf-active-color;
}
}
}
> li > a {
color: $navbar-pf-color;
line-height: 1;
padding: 10px 20px;
text-shadow: none;
&:hover,
&:focus {
color: $navbar-pf-active-color;
> li {
> a,
> button {
color: $navbar-pf-color;
line-height: 1;
padding: 10px 20px;
text-shadow: none;
&:hover,
&:focus {
color: $navbar-pf-active-color;
text-decoration: none;
}
> .dropdown-title,
> .pficon-user {
position: relative;
}
> .pficon-user {
padding-right: $navbar-pf-item-icon-padding-right;
}
}
}
> .open {
> a {
> a,
> button {
&,
&:hover,
&:focus {
background-color: $navbar-pf-navbar-nav-active-bg-color;
background-color: $navbar-pf-item-open-bg-color;
color: $navbar-pf-active-color;
}
}
}
.badge {
background-color: $notification-badge-color;
border-radius: 20px;
color: $navbar-pf-vertical-active-color;
color: $navbar-pf-item-active-color;
cursor: pointer;
font-size: ($font-size-base - 3);
font-weight: 700;
Expand Down Expand Up @@ -92,7 +109,7 @@
&,
&:hover,
&:focus {
background-color: $navbar-pf-navbar-nav-active-active-open-bg-color !important;
background-color: $navbar-pf-item-open-bg-color !important;
color: $navbar-pf-active-color;
}
}
Expand Down Expand Up @@ -276,13 +293,13 @@
}
.navbar-utility {
border-bottom: 1px solid $navbar-pf-navbar-header-border-color;
li.dropdown > .dropdown-toggle {
padding-left: 36px;
position: relative;
.pficon-user {
left: 20px;
position: absolute;
top: 10px;
li.dropdown {
> a,
> button {
&:hover {
outline: 0!important;
}
position: relative;
}
}
@media (max-width: $grid-float-breakpoint-max) {
Expand All @@ -298,9 +315,12 @@
.navbar-brand {
padding: $navbar-pf-navbar-navbar-brand-padding;
}
.navbar-nav > li > a {
padding-bottom: 14px;
padding-top: 14px;
.navbar-nav > li {
> a,
> button {
padding-bottom: 14px;
padding-top: 14px;
}
}
.navbar-persistent {
font-size: $font-size-large;
Expand Down Expand Up @@ -413,30 +433,36 @@
}
}
}
> li > a {
border-bottom: 1px solid transparent;
border-top: 1px solid transparent;
position: relative;
margin: -1px 0 0;
&:hover {
background-color: $navbar-pf-navbar-primary-hover-bg-color-stop;
border-top-color: $navbar-pf-navbar-primary-hover-border-color;
color: $navbar-pf-color;
@include gradient-vertical($navbar-pf-navbar-primary-hover-bg-color-start, $navbar-pf-navbar-primary-hover-bg-color-stop);
> li {
> a,
> button {
border-bottom: 1px solid transparent;
border-top: 1px solid transparent;
position: relative;
margin: -1px 0 0;
&:hover {
background-color: $navbar-pf-item-hover-bg-color;
border-top-color: $navbar-pf-navbar-primary-hover-border-color;
color: $navbar-pf-color;
@include gradient-vertical($navbar-pf-navbar-primary-hover-bg-color-start, $navbar-pf-navbar-primary-hover-bg-color-stop);
}
}
}
> .active > a,
> .active > a:hover,
> .active > a:focus,
> .open > a,
> .open > a:hover,
> .open > a:focus {
background-color: $navbar-pf-navbar-primary-active-bg-color-stop;
border-bottom-color: $navbar-pf-navbar-primary-active-bg-color-stop;
border-top-color: $navbar-pf-navbar-primary-active-border-color;
@include box-shadow(none);
color: $navbar-pf-active-color;
@include gradient-vertical($navbar-pf-navbar-primary-active-bg-color-start, $navbar-pf-navbar-primary-active-bg-color-stop);
> .active,
.open {
> a,
> button {
&,
&:hover,
&:focus {
background-color: $navbar-pf-item-open-bg-color;
border-bottom-color: $navbar-pf-navbar-primary-active-bg-color-stop;
border-top-color: $navbar-pf-navbar-primary-active-border-color;
@include box-shadow(none);
color: $navbar-pf-active-color;
@include gradient-vertical($navbar-pf-navbar-primary-active-bg-color-start, $navbar-pf-navbar-primary-active-bg-color-stop);
}
}
}
li.context {
&.context-bootstrap-select .filter-option {
Expand Down Expand Up @@ -473,37 +499,42 @@
}
.navbar-utility {
border-bottom: 0;
font-size: $font-size-small;
position: absolute;
right: 0;
top: 0;
> .active > a,
> .active > a:hover,
> .active > a:focus,
> .open > a,
> .open > a:hover,
> .open > a:focus {
background: $navbar-pf-navbar-utility-open-bg-color;
color: $navbar-pf-navbar-utility-color;
}
> li > a {
border-left: 1px solid $navbar-pf-navbar-utility-border-color;
color: $navbar-pf-navbar-utility-color !important;
padding: 7px 10px;
&:hover {
background: $navbar-pf-navbar-utility-hover-bg-color;
border-left-color: $navbar-pf-navbar-utility-hover-border-color;
> .active,
> .open {
> a,
> button {
&,
&:hover,
&:focus {
background: $navbar-pf-item-open-bg-color;
color: $navbar-pf-active-color;
}
}
}
> li.open > a {
border-left-color: $navbar-pf-navbar-utility-open-border-color;
color: $navbar-pf-active-color !important;
> li {
> a,
> button {
border: solid $navbar-pf-navbar-utility-border-color;
border-width: 0 0 0 1px;
color: $navbar-pf-navbar-utility-color !important;
padding: 7px 10px;
font-size: $font-size-small;
margin: 0;
&:hover {
background: $navbar-pf-item-hover-bg-color;
border-left-color: $navbar-pf-navbar-utility-hover-border-color;
outline: 0;
}
}
}
li.dropdown > .dropdown-toggle {
padding-left: 26px;
.pficon-user {
left: 10px;
top: 7px;
> li.open {
> a,
> button {
border-left-color: $navbar-pf-navbar-utility-open-border-color;
color: $navbar-pf-active-color !important;
}
}
.open .dropdown-menu {
Expand Down
8 changes: 6 additions & 2 deletions src/sass/converted/rcue/_variables.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -112,11 +112,15 @@ $navbar-pf-border-color: $color-pf-bl
$navbar-pf-color: $color-pf-black-300 !default;
$navbar-pf-height: 60px !default;
$navbar-pf-icon-bar-bg-color: $color-pf-white !default;
$navbar-pf-item-hover-bg-color: rgba(255, 255, 255, .14) !default;
$navbar-pf-item-open-bg-color: rgba(255, 255, 255, .24) !default;
$navbar-pf-item-active-color: $color-pf-white !default;
$navbar-pf-item-icon-padding-right: 4px !default;
$navbar-pf-navbar-navbar-brand-min-width: 270px !default;
$navbar-pf-navbar-navbar-brand-padding: 8px 0 7px !default;
$navbar-pf-navbar-navbar-persistent-bg-color: $color-pf-black-150 !default;
$navbar-pf-navbar-navbar-persistent-border-color: $color-pf-black-300 !default;
$navbar-pf-vertical-active-color: $color-pf-white !default;
$navbar-pf-vertical-active-color: $navbar-pf-item-active-color !default;
$navbar-pf-vertical-bg-color: #1d1d1d !default;
$navbar-pf-vertical-bg-repeat: no-repeat !default;
$navbar-pf-vertical-bg-size: auto 100% !default;
Expand All @@ -140,10 +144,10 @@ $navbar-pf-vertical-navbar-toggle-icon-bar-hover-bg: $color-pf-wh
$navbar-pf-vertical-nav-item-iconic-padding: 21px 12px !default;
$nav-pf-container-transition-period: 250ms !default;
$nav-pf-menu-transition-period: 100ms !default;
$nav-pf-vertical-active-color: $color-pf-white !default;
$nav-pf-vertical-active-before-color: $color-pf-blue-300 !default;
$nav-pf-vertical-active-bg-color: $color-pf-black-800 !default;
$nav-pf-vertical-active-border-color: $color-pf-black-900 !default;
$nav-pf-vertical-active-color: $color-pf-white !default;
$nav-pf-vertical-active-font-weight: 600 !default;
$nav-pf-vertical-active-icon-color: $color-pf-blue-300 !default;
$nav-pf-vertical-badge-color: $color-pf-white !default;
Expand Down

0 comments on commit e2f0a56

Please sign in to comment.