resources submenus and tags adjustments
This commit is contained in:
parent
d36c307f52
commit
647ffc36d4
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -181,6 +181,7 @@ $paragraph-text-rendering: optimizeLegibility;
|
|||
$enable-code-inline: true;
|
||||
$anchor-color: $primary-color;
|
||||
$anchor-color-hover: $primary-color;//scale-color($anchor-color, $lightness: -14%);
|
||||
$anchor-color-alt: scale-color($anchor-color, $lightness: 50%);
|
||||
$anchor-text-decoration: none;
|
||||
$anchor-text-decoration-hover: none;
|
||||
$hr-width: $global-width;
|
||||
|
|
|
|||
|
|
@ -25,8 +25,8 @@
|
|||
//@include foundation-switch;
|
||||
@include foundation-table;
|
||||
// Basic components
|
||||
@include foundation-badge;
|
||||
@include foundation-breadcrumbs;
|
||||
// @include foundation-badge;
|
||||
// @include foundation-breadcrumbs;
|
||||
@include foundation-callout;
|
||||
@include foundation-card;
|
||||
@include foundation-dropdown;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
button,.button {
|
||||
min-width: 20rem;
|
||||
// min-width: 20rem;
|
||||
}
|
||||
.hero {
|
||||
button,.button {
|
||||
|
|
|
|||
|
|
@ -4,38 +4,38 @@
|
|||
|
||||
/** === Includes === */
|
||||
|
||||
@charset 'utf-8';
|
||||
|
||||
@import 'settings';
|
||||
@import 'foundation';
|
||||
|
||||
@include foundation-typography;
|
||||
@include foundation-button;
|
||||
@include foundation-table;
|
||||
// @charset 'utf-8';
|
||||
//
|
||||
// @import 'settings';
|
||||
// @import 'foundation';
|
||||
//
|
||||
// @include foundation-typography;
|
||||
// @include foundation-button;
|
||||
// @include foundation-table;
|
||||
|
||||
|
||||
/** === Content Width === */
|
||||
.wp-block {
|
||||
width: calc(100vw - (2 * 10));
|
||||
@each $breakpoint, $size in $grid-margin-gutters {
|
||||
|
||||
@include breakpoint($breakpoint) {
|
||||
width: calc(100vw - ($size));
|
||||
}
|
||||
|
||||
}
|
||||
// width: calc(100vw - (2 * 10));
|
||||
// @each $breakpoint, $size in $grid-margin-gutters {
|
||||
//
|
||||
// @include breakpoint($breakpoint) {
|
||||
// width: calc(100vw - ($size));
|
||||
// }
|
||||
//
|
||||
// }
|
||||
}
|
||||
|
||||
/** === Base Typography === */
|
||||
body {
|
||||
font-size: $global-font-size;
|
||||
font-family: $body-font-family;
|
||||
color: $body-font-color;
|
||||
// font-size: $global-font-size;
|
||||
// font-family: $body-font-family;
|
||||
// color: $body-font-color;
|
||||
}
|
||||
|
||||
/** === Post Title === */
|
||||
.editor-post-title__block .editor-post-title__input{
|
||||
@extend h1;
|
||||
// @extend h1;
|
||||
}
|
||||
|
||||
/** === Button === */
|
||||
|
|
@ -43,17 +43,17 @@ body {
|
|||
|
||||
// add general foundation button styling to button in editor
|
||||
.wp-block-button__link {
|
||||
@extend .button;
|
||||
// @extend .button;
|
||||
}
|
||||
|
||||
// add special styling for squared buttons
|
||||
&.is-style-squared .wp-block-button__link {
|
||||
border-radius: 0;
|
||||
// border-radius: 0;
|
||||
}
|
||||
|
||||
// add outline styles
|
||||
&.is-style-outline .wp-block-button__link{
|
||||
@extend .hollow;
|
||||
// @extend .hollow;
|
||||
}
|
||||
|
||||
// set transparent background to block for outline button
|
||||
|
|
@ -61,26 +61,26 @@ body {
|
|||
&.is-style-outline:hover,
|
||||
&.is-style-outline:focus,
|
||||
&.is-style-outline:active {
|
||||
background: transparent;
|
||||
// background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
/** === File === */
|
||||
.wp-block-file__button{
|
||||
@include button();
|
||||
// @include button();
|
||||
}
|
||||
|
||||
/** === Pullquote === */
|
||||
.wp-block-paragraph.has-background{
|
||||
padding: rem-calc(20px 30px);
|
||||
// padding: rem-calc(20px 30px);
|
||||
}
|
||||
|
||||
/** === Table === */
|
||||
.wp-block-table td{
|
||||
border: none;
|
||||
// border: none;
|
||||
}
|
||||
|
||||
/** === Latest Posts grid view === */
|
||||
.wp-block-latest-posts.is-grid{
|
||||
list-style: none;
|
||||
// list-style: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,11 +6,11 @@ Frontend styles for gutenberg blocks
|
|||
@each $color, $code in $foundation-palette {
|
||||
|
||||
.has-#{$color}-background-color {
|
||||
background-color: $code;
|
||||
// background-color: $code;
|
||||
}
|
||||
|
||||
.has-#{$color}-color {
|
||||
color: $code;
|
||||
// color: $code;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -19,27 +19,27 @@ Frontend styles for gutenberg blocks
|
|||
|
||||
// add general foundation button styling
|
||||
.wp-block-button__link {
|
||||
@extend .button;
|
||||
// @extend .button;
|
||||
@each $color, $code in $foundation-palette {
|
||||
|
||||
&.has-#{$color}-background-color {
|
||||
background-color: $code;
|
||||
// background-color: $code;
|
||||
}
|
||||
|
||||
&.has-#{$color}-color {
|
||||
color: $code;
|
||||
// color: $code;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// add special styling for squared buttons
|
||||
&.is-style-squared .wp-block-button__link {
|
||||
border-radius: 0;
|
||||
// border-radius: 0;
|
||||
}
|
||||
|
||||
// add outline styles
|
||||
&.is-style-outline .wp-block-button__link{
|
||||
@extend .hollow;
|
||||
// @extend .hollow;
|
||||
}
|
||||
|
||||
// set transparent background to block for outline button
|
||||
|
|
@ -56,10 +56,10 @@ Frontend styles for gutenberg blocks
|
|||
|
||||
/** === File === */
|
||||
.wp-block-file .wp-block-file__button{
|
||||
@include button();
|
||||
// @include button();
|
||||
}
|
||||
|
||||
/** === Image === */
|
||||
.wp-block-image {
|
||||
margin: 0;
|
||||
// margin: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,26 +19,3 @@
|
|||
font-face: worksans-mediumitalic, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// mods on fonts and typography
|
||||
// not in foundation variables
|
||||
// -----------------------------
|
||||
|
||||
//h1,h2,h3,h4,h5,h6,
|
||||
//.h1,.h2,.h3,.h4,.h4,.h5,.h6,
|
||||
//button,.button,
|
||||
//header nav,
|
||||
//.hero .claim
|
||||
//{
|
||||
// font-variant:all-small-caps;
|
||||
//}
|
||||
//
|
||||
//
|
||||
//h1,h2,h3,h4,h5,h6,
|
||||
//.h1,.h2,.h3,.h4,.h4,.h5,.h6 {
|
||||
// a {
|
||||
// color: $black;
|
||||
// }
|
||||
//}
|
||||
|
|
|
|||
|
|
@ -360,75 +360,6 @@ main {
|
|||
width: auto;
|
||||
overflow: visible;
|
||||
}
|
||||
.widget_tag_cloud {
|
||||
position: relative;
|
||||
margin-left: $global-margin;
|
||||
$tags-background-color: scale-color($anchor-color, $lightness: 95%);
|
||||
a {
|
||||
display: inline;
|
||||
color: $black;
|
||||
&:before, &:after {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
h6 {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
&:before {
|
||||
content: '#tags';
|
||||
color: $primary-color;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
}
|
||||
&:hover{
|
||||
.tagcloud {
|
||||
top: 1.6rem;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
background-color: rgba(255,255,255,0.1);
|
||||
@include breakpoint(small){
|
||||
width: 80vw;
|
||||
right: -1rem;
|
||||
text-align: right;
|
||||
}
|
||||
@include breakpoint(medium){
|
||||
width: 90vw;
|
||||
right: -15vw;
|
||||
}
|
||||
@include breakpoint(large){
|
||||
width: 90vw;
|
||||
right: -25vw;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.tagcloud {
|
||||
position: absolute;
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
transition: transform 0.5s,background-color 0.5s;
|
||||
transform: translateY(-$global-padding);
|
||||
background-color: $tags-background-color;
|
||||
padding: $global-padding;
|
||||
a {
|
||||
display: inline-block;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
font-size: $global-font-size * 0.7 !important;
|
||||
&:before {
|
||||
content: '#';
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
color: $anchor-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.top.secondary {
|
||||
align-content: center;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
.widget_nav_menu {
|
||||
.widget_nav_menu {
|
||||
.menu-resources-menu-container {
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -13,15 +13,24 @@
|
|||
color: $black;
|
||||
justify-content: left !important;
|
||||
}
|
||||
.is-active > a {
|
||||
background: unset;
|
||||
color: scale-color($anchor-color, $saturation: -50%, $lightness: 50%)
|
||||
}
|
||||
width:auto;
|
||||
li.menu-item-has-children {
|
||||
> a {
|
||||
&:after {
|
||||
content:'+';
|
||||
margin-left:auto;
|
||||
padding-left: $global-padding/2;
|
||||
display: inline-block;
|
||||
color: scale-color($anchor-color, $lightness: 85%);
|
||||
display:block;
|
||||
width:0;
|
||||
height:0;
|
||||
border:inset 6px;
|
||||
content:'';
|
||||
border-bottom-width:0;
|
||||
border-top-style:solid;
|
||||
border-color: $anchor-color-alt transparent transparent transparent;
|
||||
margin-top: 0px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
ul.sub-menu {
|
||||
|
|
@ -32,14 +41,24 @@
|
|||
top:0;
|
||||
margin:0;
|
||||
padding:0;
|
||||
width: 100%;
|
||||
width: auto;
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
transition: transform 0.5s;
|
||||
transform: translateY(-$global-padding);
|
||||
li.menu-item-has-children {
|
||||
> a {
|
||||
&:after {
|
||||
border-bottom-width: 6px;
|
||||
border-right-width: 0;
|
||||
border-right-style:solid;
|
||||
border-color: transparent transparent transparent $anchor-color-alt;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
background-color: scale-color($anchor-color, $lightness: 98%);
|
||||
> a {
|
||||
color: scale-color($anchor-color, $lightness: 50%);
|
||||
&:after {
|
||||
|
|
@ -51,6 +70,9 @@
|
|||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
&:hover {
|
||||
background-color: scale-color($anchor-color, $lightness: 98%);
|
||||
}
|
||||
ul.sub-menu {
|
||||
top: 0%;
|
||||
left: 100%;
|
||||
|
|
@ -60,6 +82,77 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.widget_tag_cloud {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
margin-left: $global-margin;
|
||||
$tags-background-color: scale-color($anchor-color, $lightness: 95%);
|
||||
a {
|
||||
display: inline;
|
||||
color: $black;
|
||||
&:before, &:after {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
h6 {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
&:before {
|
||||
content: '#tags';
|
||||
color: $primary-color;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
}
|
||||
&:hover{
|
||||
.tagcloud {
|
||||
top: 1.6rem;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
background-color: scale-color($tags-background-color, $alpha: -100%);
|
||||
@include breakpoint(small){
|
||||
width: 80vw;
|
||||
right: -1rem;
|
||||
text-align: right;
|
||||
}
|
||||
@include breakpoint(medium){
|
||||
width: 90vw;
|
||||
right: -15vw;
|
||||
text-align: center;
|
||||
}
|
||||
@include breakpoint(large){
|
||||
width: 90vw;
|
||||
right: -25vw;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.tagcloud {
|
||||
position: absolute;
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
transition: transform 0.5s,background-color 0.5s;
|
||||
transform: translateY(-$global-padding);
|
||||
background-color: $tags-background-color;
|
||||
padding: $global-padding;
|
||||
a {
|
||||
display: inline-block !important;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
font-size: $global-font-size * 0.7 !important;
|
||||
&:before {
|
||||
content: '#';
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
color: $anchor-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@include breakpoint(small){
|
||||
}
|
||||
@include breakpoint(medium){
|
||||
|
|
|
|||
|
|
@ -181,6 +181,7 @@ $paragraph-text-rendering: optimizeLegibility;
|
|||
$enable-code-inline: true;
|
||||
$anchor-color: $primary-color;
|
||||
$anchor-color-hover: $primary-color;//scale-color($anchor-color, $lightness: -14%);
|
||||
$anchor-color-alt: scale-color($anchor-color, $lightness: 50%);
|
||||
$anchor-text-decoration: none;
|
||||
$anchor-text-decoration-hover: none;
|
||||
$hr-width: $global-width;
|
||||
|
|
|
|||
|
|
@ -25,8 +25,8 @@
|
|||
//@include foundation-switch;
|
||||
@include foundation-table;
|
||||
// Basic components
|
||||
@include foundation-badge;
|
||||
@include foundation-breadcrumbs;
|
||||
// @include foundation-badge;
|
||||
// @include foundation-breadcrumbs;
|
||||
@include foundation-callout;
|
||||
@include foundation-card;
|
||||
@include foundation-dropdown;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
button,.button {
|
||||
min-width: 20rem;
|
||||
// min-width: 20rem;
|
||||
}
|
||||
.hero {
|
||||
button,.button {
|
||||
|
|
|
|||
|
|
@ -4,38 +4,38 @@
|
|||
|
||||
/** === Includes === */
|
||||
|
||||
@charset 'utf-8';
|
||||
|
||||
@import 'settings';
|
||||
@import 'foundation';
|
||||
|
||||
@include foundation-typography;
|
||||
@include foundation-button;
|
||||
@include foundation-table;
|
||||
// @charset 'utf-8';
|
||||
//
|
||||
// @import 'settings';
|
||||
// @import 'foundation';
|
||||
//
|
||||
// @include foundation-typography;
|
||||
// @include foundation-button;
|
||||
// @include foundation-table;
|
||||
|
||||
|
||||
/** === Content Width === */
|
||||
.wp-block {
|
||||
width: calc(100vw - (2 * 10));
|
||||
@each $breakpoint, $size in $grid-margin-gutters {
|
||||
|
||||
@include breakpoint($breakpoint) {
|
||||
width: calc(100vw - ($size));
|
||||
}
|
||||
|
||||
}
|
||||
// width: calc(100vw - (2 * 10));
|
||||
// @each $breakpoint, $size in $grid-margin-gutters {
|
||||
//
|
||||
// @include breakpoint($breakpoint) {
|
||||
// width: calc(100vw - ($size));
|
||||
// }
|
||||
//
|
||||
// }
|
||||
}
|
||||
|
||||
/** === Base Typography === */
|
||||
body {
|
||||
font-size: $global-font-size;
|
||||
font-family: $body-font-family;
|
||||
color: $body-font-color;
|
||||
// font-size: $global-font-size;
|
||||
// font-family: $body-font-family;
|
||||
// color: $body-font-color;
|
||||
}
|
||||
|
||||
/** === Post Title === */
|
||||
.editor-post-title__block .editor-post-title__input{
|
||||
@extend h1;
|
||||
// @extend h1;
|
||||
}
|
||||
|
||||
/** === Button === */
|
||||
|
|
@ -43,17 +43,17 @@ body {
|
|||
|
||||
// add general foundation button styling to button in editor
|
||||
.wp-block-button__link {
|
||||
@extend .button;
|
||||
// @extend .button;
|
||||
}
|
||||
|
||||
// add special styling for squared buttons
|
||||
&.is-style-squared .wp-block-button__link {
|
||||
border-radius: 0;
|
||||
// border-radius: 0;
|
||||
}
|
||||
|
||||
// add outline styles
|
||||
&.is-style-outline .wp-block-button__link{
|
||||
@extend .hollow;
|
||||
// @extend .hollow;
|
||||
}
|
||||
|
||||
// set transparent background to block for outline button
|
||||
|
|
@ -61,26 +61,26 @@ body {
|
|||
&.is-style-outline:hover,
|
||||
&.is-style-outline:focus,
|
||||
&.is-style-outline:active {
|
||||
background: transparent;
|
||||
// background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
/** === File === */
|
||||
.wp-block-file__button{
|
||||
@include button();
|
||||
// @include button();
|
||||
}
|
||||
|
||||
/** === Pullquote === */
|
||||
.wp-block-paragraph.has-background{
|
||||
padding: rem-calc(20px 30px);
|
||||
// padding: rem-calc(20px 30px);
|
||||
}
|
||||
|
||||
/** === Table === */
|
||||
.wp-block-table td{
|
||||
border: none;
|
||||
// border: none;
|
||||
}
|
||||
|
||||
/** === Latest Posts grid view === */
|
||||
.wp-block-latest-posts.is-grid{
|
||||
list-style: none;
|
||||
// list-style: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,11 +6,11 @@ Frontend styles for gutenberg blocks
|
|||
@each $color, $code in $foundation-palette {
|
||||
|
||||
.has-#{$color}-background-color {
|
||||
background-color: $code;
|
||||
// background-color: $code;
|
||||
}
|
||||
|
||||
.has-#{$color}-color {
|
||||
color: $code;
|
||||
// color: $code;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -19,27 +19,27 @@ Frontend styles for gutenberg blocks
|
|||
|
||||
// add general foundation button styling
|
||||
.wp-block-button__link {
|
||||
@extend .button;
|
||||
// @extend .button;
|
||||
@each $color, $code in $foundation-palette {
|
||||
|
||||
&.has-#{$color}-background-color {
|
||||
background-color: $code;
|
||||
// background-color: $code;
|
||||
}
|
||||
|
||||
&.has-#{$color}-color {
|
||||
color: $code;
|
||||
// color: $code;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// add special styling for squared buttons
|
||||
&.is-style-squared .wp-block-button__link {
|
||||
border-radius: 0;
|
||||
// border-radius: 0;
|
||||
}
|
||||
|
||||
// add outline styles
|
||||
&.is-style-outline .wp-block-button__link{
|
||||
@extend .hollow;
|
||||
// @extend .hollow;
|
||||
}
|
||||
|
||||
// set transparent background to block for outline button
|
||||
|
|
@ -56,10 +56,10 @@ Frontend styles for gutenberg blocks
|
|||
|
||||
/** === File === */
|
||||
.wp-block-file .wp-block-file__button{
|
||||
@include button();
|
||||
// @include button();
|
||||
}
|
||||
|
||||
/** === Image === */
|
||||
.wp-block-image {
|
||||
margin: 0;
|
||||
// margin: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,26 +19,3 @@
|
|||
font-face: worksans-mediumitalic, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// mods on fonts and typography
|
||||
// not in foundation variables
|
||||
// -----------------------------
|
||||
|
||||
//h1,h2,h3,h4,h5,h6,
|
||||
//.h1,.h2,.h3,.h4,.h4,.h5,.h6,
|
||||
//button,.button,
|
||||
//header nav,
|
||||
//.hero .claim
|
||||
//{
|
||||
// font-variant:all-small-caps;
|
||||
//}
|
||||
//
|
||||
//
|
||||
//h1,h2,h3,h4,h5,h6,
|
||||
//.h1,.h2,.h3,.h4,.h4,.h5,.h6 {
|
||||
// a {
|
||||
// color: $black;
|
||||
// }
|
||||
//}
|
||||
|
|
|
|||
|
|
@ -360,75 +360,6 @@ main {
|
|||
width: auto;
|
||||
overflow: visible;
|
||||
}
|
||||
.widget_tag_cloud {
|
||||
position: relative;
|
||||
margin-left: $global-margin;
|
||||
$tags-background-color: scale-color($anchor-color, $lightness: 95%);
|
||||
a {
|
||||
display: inline;
|
||||
color: $black;
|
||||
&:before, &:after {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
h6 {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
&:before {
|
||||
content: '#tags';
|
||||
color: $primary-color;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
}
|
||||
&:hover{
|
||||
.tagcloud {
|
||||
top: 1.6rem;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
background-color: rgba(255,255,255,0.1);
|
||||
@include breakpoint(small){
|
||||
width: 80vw;
|
||||
right: -1rem;
|
||||
text-align: right;
|
||||
}
|
||||
@include breakpoint(medium){
|
||||
width: 90vw;
|
||||
right: -15vw;
|
||||
}
|
||||
@include breakpoint(large){
|
||||
width: 90vw;
|
||||
right: -25vw;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.tagcloud {
|
||||
position: absolute;
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
transition: transform 0.5s,background-color 0.5s;
|
||||
transform: translateY(-$global-padding);
|
||||
background-color: $tags-background-color;
|
||||
padding: $global-padding;
|
||||
a {
|
||||
display: inline-block;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
font-size: $global-font-size * 0.7 !important;
|
||||
&:before {
|
||||
content: '#';
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
color: $anchor-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.top.secondary {
|
||||
align-content: center;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
.widget_nav_menu {
|
||||
.widget_nav_menu {
|
||||
.menu-resources-menu-container {
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -13,15 +13,24 @@
|
|||
color: $black;
|
||||
justify-content: left !important;
|
||||
}
|
||||
.is-active > a {
|
||||
background: unset;
|
||||
color: scale-color($anchor-color, $saturation: -50%, $lightness: 50%)
|
||||
}
|
||||
width:auto;
|
||||
li.menu-item-has-children {
|
||||
> a {
|
||||
&:after {
|
||||
content:'+';
|
||||
margin-left:auto;
|
||||
padding-left: $global-padding/2;
|
||||
display: inline-block;
|
||||
color: scale-color($anchor-color, $lightness: 85%);
|
||||
display:block;
|
||||
width:0;
|
||||
height:0;
|
||||
border:inset 6px;
|
||||
content:'';
|
||||
border-bottom-width:0;
|
||||
border-top-style:solid;
|
||||
border-color: $anchor-color-alt transparent transparent transparent;
|
||||
margin-top: 0px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
ul.sub-menu {
|
||||
|
|
@ -32,14 +41,24 @@
|
|||
top:0;
|
||||
margin:0;
|
||||
padding:0;
|
||||
width: 100%;
|
||||
width: auto;
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
transition: transform 0.5s;
|
||||
transform: translateY(-$global-padding);
|
||||
li.menu-item-has-children {
|
||||
> a {
|
||||
&:after {
|
||||
border-bottom-width: 6px;
|
||||
border-right-width: 0;
|
||||
border-right-style:solid;
|
||||
border-color: transparent transparent transparent $anchor-color-alt;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
background-color: scale-color($anchor-color, $lightness: 98%);
|
||||
> a {
|
||||
color: scale-color($anchor-color, $lightness: 50%);
|
||||
&:after {
|
||||
|
|
@ -51,6 +70,9 @@
|
|||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
&:hover {
|
||||
background-color: scale-color($anchor-color, $lightness: 98%);
|
||||
}
|
||||
ul.sub-menu {
|
||||
top: 0%;
|
||||
left: 100%;
|
||||
|
|
@ -60,6 +82,77 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.widget_tag_cloud {
|
||||
position: relative;
|
||||
overflow: visible;
|
||||
margin-left: $global-margin;
|
||||
$tags-background-color: scale-color($anchor-color, $lightness: 95%);
|
||||
a {
|
||||
display: inline;
|
||||
color: $black;
|
||||
&:before, &:after {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
h6 {
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
&:before {
|
||||
content: '#tags';
|
||||
color: $primary-color;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
}
|
||||
&:hover{
|
||||
.tagcloud {
|
||||
top: 1.6rem;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
background-color: scale-color($tags-background-color, $alpha: -100%);
|
||||
@include breakpoint(small){
|
||||
width: 80vw;
|
||||
right: -1rem;
|
||||
text-align: right;
|
||||
}
|
||||
@include breakpoint(medium){
|
||||
width: 90vw;
|
||||
right: -15vw;
|
||||
text-align: center;
|
||||
}
|
||||
@include breakpoint(large){
|
||||
width: 90vw;
|
||||
right: -25vw;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.tagcloud {
|
||||
position: absolute;
|
||||
visibility:hidden;
|
||||
opacity:0;
|
||||
transition: transform 0.5s,background-color 0.5s;
|
||||
transform: translateY(-$global-padding);
|
||||
background-color: $tags-background-color;
|
||||
padding: $global-padding;
|
||||
a {
|
||||
display: inline-block !important;
|
||||
background-color: $tags-background-color;
|
||||
padding:$global-padding/4 $global-padding/2;
|
||||
font-size: $global-font-size * 0.7 !important;
|
||||
&:before {
|
||||
content: '#';
|
||||
display: inline-block;
|
||||
}
|
||||
&:hover {
|
||||
color: $anchor-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@include breakpoint(small){
|
||||
}
|
||||
@include breakpoint(medium){
|
||||
|
|
|
|||
Loading…
Reference in New Issue