modified buttons in header
This commit is contained in:
parent
31dcb2fe3e
commit
5c05c0f1e3
File diff suppressed because one or more lines are too long
|
@ -63,13 +63,15 @@ button,.button {
|
||||||
border-color: $anchor-color;
|
border-color: $anchor-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.hero-middle,&.hero-last,&.hero-announcement{
|
}
|
||||||
|
.hero-middle,.hero-last,.hero-announcement{
|
||||||
:not(.search-form),:not(.search){
|
:not(.search-form),:not(.search){
|
||||||
button,.button {
|
button,.button {
|
||||||
font-size: $global-font-size;
|
font-size: $global-font-size;
|
||||||
border-color: $white;
|
border-color: $white;
|
||||||
padding: $global-padding $global-padding*2;
|
padding: $global-padding $global-padding*2;
|
||||||
min-width: unset;
|
min-width: unset;
|
||||||
|
color:$white;
|
||||||
&:hover{
|
&:hover{
|
||||||
color: scale-color($anchor-color, $lightness: 90%);
|
color: scale-color($anchor-color, $lightness: 90%);
|
||||||
background-color: scale-color($white, $alpha: -60%);
|
background-color: scale-color($white, $alpha: -60%);
|
||||||
|
@ -77,7 +79,6 @@ button,.button {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.search {
|
.search {
|
||||||
.button {
|
.button {
|
||||||
|
|
|
@ -304,6 +304,7 @@ main {
|
||||||
}
|
}
|
||||||
&.widget_media_image {
|
&.widget_media_image {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
// max-height: 40vh;
|
||||||
img {
|
img {
|
||||||
width:100%;
|
width:100%;
|
||||||
}
|
}
|
||||||
|
@ -313,7 +314,6 @@ main {
|
||||||
&.widget_text p{
|
&.widget_text p{
|
||||||
max-width: 50rem;
|
max-width: 50rem;
|
||||||
margin:auto;
|
margin:auto;
|
||||||
padding: $global-padding * 2;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include breakpoint(large){
|
@include breakpoint(large){
|
||||||
|
@ -323,7 +323,9 @@ main {
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
&.widget_text p{
|
&.widget_text p{
|
||||||
font-size: $global-font-size*1.2;
|
font-size: $global-font-size*1.2;
|
||||||
padding: $global-padding * 2;
|
}
|
||||||
|
&.widget_media_image {
|
||||||
|
// max-height: unset;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include breakpoint(xlarge){
|
@include breakpoint(xlarge){
|
||||||
|
@ -355,11 +357,11 @@ main {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.secondary {
|
// &.secondary {
|
||||||
.slide,.slide:nth-child(odd) {
|
// .slide,.slide:nth-child(odd) {
|
||||||
background-color: $white;
|
// background-color: $white;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
&.announcement {
|
&.announcement {
|
||||||
.slide {
|
.slide {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -381,13 +383,13 @@ main {
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.top.secondary {
|
// &.top.secondary {
|
||||||
align-content: center;
|
// align-content: center;
|
||||||
justify-content: center;
|
// justify-content: center;
|
||||||
ul {
|
// ul {
|
||||||
margin: 2rem 0;
|
// margin: 2rem 0;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
aside {
|
aside {
|
||||||
@include xy-grid();
|
@include xy-grid();
|
||||||
|
@ -416,28 +418,47 @@ main {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//hero secondary
|
//hero secondary
|
||||||
&.secondary {
|
// &.secondary {
|
||||||
border-top: none;
|
// border-top: none;
|
||||||
background-color: $secondary-color;
|
// background-color: $secondary-color;
|
||||||
.slide{
|
// .slide{
|
||||||
figure {
|
// figure {
|
||||||
background-color: unset;
|
// background-color: unset;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
.hero-main {
|
.hero-main {
|
||||||
// aside {
|
.slide {
|
||||||
// background-color: $secondary-color;
|
@include breakpoint(medium){
|
||||||
.slides {
|
&.widget_media_image {
|
||||||
|
max-height: 35vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@include breakpoint(large){
|
||||||
|
&.widget_media_image {
|
||||||
|
max-height: unset;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
aside {
|
||||||
background-color: $secondary-color;
|
background-color: $secondary-color;
|
||||||
|
.slides {
|
||||||
|
// &.top.secondary {
|
||||||
|
align-content: center;
|
||||||
|
justify-content: center;
|
||||||
|
ul {
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
// }
|
||||||
|
// background-color: $secondary-color;
|
||||||
.slide {
|
.slide {
|
||||||
&:nth-child(odd) {
|
&:nth-child(odd) {
|
||||||
background-color: $secondary-color;
|
background-color: $secondary-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// }
|
}
|
||||||
}
|
}
|
||||||
.hero-middle{
|
.hero-middle{
|
||||||
.slides {
|
.slides {
|
||||||
|
|
|
@ -53,20 +53,45 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include breakpoint(large) {
|
@include breakpoint(medium) {
|
||||||
@include xy-cell(auto);
|
@include xy-cell(auto);
|
||||||
@include flex;
|
@include flex;
|
||||||
@include flex-align(right, middle);
|
// @include flex-align(right, middle);
|
||||||
padding-bottom: 0;//$global-padding;
|
padding-bottom: 0;//$global-padding;
|
||||||
menu {
|
menu {
|
||||||
margin: inherit;
|
margin: inherit;
|
||||||
padding: inherit;
|
padding: inherit;
|
||||||
|
// padding-bottom:0;
|
||||||
.menu {
|
.menu {
|
||||||
&.dropdown {
|
&.dropdown {
|
||||||
justify-content: end;
|
justify-content: end;
|
||||||
|
li,.button {
|
||||||
|
font-size: $global-font-size*1.1;//$header-menu-font-size;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
margin-left: $global-margin/2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@include breakpoint(xlarge) {
|
||||||
|
// @include xy-cell(auto);
|
||||||
|
// @include flex;
|
||||||
|
@include flex-align(right, middle);
|
||||||
|
padding-bottom: 0;//$global-padding;
|
||||||
|
menu {
|
||||||
|
// margin: inherit;
|
||||||
|
// padding: inherit;
|
||||||
|
.menu {
|
||||||
|
&.dropdown {
|
||||||
|
// justify-content: end;
|
||||||
li,.button {
|
li,.button {
|
||||||
font-size: $global-font-size*1.4;//$header-menu-font-size;
|
font-size: $global-font-size*1.4;//$header-menu-font-size;
|
||||||
}
|
}
|
||||||
|
.button {
|
||||||
|
margin-left: $global-margin;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -63,13 +63,15 @@ button,.button {
|
||||||
border-color: $anchor-color;
|
border-color: $anchor-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.hero-middle,&.hero-last,&.hero-announcement{
|
}
|
||||||
|
.hero-middle,.hero-last,.hero-announcement{
|
||||||
:not(.search-form),:not(.search){
|
:not(.search-form),:not(.search){
|
||||||
button,.button {
|
button,.button {
|
||||||
font-size: $global-font-size;
|
font-size: $global-font-size;
|
||||||
border-color: $white;
|
border-color: $white;
|
||||||
padding: $global-padding $global-padding*2;
|
padding: $global-padding $global-padding*2;
|
||||||
min-width: unset;
|
min-width: unset;
|
||||||
|
color:$white;
|
||||||
&:hover{
|
&:hover{
|
||||||
color: scale-color($anchor-color, $lightness: 90%);
|
color: scale-color($anchor-color, $lightness: 90%);
|
||||||
background-color: scale-color($white, $alpha: -60%);
|
background-color: scale-color($white, $alpha: -60%);
|
||||||
|
@ -77,7 +79,6 @@ button,.button {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.search {
|
.search {
|
||||||
.button {
|
.button {
|
||||||
|
|
|
@ -304,6 +304,7 @@ main {
|
||||||
}
|
}
|
||||||
&.widget_media_image {
|
&.widget_media_image {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
// max-height: 40vh;
|
||||||
img {
|
img {
|
||||||
width:100%;
|
width:100%;
|
||||||
}
|
}
|
||||||
|
@ -313,7 +314,6 @@ main {
|
||||||
&.widget_text p{
|
&.widget_text p{
|
||||||
max-width: 50rem;
|
max-width: 50rem;
|
||||||
margin:auto;
|
margin:auto;
|
||||||
padding: $global-padding * 2;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include breakpoint(large){
|
@include breakpoint(large){
|
||||||
|
@ -323,7 +323,9 @@ main {
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
&.widget_text p{
|
&.widget_text p{
|
||||||
font-size: $global-font-size*1.2;
|
font-size: $global-font-size*1.2;
|
||||||
padding: $global-padding * 2;
|
}
|
||||||
|
&.widget_media_image {
|
||||||
|
// max-height: unset;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include breakpoint(xlarge){
|
@include breakpoint(xlarge){
|
||||||
|
@ -355,11 +357,11 @@ main {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.secondary {
|
// &.secondary {
|
||||||
.slide,.slide:nth-child(odd) {
|
// .slide,.slide:nth-child(odd) {
|
||||||
background-color: $white;
|
// background-color: $white;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
&.announcement {
|
&.announcement {
|
||||||
.slide {
|
.slide {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -381,13 +383,13 @@ main {
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.top.secondary {
|
// &.top.secondary {
|
||||||
align-content: center;
|
// align-content: center;
|
||||||
justify-content: center;
|
// justify-content: center;
|
||||||
ul {
|
// ul {
|
||||||
margin: 2rem 0;
|
// margin: 2rem 0;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
aside {
|
aside {
|
||||||
@include xy-grid();
|
@include xy-grid();
|
||||||
|
@ -416,28 +418,47 @@ main {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//hero secondary
|
//hero secondary
|
||||||
&.secondary {
|
// &.secondary {
|
||||||
border-top: none;
|
// border-top: none;
|
||||||
background-color: $secondary-color;
|
// background-color: $secondary-color;
|
||||||
.slide{
|
// .slide{
|
||||||
figure {
|
// figure {
|
||||||
background-color: unset;
|
// background-color: unset;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
}
|
}
|
||||||
.hero-main {
|
.hero-main {
|
||||||
// aside {
|
.slide {
|
||||||
// background-color: $secondary-color;
|
@include breakpoint(medium){
|
||||||
.slides {
|
&.widget_media_image {
|
||||||
|
max-height: 35vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@include breakpoint(large){
|
||||||
|
&.widget_media_image {
|
||||||
|
max-height: unset;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
aside {
|
||||||
background-color: $secondary-color;
|
background-color: $secondary-color;
|
||||||
|
.slides {
|
||||||
|
// &.top.secondary {
|
||||||
|
align-content: center;
|
||||||
|
justify-content: center;
|
||||||
|
ul {
|
||||||
|
margin: 2rem 0;
|
||||||
|
}
|
||||||
|
// }
|
||||||
|
// background-color: $secondary-color;
|
||||||
.slide {
|
.slide {
|
||||||
&:nth-child(odd) {
|
&:nth-child(odd) {
|
||||||
background-color: $secondary-color;
|
background-color: $secondary-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// }
|
}
|
||||||
}
|
}
|
||||||
.hero-middle{
|
.hero-middle{
|
||||||
.slides {
|
.slides {
|
||||||
|
|
|
@ -53,20 +53,45 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@include breakpoint(large) {
|
@include breakpoint(medium) {
|
||||||
@include xy-cell(auto);
|
@include xy-cell(auto);
|
||||||
@include flex;
|
@include flex;
|
||||||
@include flex-align(right, middle);
|
// @include flex-align(right, middle);
|
||||||
padding-bottom: 0;//$global-padding;
|
padding-bottom: 0;//$global-padding;
|
||||||
menu {
|
menu {
|
||||||
margin: inherit;
|
margin: inherit;
|
||||||
padding: inherit;
|
padding: inherit;
|
||||||
|
// padding-bottom:0;
|
||||||
.menu {
|
.menu {
|
||||||
&.dropdown {
|
&.dropdown {
|
||||||
justify-content: end;
|
justify-content: end;
|
||||||
|
li,.button {
|
||||||
|
font-size: $global-font-size*1.1;//$header-menu-font-size;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
margin-left: $global-margin/2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@include breakpoint(xlarge) {
|
||||||
|
// @include xy-cell(auto);
|
||||||
|
// @include flex;
|
||||||
|
@include flex-align(right, middle);
|
||||||
|
padding-bottom: 0;//$global-padding;
|
||||||
|
menu {
|
||||||
|
// margin: inherit;
|
||||||
|
// padding: inherit;
|
||||||
|
.menu {
|
||||||
|
&.dropdown {
|
||||||
|
// justify-content: end;
|
||||||
li,.button {
|
li,.button {
|
||||||
font-size: $global-font-size*1.4;//$header-menu-font-size;
|
font-size: $global-font-size*1.4;//$header-menu-font-size;
|
||||||
}
|
}
|
||||||
|
.button {
|
||||||
|
margin-left: $global-margin;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue