AutoMedSysLab/automedsys_blog
1
0
Fork 0
Code Issues Pull Requests Releases Activity

first commit

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2023-12-28 16:20:07 -05:00
commit b114fdf4fa
5377 changed files with 1850677 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
wp-content/plugins/nimble-builder/assets/front/scss/modules/_accordion.scss
+165
View File
@@ -0,0 +1,165 @@
// synchronized with default on registration
// [data-sek-module-type="czr_accordion_module"] .#{$project-prefix}module-inner {
// text-align: center;
// }
/*************************************
* ACCORDION MODULE
*************************************/
.sek-accord-wrapper {
text-align: left;
.sek-accord-item {
border: 1px solid #e3e3e3;//consistent with default on registration
overflow: hidden;
&:not(:last-child) {
margin-bottom: 0px;//space between items, consistent with defaults on registration
}
.sek-accord-title {
cursor: pointer;
color: #565656;//consistent with default on registration
background: #ffffff;//consistent with default on registration
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 15px 20px;
border-top: none;
border-right: none;
border-left: none;
border-bottom: 1px solid #e3e3e3;//consistent with default on registration
font-size: 16px;
line-height: 1.5em;
font-weight: 600;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
// Default active color and button bg
&:hover * {
color: #1e261f;//consistent with default on registration
}
&:hover .expander span {
background:#1e261f//consistent with default on registration
}
@at-root [data-sek-expanded="true"] {
.sek-accord-title * {
color: #1e261f;//consistent with default on registration
}
.sek-accord-title .expander span {
background:#1e261f//consistent with default on registration
}
}
.sek-inner-accord-title {
padding-right: 10px;
max-width: calc(100% - 30px);
}
.sek-inner-accord-title, .expander span {
-webkit-transition: all 0.15s ease-in-out;
-moz-transition: all, 0.15s ease-in-out;
-ms-transition: all, 0.15s ease-in-out;
-o-transition: all, 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}
// morphing + / -
// inspired from https://stackoverflow.com/questions/38136077/how-to-morph-a-plus-sign-to-a-minus-sign-using-css-transition
.expander {
color: #1e261f;//consistent with default on registration
width: 30px;
height: 30px;
// reset some properties
padding: 0;
margin: 0;
outline: none;
border: 0;
background: none;
-webkit-box-shadow: none;
box-shadow: none;
font-size: 1.5em;
position: relative;
cursor: pointer;
}
.expander span {
position: absolute;
-webkit-transition: .3s;
-o-transition: .3s;
transition: .3s;
background: #565656;//consistent with default on registration
border-radius: 2px;
}
.expander span:first-of-type {
top: 25%;
bottom: 25%;
width: 10%;
left: 45%;
}
.expander span:last-of-type {
left: 25%;
right: 25%;
height: 10%;
top: 45%;
}
@at-root [data-sek-expanded="true"] {
.expander span:first-of-type, .expander span:last-of-type {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.expander span:last-of-type {
left: 50%;
right: 50%;
}
}
}//.sek-accord-title
// make sure we don't have a double bottom border when the item is collapsed
@at-root [data-sek-has-global-border="true"][data-sek-has-title-border="true"] [data-sek-expanded="false"] .sek-accord-title {
border-bottom: none;
}
@at-root [data-sek-has-global-border="true"][data-sek-has-title-border="true"] .sek-accord-item:not(:last-child) {
border-bottom: none;
}
&[data-sek-expanded="true"] .sek-accord-title {
.expander span:first-of-type, .expander span:last-of-type {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.expander span:last-of-type {
left: 50%;
right: 50%;
}
}
.sek-accord-content {
padding: 15px 20px;
background: #f2f2f2;
color: #1e261f;
font-size: 16px;
line-height: 1.5em;
}
&[data-sek-expanded="true"] > .sek-accord-content {
display: block;
}
&[data-sek-expanded="false"] > .sek-accord-content {
display: none;
}
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_advanced_list.scss
+96
View File
@@ -0,0 +1,96 @@
// Advanced List Module
.sek-module-inner {
[data-sek-adv-list-type="none"] > ul {
list-style-type: none;
@if ( true == $is_rtl ) {
margin-right: 0!important;//50px is the default size of the quote icon, this CSS rule is overriden in dyn CSS if user changes the font size of the icon
}
@else {
margin-left: 0!important;//50px is the default size of the quote icon, this CSS rule is overriden in dyn CSS if user changes the font size of the icon
}
}
[data-sek-adv-list-type="circle"] > ul { list-style-type: circle;}
[data-sek-adv-list-type="disc"] > ul { list-style-type: disc;}
[data-sek-adv-list-type="square"] > ul { list-style-type: square;}
[data-sek-adv-list-type="decimal"] > ol { list-style-type: decimal;}
[data-sek-adv-list-type="lower-alpha"] > ol { list-style-type: lower-alpha;}
[data-sek-adv-list-type="lower-roman"] > ol { list-style-type: lower-roman;}
[data-sek-adv-list-type="upper-roman"] > ol { list-style-type: upper-roman;}
[data-sek-adv-list-type="upper-alpha"] > ol { list-style-type: upper-alpha;}
.sek-adv-list-wrapper ul, .sek-adv-list-wrapper ol {
padding: 0;
line-height: 1.5;
margin: 0;//reset all margins
@if ( true == $is_rtl ) {
margin-right: 25px;//50px is the default size of the quote icon, this CSS rule is overriden in dyn CSS if user changes the font size of the icon
}
@else {
margin-left: 25px;//50px is the default size of the quote icon, this CSS rule is overriden in dyn CSS if user changes the font size of the icon
}
li {text-indent: 0px;}
}
[data-sek-adv-list-layout="vertical"] {
ul, ol {
li {display: list-item;}
}
}
[data-sek-adv-list-layout="horizontal"] {
ul, ol {
li {display: inline-block;}
}
}
.sek-adv-list-item {
.sek-adv-list-item-inner {
// padding: 2.5px 4px;//<= consistent with module registration value
display: -ms-flexbox;
display: flex;
// -ms-flex-align: center;
// align-items: center;
}
.sek-adv-list-item-text {
-webkit-transition: color 0.2s ease-in-out;
-o-transition: color 0.2s ease-in-out;
transition: color 0.2s ease-in-out;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
p {
margin: 0;
}
a {
cursor:pointer;
&:hover {
text-decoration:underline;
}
}
}
.sek-adv-list-item-icon {
margin-right: 10px;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
}// consistent with module registration value
[data-sek-icon-border="circle"], [data-sek-icon-border="square"] {
border: 1px solid;
width: 2.2em;
height: 2.2em;
display: -ms-flexbox;
display: -webkit-box;
display: flex;
-ms-flex-align: center;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
[data-sek-icon-border="circle"] {
border-radius: 2em;
}
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_button.scss
+44
View File
@@ -0,0 +1,44 @@
// synchronized with default on registration
/*************************************
* BUTTON MODULE
*************************************/
[data-sek-module-type="czr_button_module"] .#{$project-prefix}module-inner {
text-align: center;
}
.nb-loc .sek-module .#{$project-prefix}module-inner {
.sek-btn {
background:#020202;
color: #ffffff;
padding: 0.5em 1em;
margin: 0.5em;
i {
margin: 0 8px;
}
&:hover, &:focus, &:active {
color: #ffffff;
background-color: #282828;
text-decoration:none;
}
}
}
// more specific rule ( than the default _buttons.scss style ) to make sure there's no underline when hovering/focusing
// fixes https://github.com/presscustomizr/nimble-builder/issues/514
[data-sek-module-type="czr_button_module"] .sek-module-inner .sek-btn:focus, [data-sek-module-type="czr_button_module"] .sek-module-inner .sek-btn:hover {
text-decoration: none;
}
.#{$project-prefix}btn-inner {
display: flex;
align-items: center;
.sek-btn-text {
width: 100%;
text-align: center;
}
}
.#{$project-prefix}btn.box-shadow {
-webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2) !important;
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2) !important;
&.push-effect:active {
transform: translateY(2px);
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_divider.scss
+18
View File
@@ -0,0 +1,18 @@
/*************************************
* DIVIDER MODULE
*************************************/
[data-sek-module-type="czr_divider_module"] {
text-align: center;
.sek-module-inner {
font-size: 0;
line-height: 0;
}
}
.sek-module-inner .sek-divider {
border-top: 1px solid #5a5a5a;
display: inline-block;
width: 100%;
margin-top: 15px;
margin-bottom: 15px;
font-size: 1rem;//so we can use em for margin
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_featured_pages.scss
+200
View File
@@ -0,0 +1,200 @@
// Responsive wrappers
[class*=sek__r-w] {
position: relative;
display: block;
padding: 0;
overflow: hidden;
backface-visibility: hidden;
transform-style: preserve-3d;
}
[class*=sek__r-w]::before {
display: block;
content: "";
}
// Various responsive ratios
.sek__r-wFP::before {
padding-top: 92.592593%; // default fp aspect ratio
}
.sek-fp-widget {
text-align: center;
margin: auto!important;
.sek-fp-button-holder,.sek-fp-title,.sek-fp-text {
width: 90%;
margin-left: auto;
margin-right: auto;
}
.sek-fp-title {
color: #5a5a5a;
line-height: 1.25em;
margin-top: .625em;
margin-bottom: 1.25em;
word-break: break-word;
position: relative;
font-weight: 500;
font-size: 1.44em;
&::after {
content: "";
position: absolute;
width: 1.25em;
background: #5a5a5a;
height: 2px;
top: 100%;
left: 0;
right: 0;
margin: .3125em auto 0;
transition: all .6s ease;
}
@at-root .sek-link-mask-p:hover .sek-fp-title::after {
width: 2.5em
}
}
.sek-fp-text {
color: #777;
line-height: 1.55em;
margin: 1.5em auto;
word-wrap: break-word;
> a {
padding: 0!important;
display: inline!important;
line-height: 1em!important;
}
}
.sek-fp-btn-link {
text-transform: uppercase;
margin-bottom: 1.25em;
white-space: normal;
word-break: break-word;
outline: 0;
background-color: #3b3b3b;
color: #fff;
border-color: #3b3b3b;
font-size: .75em;
line-height: 2.5em;
padding: 0 2.5em;
&:hover, &:focus, &:active {
color: #3b3b3b;
background: transparent;
}
}
.sek-fp-thumb-wrapper {
// this actually depends on the thumb size
max-width: 270px;
margin: 8px auto;
}
img {
transform: translate3d(0, 0, 0);
-ms-transform: translate(0, 0);
transform-style: preserve-3d;
backface-visibility: hidden;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.js-center-images-disabled & img {
// temporary CSS centering
// fallback for those browsers w/o translate3d transform property
transform: translate(-50%, -50%);
transform: translate3d(-50%, -50%, 0);
-ms-transform: translate(-50%, -50%);
top: 50%;
left: 50%;
max-width: 100%;
}
// JS IMAGE CENTERING
img.h-centered {
width: auto!important;
max-width: none!important;
// position: relative;
}
img.v-centered {
height: auto!important;
max-height: none!important;
max-width: none!important;
vertical-align: top;
// position: relative;
}
}
.sek-link-mask {
position: absolute;
border-color: white;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow: hidden;
z-index: 1;
&.no-effect {
border: none
}
&::before {
position: absolute;
width: 63%;
//
// this refers to the parent width, allowing us to have a perfect square despite the parent
// as it has the same element's width percentage value.
//
padding-bottom: 63%;
content: '';
z-index: 1;
// Centering
left: 50%;
top: 50%;
// fallback for those browsers w/o translate3d transform property
transform: translate(-50%, -50%);
transform: translate3d(-50%, -50%, 0);
/* end of centering */
border: 150px solid;
border-color: inherit;
box-sizing: content-box;
transition: all .3s ease;
}
.round &::before {
border-radius: 50%;
}
.sek-link-mask-p:hover &::before {
transform: translate(-50%, -50%) scale(1.4);
/* fallback for those browsers w/o translate3d transform property*/
transform: translate3d(-50%, -50%, 0) scale(1.4);
-ms-transform: translate(-50%, -50%) scale(1.4);
}
}
//needs modernizr
.no-cssanimations {
.sek-link-mask {
border: transparent;
}
.sek-fp-thumb-wrapper {
opacity: .7
}
.sek-fp-thumb-wrapper:hover {
opacity: 1
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_gallery.scss
+273
View File
@@ -0,0 +1,273 @@
// COLUMN LAYOUT
.sek-gal-wrapper {
&:not(.nb-auto-column-width) {//<= classes added by nb pro when auto-fill option is enabled
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.sek-gal-items {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 20px 1fr;
grid-template-columns: 1fr 1fr;
-ms-grid-rows: 1fr;
grid-template-rows: 1fr;
grid-row-gap: 20px;
grid-column-gap: 20px;
// Fix for ie11. @see https://github.com/presscustomizr/nimble-builder/issues/450
@media all and (-ms-high-contrast:none) {
display: block!important;
}
}
// The following has been added automatically when autoprefixing with https://autoprefixer.github.io/
// not sure why...
.sek-gal-items > *:nth-child(1) {
-ms-grid-row: 1;
-ms-grid-column: 1;
}
.sek-gal-items > *:nth-child(2) {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
// images
.sek-img-gal-item {
-webkit-transition: all 0.15s ease-in-out;
-moz-transition: all, 0.15s ease-in-out;
-ms-transition: all, 0.15s ease-in-out;
-o-transition: all, 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
overflow: hidden;
img {
height: 100%;
width: 100%;
object-fit: cover;
}
&:hover {
opacity: .9;
}
}
}//.sek-post-grid-wrapper COLUMN LAYOUT
// Item box shadow
.sek-module-inner .nb-gal-item-box-shadow .sek-gal-items figure {
-webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}
// Masonry
.sek-module-inner .nb-masonry-gal-grid {
// &.nb-waiting-for-images-to-be-loaded {
// article figure {
// a {
// height: auto!important;
// padding-top: 0!important;
// }
// img {
// position: relative;
// height: auto;
// }
// }
.sek-gal-items {
//display: grid;
// grid-gap: 10px;
//grid-template-columns: repeat(auto-fill, minmax(250px,1fr))!important;
//grid-auto-rows: 5px;
&.nb-masonry-gal-images-loaded {
grid-auto-rows: 5px;
}
.sek-img-gal-item {
img {
height: auto;
}
}
// CSS class added while resizing masonry gallery
// => let img have a natural height so NB can determine the height when resizing
&.sek-gal-img-natural-height {
img {
height: auto!important;
}
}
// CSS class added when masonry resizing is complete
&.sek-gal-img-height-100-percent {
img {
height: 100%;
}
}
}
}
// synchronized with default on registration
// [data-sek-module-type="czr_accordion_module"] .#{$project-prefix}module-inner {
// text-align: center;
// }
/*************************************
* ACCORDION MODULE
*************************************/
// .sek-accord-wrapper {
// text-align: left;
// .sek-accord-item {
// border: 1px solid #e3e3e3;//consistent with default on registration
// overflow: hidden;
// &:not(:last-child) {
// margin-bottom: 0px;//space between items, consistent with defaults on registration
// }
// .sek-accord-title {
// cursor: pointer;
// color: #565656;//consistent with default on registration
// background: #ffffff;//consistent with default on registration
// display: -webkit-box;
// display: -ms-flexbox;
// display: flex;
// -webkit-box-align: center;
// -ms-flex-align: center;
// align-items: center;
// -webkit-box-pack: justify;
// -ms-flex-pack: justify;
// justify-content: space-between;
// padding: 15px 20px;
// border-top: none;
// border-right: none;
// border-left: none;
// border-bottom: 1px solid #e3e3e3;//consistent with default on registration
// font-size: 16px;
// line-height: 1.5em;
// font-weight: 600;
// -webkit-box-flex: 1;
// -ms-flex-positive: 1;
// flex-grow: 1;
// // Default active color and button bg
// &:hover * {
// color: #1e261f;//consistent with default on registration
// }
// &:hover .expander span {
// background:#1e261f//consistent with default on registration
// }
// @at-root [data-sek-expanded="true"] {
// .sek-accord-title * {
// color: #1e261f;//consistent with default on registration
// }
// .sek-accord-title .expander span {
// background:#1e261f//consistent with default on registration
// }
// }
// .sek-inner-accord-title {
// padding-right: 10px;
// max-width: calc(100% - 30px);
// }
// .sek-inner-accord-title, .expander span {
// -webkit-transition: all 0.15s ease-in-out;
// -moz-transition: all, 0.15s ease-in-out;
// -ms-transition: all, 0.15s ease-in-out;
// -o-transition: all, 0.15s ease-in-out;
// transition: all 0.15s ease-in-out;
// }
// // morphing + / -
// // inspired from https://stackoverflow.com/questions/38136077/how-to-morph-a-plus-sign-to-a-minus-sign-using-css-transition
// .expander {
// color: #1e261f;//consistent with default on registration
// width: 30px;
// height: 30px;
// // reset some properties
// padding: 0;
// margin: 0;
// outline: none;
// border: 0;
// background: none;
// -webkit-box-shadow: none;
// box-shadow: none;
// font-size: 1.5em;
// position: relative;
// cursor: pointer;
// }
// .expander span {
// position: absolute;
// -webkit-transition: .3s;
// -o-transition: .3s;
// transition: .3s;
// background: #565656;//consistent with default on registration
// border-radius: 2px;
// }
// .expander span:first-of-type {
// top: 25%;
// bottom: 25%;
// width: 10%;
// left: 45%;
// }
// .expander span:last-of-type {
// left: 25%;
// right: 25%;
// height: 10%;
// top: 45%;
// }
// @at-root [data-sek-expanded="true"] {
// .expander span:first-of-type, .expander span:last-of-type {
// -webkit-transform: rotate(90deg);
// -ms-transform: rotate(90deg);
// transform: rotate(90deg);
// }
// .expander span:last-of-type {
// left: 50%;
// right: 50%;
// }
// }
// }//.sek-accord-title
// // make sure we don't have a double bottom border when the item is collapsed
// @at-root [data-sek-has-global-border="true"][data-sek-has-title-border="true"] [data-sek-expanded="false"] .sek-accord-title {
// border-bottom: none;
// }
// @at-root [data-sek-has-global-border="true"][data-sek-has-title-border="true"] .sek-accord-item:not(:last-child) {
// border-bottom: none;
// }
// &[data-sek-expanded="true"] .sek-accord-title {
// .expander span:first-of-type, .expander span:last-of-type {
// -webkit-transform: rotate(90deg);
// -ms-transform: rotate(90deg);
// transform: rotate(90deg);
// }
// .expander span:last-of-type {
// left: 50%;
// right: 50%;
// }
// }
// .sek-accord-content {
// padding: 15px 20px;
// background: #f2f2f2;
// color: #1e261f;
// font-size: 16px;
// line-height: 1.5em;
// }
// &[data-sek-expanded="true"] > .sek-accord-content {
// display: block;
// }
// &[data-sek-expanded="false"] > .sek-accord-content {
// display: none;
// }
// }
// }
wp-content/plugins/nimble-builder/assets/front/scss/modules/_heading.scss
+17
View File
@@ -0,0 +1,17 @@
// synchronized with default on registration
/*************************************
* HEADING MODULE
*************************************/
.sek-module-inner {
.sek-heading {
text-align: center;//This should match the default on registration
// set a margin to fix https://github.com/presscustomizr/nimble-builder/issues/203
margin: 0.6em 0;//This should match the default on registration
display: block;//<=fixes https://github.com/presscustomizr/nimble-builder/issues/442
> a {
color: inherit;
font-size: inherit;
}
}
}
// introduced when implementing https://github.com/presscustomizr/nimble-builder/issues/322
wp-content/plugins/nimble-builder/assets/front/scss/modules/_icon.scss
+48
View File
@@ -0,0 +1,48 @@
/*************************************
* ICON MODULE
*************************************/
[data-sek-module-type="czr_icon_module"] {
text-align: center;
color: #5a5a5a;
font-size: 15px;
a.sek-icon,
a.sek-icon:hover,
a.sek-icon:focus,
a.sek-icon:active,
a.sek-icon.active {
color: inherit;
}
.box-shadow .sek-icon-wrapper{
-webkit-box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 11px 0px;
-moz-box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 11px 0px;
box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 11px 0;
}
.sek-icon {
i {
-webkit-transition: all 0.15s ease-in-out;
-o-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}
// fix for themes (like Hueman) styling the width of the font awesome icons
.fas, .far, .fab {
// width and height in em implemented for https://github.com/presscustomizr/nimble-builder/issues/266
width: 1em;
height: 1em;
text-align: center;
}
}
a.sek-icon {
// fix : themes like Twenty Seventeen styling the link underline with a box-shadow instead of the regular "text-decoration:underline" rule
box-shadow: none;
-webkit-box-shadow: none;
&:hover, &:focus, &:active {
box-shadow: none;
-webkit-box-shadow: none;
}
}
.sek-icon-wrapper {
display: inline-block;
line-height: 1em;
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_image.scss
+73
View File
@@ -0,0 +1,73 @@
/*************************************
* IMAGE MODULE
*************************************/
[data-sek-module-type="czr_image_module"] {
text-align: center;
}
[data-sek-module-type="czr_image_module"] img {
border: 0 solid #f2f2f2;
}
[data-sek-module-type="czr_image_module"] .box-shadow img {
-webkit-box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 11px 0px;
-moz-box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 11px 0px;
box-shadow: rgba(0, 0, 0, 0.25) 0px 3px 11px 0;
}
/* image module transitions for better animations when effects are used */
[data-sek-module-type="czr_image_module"] figure {
img {
-webkit-transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
transition: all 0.2s ease-out;
}
&.has-custom-height {
overflow: hidden;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-align: center;
align-items: center;
img {
object-fit: cover;
}
}
}
// Commented because now applied only when previewing, in sek-preview.css
// [data-sek-module-type="czr_image_module"] figure img {
// -webkit-transition: all 0.2s ease-out;
// -o-transition: all 0.2s ease-out;
// transition: all 0.2s ease-out;
// }
.sek-hover-effect-opacity img:hover {
opacity: .7;
}
.sek-hover-effect-zoom-out img:hover {
transform: scale(1.05);
}
.sek-hover-effect-zoom-in img:hover {
transform: scale(0.95);
}
.sek-hover-effect-move-up img:hover {
transform: translateY(-6px);
}
.sek-hover-effect-move-down img:hover {
transform: translateY(6px);
}
.sek-hover-effect-blur img:hover {
filter: blur(2px);
}
.sek-hover-effect-grayscale img:hover {
filter: grayscale(0%);
}
.sek-hover-effect-grayscale img:hover {
filter: grayscale(100%);
filter: gray;
}
.sek-hover-effect-reverse-grayscale img {
filter: grayscale(100%);
filter: gray;
}
.sek-hover-effect-reverse-grayscale img:hover {
filter: grayscale(0%);
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_img_slider.scss
+266
View File
@@ -0,0 +1,266 @@
/*************************************
* IMAGE SLIDER MODULE
*************************************/
.sek-column-inner [data-sek-module-type="czr_img_slider_module"] {
// enlarge the module wrapper to "compensate" the parent column paddings
// @fixes https://github.com/presscustomizr/nimble-builder/issues/566
width: calc(100% + 20px);
max-width: calc(100% + 20px);
}
[data-sek-module-type="czr_img_slider_module"] {
.sek-carousel-img [src*="data:image/gif;"] {
display: none;
}
.sek-swiper-loading .sek-carousel-img img {
display: none;//<= sek-swiper-loading is removed on swiper init event
}
// nov 2020 => hide swiper built-in preloader when customizing because won't be auto-hidden
@at-root .customizer-preview .swiper-wrapper .swiper-lazy-preloader {
display: none;
}
.swiper {
width: 100%;
height: 100%;
overflow: hidden;
.swiper-wrapper {
display: -ms-flexbox;
display: flex;
-ms-flex-align: center;
align-items: center;
height: 400px;//consistent with defaults on registration
@include media-breakpoint-only(xs) {
height: 200px;
}
}
&[data-sek-image-layout="nimble-wizard"] {
.sek-carousel-img {
height: 100%;
overflow: hidden;
img {
max-width: none;
opacity:0;
-webkit-transition: opacity 0.15s ease-in-out;
-moz-transition: opacity, 0.15s ease-in-out;
-ms-transition: opacity, 0.15s ease-in-out;
-o-transition: opacity, 0.15s ease-in-out;
transition: opacity 0.15s ease-in-out;
}
}
}
&[data-sek-image-layout="height-100"] {
.sek-carousel-img {
height: 100%;
width: auto;
overflow: hidden;
img {
width: auto;
height: 100%;
max-width: none;
}
}
}
// Sept 2020, for https://github.com/presscustomizr/nimble-builder/issues/743
&[data-sek-image-layout="cover"] {
.sek-carousel-img {
height: 100%;
width: 100%;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
img {
width: 100%;
height: 100%;
max-width: none;
object-fit: cover;
}
}
}
}//.swiper
.swiper-slide {
text-align: center;
font-size: 18px;
// background: #fff;
/* Center slide image vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
&[data-sek-slide-link] {
cursor: pointer;
}
.sek-carousel-img {
width: 100%;
img {
width: 100%;
// When Nimble Wizard is enabled
&.sek-h-centrd {
width: auto !important;
max-width: none !important;
position: relative;
opacity: 1;
}
&.sek-v-centrd {
height: auto !important;
max-height: none !important;
vertical-align: top;
position: relative;
max-width: none !important;
opacity: 1;
}
}
}
&[data-sek-has-overlay="true"] .sek-carousel-img::after {
content: '';
left: 0;
right: 0;
bottom: 0;
top: 0;
position: absolute;
//background: rgba(49,49,49,.5);
background-color: #000000;
opacity: 0.3;
}
.sek-slider-text-wrapper {
height: 100%;
width: 100%;
-webkit-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
-webkit-transform: translate3d(-50%,-50%,0);
transform: translate3d(-50%,-50%,0);
top: 50%;
left: 50%;
position: absolute;
/* Center slide text vertically
=> consistent with defaults in module registration */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.sek-slider-text-content {
height: auto;
max-height: 100%;
width: 100%;
padding:5%;//consistent with defaults in module registration
text-align: center;//consistent with defaults in module registration
z-index: 3;
overflow: hidden;
//why this light grey text color ? => if set to white ( #fff ), the text is not visible when no image is picked, which might be difficult to understand for users
color: #e2e2e2;//consistent with defaults in module registration
font-size:16px;//consistent with defaults in module registration
line-height:1.5em;//consistent with defaults in module registration
* {
font-size:16px;//consistent with defaults in module registration
line-height:1.5em;//consistent with defaults in module registration
}
}
}//.swiper-slide
/* SWIPER BULLETS */
.swiper-pagination-bullet-active {
background-color: #ffffff;//consistent with defaults registration param
}
/* SWIPER ARROWS */
.sek-swiper-nav {
cursor: pointer;
// Chevron inspired by the pen shared by @wksy on Codepen
// @see https://codepen.io/wsky/pen/BKoKxV
.sek-chevron {
display: inline-block;
border-right: 2px solid #ffffff;//consistent with defaults registration param
border-bottom: 2px solid #ffffff;//consistent with defaults registration param
width: 11px;
height: 11px;
}
.sek-swiper-prev {
left: 0;
border-top-left-radius: 0px;
border-top-right-radius: 2px;
border-bottom-right-radius: 2px;
border-bottom-left-radius: 0px;
.sek-chevron {
-webkit-transform: rotate(-225deg);
-ms-transform: rotate(-225deg);
transform: rotate(-225deg);
}
}
.sek-swiper-next {
right: 0;
border-top-left-radius: 2px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 2px;
.sek-chevron {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
}
.sek-swiper-prev, .sek-swiper-next{
position: absolute;
z-index: 2;
top: calc((100% - 60px)/2);
text-align: center;
margin-top: 0px;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
display: block;
height: 60px;
width: 50px;
opacity: 0.6;
background-color: rgba(32, 32, 32, 0.4);
-webkit-transition: all 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
transition: all 0.3s cubic-bezier(0.39, 0.575, 0.565, 1);
line-height: 64px;
cursor: pointer;
font-size: 18px;
}
.sek-swiper-prev:hover, .sek-swiper-next:hover {
background-color: rgba(32, 32, 32, 0.7);
opacity: 1;
width: 100px;
}
}//.sek-swiper-nav
@include media-breakpoint-only(xs) {
[data-sek-hide-nav-on-mobile="true"] {
.swiper-pagination {display: none;}
.sek-swiper-nav{display: none;}
}
}
// @media only screen and (max-width: 719px) {
// .sek-swiper-nav { display: none;}
// }
}//[data-sek-module-type="czr_img_slider_module"]
wp-content/plugins/nimble-builder/assets/front/scss/modules/_menu.scss
+713
View File
@@ -0,0 +1,713 @@
/*************************************
* MENU MODULE
*************************************/
@mixin dropdown-menu-base {
position: static;
float: none;
list-style: none;
border-radius: 0;
border:0;
margin: 0;
padding: 0;
font-size: inherit;
//mobile up breakpoint -> min-width:768px
@include media-breakpoint-up( 'md' ) {
position: absolute;
display: none;
top: 100%;
@if ( true == $is_rtl ) {
right: 0;
}
@else {
left: 0;
}
z-index: 1000;
min-width: 10rem;
max-width: 50vw;
}
}
.sek-nav-wrap {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end;
padding: .5rem 0;
// https://github.com/presscustomizr/nimble-builder/issues/368
.sek-mobile-menu-expanded-below & {
padding: 0;
}
}
.sek-nav-collapse {
flex-basis: 100%;
flex-grow: 1;
align-items: center;
// justify-content property should be consistent with the default value in sek_get_module_params_for_czr_menu_content_child()
// justify-content: flex-start;
// -webkit-box-pack: start;
// -ms-flex-pack: start;
}
.sek-nav {
display: flex;
flex-wrap: wrap;
flex-direction: column;
.sek-module .sek-module-inner & {
&,
& ul {
list-style: none !important;
padding: 0 !important;
margin: 0 !important;
}
margin-right: -10px !important;
margin-left: -10px !important;
li {
list-style: none;
padding: 0;
& > ul li {
padding: 0;
}
}
}
li {
font-size: 16px;// consistent with defaults
a {
line-height: 1.5em;// consistent with default registration params
padding: .6em .8em;
display: flex;
align-items: center;
justify-content: space-between;
color: inherit;
overflow:hidden;
.sek-nav-wrap & {
text-decoration: none;
}
&:hover {
.sek-nav__title {
text-decoration: underline;
}
}
}
&:not(:last-of-type) {
border-bottom: 1px solid;
//customizable
border-color: rgba(49,49,49,.09);
}
}
.menu-item-has-children,
.page_item_has_children {
position: relative;
& > a::after {
// Feb 2020 => replaced font awesome by a unicode character well supported
// see https://github.com/presscustomizr/nimble-builder/issues/602
content: "\203A";//https://unicode-table.com/en/203A/
font-family: "Arial Unicode MS", Arial;//<= https://www.fileformat.info/info/unicode/char/203A/fontsupport.htm
moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: none;
font-style: normal;
font-variant: normal;
text-rendering: auto;
font-weight: 900;
transition: all 0.3s ease;
transform-style: preserve-3d;
backface-visibility: hidden;
perspective: 1000px;
padding: 0 .45em;
font-size: 1em;
position: relative;
transform: translateZ(0) rotate(90deg);
-ms-transform: rotate(90deg);
}
&.show > a::after {
@if ( true == $is_rtl ) {
transform: translateZ(0) rotate(90deg) !important;
-ms-transform: rotate(90deg)!important;
}
@else {
transform: translateZ(0) rotate(-90deg)!important;
-ms-transform: rotate(-90deg)!important;
}
}
}
& .sub-menu,
& .children {
@include dropdown-menu-base();
}
}
// RULES FOR HORIZONTAL DESKTOP MENU
//mobile up breakpoint -> min-width:768px
@include media-breakpoint-up( 'md' ) {
.sek-nav {
flex-direction: row;
.menu-item-has-children,
.page_item_has_children {
& > a::after {
display:inline-block;
}
}
& > li:not(:last-of-type) {
border-bottom: none;
}
& > li > a {
padding: 5px;
}
.sek-module .sek-module-inner & {
li {
margin: 0 5px;
& > ul li {
@if ( true == $is_rtl ) {
padding: 0 .9rem 0 0;
} @else {
padding: 0 0 0 .9rem;
}
}
}
}
}
.sek-nav-collapse {
display: flex!important;// <= !important because the php template sets this selector to display:none with inline style. This hack allows us to prevent a Content Layout Shift on page load
flex-basis: auto;
// justify-content property should be consistent with the default value in sek_get_module_params_for_czr_menu_content_child()
justify-content: flex-end;
-webkit-box-pack: end;
-ms-flex-pack: end;
}
// https://github.com/presscustomizr/nimble-builder/issues/368
.sek-mobile-menu-expanded-below {
display: none!important;
}
.sek-nav-toggler {
display: none;
}
.sek-dropdown-menu {
.sek-nav & li {
padding: 0 10px !important;
margin: 0 !important;
a {
padding: 10px 12px;
}
}
// following two should be customizable...
background: white;
box-shadow: 1px 2px 2px 2px rgba(0,0,0,.15);
ul {
@if ( true == $is_rtl ) {
right: 100%;
}
@else {
left: 100%;
}
}
.sek-menu-link__row-reverse {
flex-direction: row-reverse !important;
}
.sek-nav__title {
word-break: normal;
white-space: nowrap;
}
.sek-dropdown-submenu & {
top: 15px;
}
}
@at-root .sek-submenu-fade .sek-dropdown-menu a {
transition: all 0.25s ease;
transform: translate(0, 0);
&:hover {
transform: translate(3px, 0);
}
}
// submenu revealing fade effect
// lets use a trick to make this not impact on the snake
// basically we know that assigning a perspective to an element
// plus position:relative creates a new system
// where fixed elements behave like absolute elements relative to the parent
// this way the actual visual position of the dropdown will not be impacted
// though, as fixed element, even if overflowing the tc-page-wrap, will not
// make the orizontal scrollbar appear!
@at-root .sek-submenu-fade {
.page_item_has_children,
.menu-item-has-children {
perspective: 1000px;
> ul {
position: fixed;
opacity: 0;
visibility: hidden;
display: block;
transition: all 0.25s ease-in-out;
transform: translate( 0, -10px );
}
&:not(.show) {
//temporary fix for Firefox : https://github.com/presscustomizr/customizr/issues/1083
//the perspective thing seems to not work with this browser
//need further investigation
overflow: hidden;
//because of the fact the submenu is displayed
//it might still grab the the hover while fading out
//let's avoid this resetting its pointer-events
//when the li parent hasn't the show class
ul {
pointer-events: none;
cursor: $cursor-disabled;
}
}
}
li.show {
perspective: none;
> ul {
position: absolute;
visibility: visible;
opacity: 1;
transform: translate( 0, 0);
}
}
}
// end fade effect
.nb-collapsible-mobile-menu .nb-dd-mm-toggle-wrapper {
display: none;
}
}//@include media-breakpoint-up( 'md' )
// ANIMATION : ROTATING ARROWS FOR SUBMENU PARENTS
.sek-dropdown-submenu {
& > a{
&::after {
@if ( true == $is_rtl ) {
transform: translateZ(0) rotate(0deg)!important;
-ms-transform: rotate(0deg)!important;
}
@else {
transform: translateZ(0) rotate(0deg)!important;
-ms-transform: rotate(0deg)!important;
}
}
//TODO: row reverse
&[class*=-reverse]::after {
top: .1em;
@if ( true == $is_rtl ) {
transform: translateZ(0) rotate(180deg)!important;
-ms-transform: rotate(180deg)!important;
}
@else {
transform: translateZ(0) rotate(-180deg)!important;
-ms-transform: rotate(-180deg)!important;
}
}
}
}
.sek-dropdown-menu {
@include dropdown-menu-base();
.show > & {
display: block;
}
.sek-nav .sek-nav__title {
//the sidemenu and mobile menu should NOT break lines
word-break: break-word;// was break-all; Fixed in dec-2017 @see https://github.com/presscustomizr/customizr/issues/1339
white-space: normal;
}
//SNAKE
&.open-right {
left: 0;
right: auto;
}
@at-root &.open-right ul:not(.open-left),
& ul.open-right {
left: 100%;
right: auto;
top: 0;
}
&.open-left {
left: auto;
right: 0;
}
@at-root &.open-left ul:not(.open-right),
& ul.open-left {
right: 100%;
left: auto;
}
// progressive background filling on hover not activated when releasing the menu module initial version, in v1.4.0
// li {
// position: relative;
// &::before {
// content: '';
// position: absolute;
// width: 0%;
// height: 100%;
// top: 0;
// left: 0;
// transition-delay: 0s;
// transition-duration: .6s;
// transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
// transform-origin: 0 100%;
// background-color: rgba(0, 0, 0, 0.045);
// }
// &:hover::before {
// width: 100%;
// }
// }
}
// Janv 2021 NEW COLLAPSIBLE MOBILE MENU
// June 2020 for https://github.com/presscustomizr/nimble-builder/issues/721
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
nav.nb-collapsible-mobile-menu {
[data-sek-mm-state="expanded"] {
overflow: auto;
max-height: 80vh;
padding-bottom: 10px;
//background: #ffffff;
}
li .sub-menu {
li a { font-size: 0.88em; }
li > a { padding: .6em 32px; }
li li > a { padding: .6em 60px; }
li li li > a { padding: .6em 80px; }
li li li li > a { padding: .6em 100px; }
}
}
nav.nb-collapsible-mobile-menu [data-sek-mm-state] { display: none }
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] { display: block; }
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"],
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] li,
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] ul { background: #ffffff; }
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .sub-menu,
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] li {
position: relative;
}
[data-sek-is-mobile-vertical-menu="yes"] .sek-nav li a {
min-height: 45px;//<= which is also the height if the toggle button when there are children items ( .nb-dd-mm-toggle )
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
// Janv 2021 : default alignment of vertical mobile menu items
// consistent with registration params
// see in sek_get_module_params_for_czr_menu_content_child()
justify-content: flex-start;
-webkit-box-pack: start;
-ms-flex-pack: start;
}
// nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] > li > a {
// min-height: 43px;
// }
// Hide sub-menus for mobile vertical menu
// show sub-menus when .expanded class is added
[data-sek-is-mobile-vertical-menu="yes"] .sub-menu { display: none; }
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .sub-menu { display: none; }
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .sub-menu.expanded { display: block; }
// MOBILE MENU ARROW TOGGLE WHEN THERE IS A SUBMENU
/*
* Mobile dropdown on click
*/
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .page_item_has_children > a,
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .menu-item-has-children > a {
// this padding gives the necessary space for the toggle arrow button
padding-right: 60px;
}
.nb-dd-mm-toggle-wrapper {
position: absolute;
top: 1px;
right: 0;
text-align: center;
line-height: 1;
bottom: 1px;
height: 45px;
width: 60px;
}
.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .nb-dd-mm-toggle-wrapper {
display: block;
}
.nb-dd-mm-toggle {
background: none!important;
-webkit-appearance: none;
outline: none;
border: none;
padding: 0;
cursor: pointer;
display: block;
height: 45px;
width: 60px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
}
.nb-dd-mm-toggle i {
display: block;
-webkit-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
width: 100%;
color:#000000;
}
li.expanded > .nb-dd-mm-toggle-wrapper .nb-arrow-for-mobile-menu {
-webkit-transform: rotate(-180deg);
-moz-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.nb-arrow-for-mobile-menu::after {
content: "\25BE";//https://unicode-table.com/en/25BE/
font-family: "Arial Unicode MS", Arial;//<= https://www.fileformat.info/info/unicode/char/203A/fontsupport.htm
moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
// display: none;
font-style: normal;
font-variant: normal;
text-rendering: auto;
font-weight: 900;
transition: all 0.3s ease;
transform-style: preserve-3d;
backface-visibility: hidden;
perspective: 1000px;
padding: 0 .45em;
font-size: 18px;
line-height: 45px;
position: relative;
}
// MOBILE : HAMBURGER BUTTON
//Hueman inspired nav toggler
.nb-loc .sek-module-inner nav .sek-nav-toggler {
-webkit-appearance: none !important;
cursor: pointer;
&, &:hover, &:focus {
//following 3 should be customizable
background: 0 0;
background-color: rgba(0, 0, 0, 0);
color: black;
outline: none;
border: none;
}
height: 40px;
width: 40px;
padding: 0;
vertical-align: middle;
//align to the right (left when rtl)
// @if ( true == $is_rtl ) {
// margin-right: auto;
// margin-left: -10px;
// }
// @else {
// margin-left: auto;
// margin-right: -10px;
// }
@at-root .sek-ham__span-wrapper {
height: 12px;
position: relative;
display: block;
.line {
display: block;
height: 1.5px;
position: absolute;
left: 10px;
border-radius: 5px;
background-clip: padding-box;
transition: all ease .35s;
backface-visibility: hidden;
border-top: 1.5px solid;
}
.line-1 {
top: 0;
}
.line-2 {
top: 50%;
}
.line-3 {
top: 100%;
}
@at-root .sek-nav-toggler {
.line-1 {
transform: translate(-3px, 6px) rotate(45deg);
width: 28px;
}
.line-2 {
opacity: 0;
}
.line-3 {
transform: translate(-3px, -6px) rotate(-45deg);
width: 28px;
}
}
@at-root .sek-nav-toggler.sek-collapsed .line {
width: 20px;
transform: translate(0,0) rotate(0);
opacity: 1;
}
@at-root .sek-nav-toggler.sek-collapsed.hovering .line {
transform: translateX(-3px);
width: 26px;
}
}
}
// PRO SEARCH ICON IN DESKTOP + SEARCH FIELD DESKTOP AND MOBILE
// June 2020 search icon + form in menu module for https://github.com/presscustomizr/nimble-builder-pro/issues/12
.nb-module-menu-search {
position: relative;
}
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
[data-sek-is-mobile-vertical-menu="yes"] .nb-module-menu-search {
display: none;
}
.nb-svg-search-icon {
cursor: pointer;
padding: 0;
}
.nb-module-menu-search .nb-search-expand {
display:none;
background: #fff;
position: absolute;
z-index: 100;
top: 49px;
right: 0;
left: 0;
width: 340px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.1);
box-shadow: 0 1px 0 rgba(255,255,255,.1);
}
.nb-search-expand .nb-search-expand-inner {
border: 1px solid #eee;
box-shadow: 0 0 5px rgba(0,0,0,.2),0 1px 0 rgba(255,255,255,.15);
transition: -webkit-transform .35s ease-in-out,height .25s ease-in-out,background-color .45s ease-in-out;
transition: transform .35s ease-in-out,height .25s ease-in-out,background-color .45s ease-in-out;
padding: 15px;
// make sure NB cleans any icon printed ::after the label ( like in hueman theme for example )
[role=search].search-form label::after {
content: none;
}
}
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner [role=search].search-form {
display: flex;
float: none;
}
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner label input[type=search] {
max-width: 100%;
}
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner input[type=submit], [data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search form input[type=submit] {
margin: 0;
background: #808080!important;
color: #fff;
font-size: 16px;
padding: 10px 10px;
font-weight: normal;
display: inline-block;
border: none;
cursor: pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
}
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner input[type=search], [data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search input[type=search],
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner input[type=submit], [data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search form input[type=submit] {
text-transform: none!important;
}
.nb-mobile-search {
display: none;
}
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
[data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search {
display: block;
padding: 6px 14px 15px;
}
[data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search input {
font-size: 16px;
}
.nb-search-expand-inner, .nb-mobile-search {
input {
&[type="search"] {
color: #000000!important;
}
&[type="submit"] {
color: #ffffff!important;
}
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_post_grid.scss
+638
View File
@@ -0,0 +1,638 @@
// @todo rtl
/*************************************
* POST GRID MODULE
*************************************/
// DESIGN SETTINGS FOR LIST AND GRID
.sek-post-grid-wrapper {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
// Spacing
.sek-grid-items {
grid-row-gap: 25px;
&.sek-list-layout article>*:not(:last-child):not(.sek-pg-thumbnail){
margin-bottom: 10px;
}
&.sek-grid-layout article>*:not(:last-child){
margin-bottom: 10px;
}
article {
>:first-child {
margin-top: 0!important;
}
>:last-child {
margin-top: 0!important;
}
>*:not(:last-child) {
margin-top: 0!important;
}
overflow: hidden;
.sek-pg-content {
>*:not(:last-child) {
margin-top: 0!important;
margin-bottom: 10px;
}
>:first-child {
margin-top: 0!important;
}
>:last-child {
margin-top: 0!important;
}
}
}
&.sek-shadow-on-hover article {
-webkit-box-shadow: 0 0 40px 0 rgba(0,0,0,.05);
box-shadow: 0 0 40px 0 rgba(0,0,0,.05);
-webkit-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
-o-transition: all 0.3s cubic-bezier(.25,.8,.25,1);
transition: all 0.3s cubic-bezier(.25,.8,.25,1);
&:hover {
-webkit-transform: translateY(-4px);
-ms-transform: translateY(-4px);
transform: translateY(-4px);
-webkit-box-shadow: 0 14px 28px rgba(0,0,0,0.18), 0 10px 10px rgba(0,0,0,0.15);
box-shadow: 0 14px 28px rgba(0,0,0,0.18), 0 10px 10px rgba(0,0,0,0.15);
}
}
}//.sek-grid-items
// POST THUMBNAIL
.sek-pg-thumbnail {
img {
box-shadow: 0 5px 5px 0 rgba(18,63,82,.035), 0 0 0 1px rgba(176,181,193,.2);
border-radius: 4px;
}
background: inherit;
overflow: hidden;
// padding: 60px 35px;
// --box-padding-vert: 60px;
// --box-padding-hori: 35px;
// padding: 0!important;
// margin-left: 0;
// margin-right: 0;
a {
display: block;
position: relative;
}
img {
display: block;
width: 100%;
height: auto;
}
}//.sek-pg-thumbnail
// Item box shadow
&.nb-thumb-box-shadow article .sek-pg-thumbnail img {
-webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}
// POST THUMBNAIL WITH CUSTOM HEIGHT
// we set the height of the image container ( <a> tag ), with the padding property
// because padding and margin are relative to the width in CSS
// @see https://www.w3.org/TR/2011/REC-CSS2-20110607/box.html#padding-properties
// This is set dynamically by users in PHP sek_add_css_rules_for_czr_post_grid_module()
.sek-thumb-custom-height .sek-pg-thumbnail {
a {
height: 0;
padding-top: 65%;
// Fix for ie11. @see https://github.com/presscustomizr/nimble-builder/issues/450
@media all and (-ms-high-contrast:none) {
height: auto!important;
padding-top:inherit!important;
}
}
img {
position: absolute;
height: 100%;
width: 100%;
max-height: none;
max-width: none;
top: 0;
left: 0;
right: 0;
bottom: 0;
-o-object-fit: cover;
object-fit: cover;
// Fix for ie11. @see https://github.com/presscustomizr/nimble-builder/issues/450
@media all and (-ms-high-contrast:none) {
height: auto!important;
position: relative;
}
}
}//.sek-thumb-custom-height .sek-pg-thumbnail
// Metas
.sek-pg-metas > span:not(:last-child)::after {
content: "\B7";
vertical-align: middle;
margin: 0 5px;
line-height: 1;
}
// Content : title, excerpt, metas
.sek-pg-content {
@if ( true == $is_rtl ) { text-align: right; }
@else { text-align: left; }
}
// Excerpt
// => remove margin bottom after the last element in excerpt, typically a <p> tag
.sek-excerpt>:last-child {
margin-bottom: 0;
}
}//.sek-post-grid-wrapper DESIGN SETTINGS
// FONTS
.nb-loc .sek-module-inner .sek-post-grid-wrapper {
// Category font
.sek-pg-category {
line-height: 1.2em;
color: #767676;
a {
text-transform: uppercase;
font-size: 13px;
text-decoration: none;
color: #767676;
&:hover {
color: inherit;
text-decoration: underline;
}
}
}
// Title
.sek-pg-title {
// reset theme and plugins value for h2
font-size: 28px;
@include media-breakpoint-down(md) {
font-size: 22px;
}
@include media-breakpoint-down(xs) {
font-size: 20px;
}
line-height: 1.1em;
a {
text-decoration: none;
color: #121212;
font-size: 28px;
font-weight: 400;
line-height: 1.1em;
-ms-word-wrap: break-word;
word-wrap: break-word;
&:hover {
color: #666
}
@include media-breakpoint-down(md) {
font-size: 22px;
}
@include media-breakpoint-down(xs) {
font-size: 20px;
}
}
}
// Metas font
.sek-pg-metas {
line-height: 1.2em;
span, a {
text-transform: uppercase;
font-size: 13px;
letter-spacing: 1px;
color: #767676;
}
a:hover {
text-decoration: underline;
color: inherit;
}
}
// Excerpt
.sek-pg-content p {
margin: 0 0 10px 0;
line-height: 1.3em;
font-size: 14px;
color: #555;
}
}// .sek-post-grid-wrapper FONTS
// LIST LAYOUT
.sek-post-grid-wrapper {
.sek-list-layout {
display: -ms-grid;
display: grid;
-ms-grid-columns: minmax(0,1fr);
grid-template-columns: minmax(0,1fr);
// Fix for ie11. @see https://github.com/presscustomizr/nimble-builder/issues/450
@media all and (-ms-high-contrast:none) {
display: block!important;
}
}
.sek-list-layout article {
display: -ms-grid;
display: grid;
-ms-grid-columns: minmax(0,1fr);
grid-template-columns: minmax(0,1fr);
-ms-grid-rows: 1fr;
grid-template-rows: 1fr;
grid-column-gap: 20px;
// Fix for ie11. @see https://github.com/presscustomizr/nimble-builder/issues/450
@media all and (-ms-high-contrast:none) {
display: block!important;
padding-top: 10px;
}
}
// The following has been added automatically when autoprefixing with https://autoprefixer.github.io/
// not sure why...
.sek-list-layout article > *:nth-child(1) {
-ms-grid-row: 1;
-ms-grid-column: 1;
}
// article has 2 columns when the thumbnail is displayed
.sek-list-layout article.sek-has-thumb {
-ms-grid-columns: 30% minmax(0,1fr);
grid-template-columns: 30% minmax(0,1fr);
}
// .sek-post-grid-wrapper .sek-list-layout article:not(:last-child) {
// margin-bottom: 5%;
// padding-bottom: 5%;
// }
.sek-list-layout article .sek-pg-thumbnail {
margin-bottom: 0;
-ms-flex-item-align: start;
align-self: flex-start;
}
}//.sek-post-grid-wrapper LIST LAYOUT
// COLUMN LAYOUT
.sek-post-grid-wrapper {
.sek-grid-layout {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 20px 1fr;
grid-template-columns: 1fr 1fr;
-ms-grid-rows: 1fr;
grid-template-rows: 1fr;
grid-row-gap: 20px;
grid-column-gap: 20px;
// Fix for ie11. @see https://github.com/presscustomizr/nimble-builder/issues/450
@media all and (-ms-high-contrast:none) {
display: block!important;
}
}
// The following has been added automatically when autoprefixing with https://autoprefixer.github.io/
// not sure why...
.sek-grid-layout > *:nth-child(1) {
-ms-grid-row: 1;
-ms-grid-column: 1;
}
.sek-grid-layout > *:nth-child(2) {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
}//.sek-post-grid-wrapper COLUMN LAYOUT
// Masonry
.sek-module-inner .nb-masonry-post-grid {
// &.nb-waiting-for-images-to-be-loaded {
// article figure {
// a {
// height: auto!important;
// padding-top: 0!important;
// }
// img {
// position: relative;
// height: auto;
// }
// }
.sek-grid-items {
//display: grid;
// grid-gap: 10px;
//grid-template-columns: repeat(auto-fill, minmax(250px,1fr))!important;
//grid-auto-rows: 5px;
&.nb-masonry-grid-images-loaded {
grid-auto-rows: 5px;
}
article { overflow: hidden;}
&.sek-thumb-no-custom-height .sek-pg-thumbnail {
a {
height: auto;
padding-top: 0;
}
img {
position: relative;
height: auto;
width: 100%;
}
}
}
}
// Item box shadow
.sek-module-inner .nb-item-box-shadow .sek-grid-items article {
-webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
}
// PAGINATION LINKS
// added for https://github.com/presscustomizr/nimble-builder/issues/490
.sek-post-navigation #sek-nav-below {
background-color: #f7f8f9;
margin-top: 20px;
padding: 5px;
.sek-pagination {
text-align: center;
ul {
display: inline-block;
vertical-align:
middle;
margin: 0
}
// &.sek-post-pagination {
// @extend .small;
// }
.page-numbers {
font-family: inherit;
opacity:0.7;
text-decoration: none!important;
}
.current {
font-weight: 600;
opacity:1;
}
.sek-pag-list > * {
margin: 0 5px;
}
.sek-pag-list {
margin: 0 -5px;
}
}
nav {
padding-top: 20px;;
padding-bottom: 20px;;
}
ul.sek-czr-pager {
margin: 0;
}
li {
display: inline-block;
font-size: 16px;
}
a, .sek-meta-nav-title {
text-transform: uppercase;
letter-spacing: 2px;
color: #5A5A5A;
&:hover{
color: #3b3b3b;
opacity: 1!important;
}
}
.sek-czr-pager > li {
display: block;
}
.sek-nav-dir {
display: block;
> a {
max-width: 100%;
}
}
a i.arrow {
font-size: 0.9em;
}
.page-numbers, a {
font-family: inherit;
line-height: 30px;
height: 30px;
display: inline-block;
vertical-align: middle;
transition: all 0.3s ease;
position: relative;
// @extend .demi-small;
// @extend .caps;
// @extend .letter-spacing-2;
}
//.post-prev a {
// left: $base-line-height;
//}
//.post-next a {
// right: $base-line-height;
//}
.sek-meta-nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
transition: all .2s,.6s ease;
opacity: .7;
}
a:hover {
.sek-meta-nav {
opacity: 1;
text-decoration: underline;
}
}
.sek-meta-nav-title {
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: middle;
font-size: 0.9em;
}
}
// NOV 2020 : max column number grows from 4 to 12
// Therefore the following rules are now generated server side which is much more flexible
// .sek-grid-layout.sek-all-col-1 {
// -ms-grid-columns: minmax(0,1fr);
// grid-template-columns: minmax(0,1fr);
// }
// .sek-grid-layout.sek-all-col-2 {
// -ms-grid-columns: minmax(0,1fr) 20px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 20px;
// grid-row-gap: 20px;
// }
// .sek-grid-layout.sek-all-col-3 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// .sek-grid-layout.sek-all-col-4 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// .sek-grid-layout.sek-all-col-5 {
// -ms-grid-columns: minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 10px;
// grid-row-gap: 10px;
// }
// .sek-grid-layout.sek-all-col-6 {
// -ms-grid-columns: minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr) 10px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 10px;
// grid-row-gap: 10px;
// }
// @include media-breakpoint-up(md) {
// .sek-post-grid-wrapper {
// .sek-grid-layout.sek-desktop-col-1 {
// -ms-grid-columns: minmax(0,1fr);
// grid-template-columns: minmax(0,1fr);
// }
// .sek-grid-layout.sek-desktop-col-2 {
// -ms-grid-columns: minmax(0,1fr) 20px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 20px;
// grid-row-gap: 20px;
// }
// .sek-grid-layout.sek-desktop-col-3 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// .sek-grid-layout.sek-desktop-col-4 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr);
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// }
// }
// @include media-breakpoint-between(sm, sm) {
// .sek-post-grid-wrapper {
// .sek-grid-layout.sek-tablet-col-1 {
// -ms-grid-columns: minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr)!important;
// }
// .sek-grid-layout.sek-tablet-col-2 {
// -ms-grid-columns: minmax(0,1fr) 20px minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr) minmax(0,1fr)!important;
// grid-column-gap: 20px;
// grid-row-gap: 20px;
// }
// .sek-grid-layout.sek-tablet-col-3 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)!important;
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// .sek-grid-layout.sek-tablet-col-4 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)!important;
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// }
// }
// @include media-breakpoint-only(xs) {
// .sek-post-grid-wrapper {
// .sek-grid-layout.sek-mobile-col-1 {
// -ms-grid-columns: minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr)!important;
// }
// .sek-grid-layout.sek-mobile-col-2 {
// -ms-grid-columns: minmax(0,1fr) 20px minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr) minmax(0,1fr)!important;
// grid-column-gap: 20px;
// grid-row-gap: 20px;
// }
// .sek-grid-layout.sek-mobile-col-3 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)!important;
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// .sek-grid-layout.sek-mobile-col-4 {
// -ms-grid-columns: minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr) 15px minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)!important;
// grid-column-gap: 15px;
// grid-row-gap: 15px;
// }
// }
// }
// $grid-breakpoints: (
// xs: 0,
// sm: 576px,
// md: 768px,
// lg: 992px,
// xl: 1200px
// ) !default;
// @include media-breakpoint-between(sm, sm) {
// .sek-post-grid-wrapper.sek-has-tablet-breakpoint {
// .sek-list-layout article {
// -ms-grid-columns: minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr)!important;//<= important because this property can be customized by users for desktop
// grid-gap: 0;
// .sek-pg-thumbnail {
// margin-bottom: 15px;
// }
// }
// // .sek-grid-layout {
// // &[class*="sek-desktop-col-"] {
// // grid-template-columns: minmax(0,1fr);
// // }
// // }
// }
// }
// @include media-breakpoint-only(xs) {
// .sek-post-grid-wrapper.sek-has-mobile-breakpoint {
// .sek-list-layout article {
// -ms-grid-columns: minmax(0,1fr)!important;
// grid-template-columns: minmax(0,1fr)!important;//<= important because this property can be customized by users for desktop
// grid-gap: 0;
// .sek-pg-thumbnail {
// margin-bottom: 15px;
// }
// }
// // .sek-grid-layout {
// // &[class*="sek-desktop-col-"] {
// // grid-template-columns: minmax(0,1fr);
// // }
// // }
// }
// }
wp-content/plugins/nimble-builder/assets/front/scss/modules/_quote.scss
+132
View File
@@ -0,0 +1,132 @@
/*************************************
* QUOTE MODULE
*************************************/
.sek-quote {
p {
margin: 0 0 .5em;
padding: 0;
}
.sek-cite {
font-size: 14px;
line-height: 1.5em;
font-style: inherit;
}
&[data-sek-quote-design="none"] { border-left: none;}//<= make sure the blockquote doesn't inherit another border style from the theme or a plugin
.sek-quote-content {
font-weight: 400;
font-size: 1.2em;//as defined as default value on module registration
line-height: 1.5em;
color: inherit;
}
&.sek-quote-design {
//reset
background: none;
font-style: inherit;
margin-right: 0;
margin-left: 0;
padding: 15px 0;
border: none;
> * {
padding: 0;
margin: 0;
}
&::before, &::after {
display: none;
}
.sek-cite {
padding: 0;
&::before {
display: none;
}
font-weight: normal;
}
.sek-quote-inner {
color: inherit;
}
&.sek-quote-icon-before .sek-quote-inner{
@if ( true == $is_rtl ) {
padding-right: calc( 10px + 0.7 * 50px );//50px is the default size of the quote icon, this CSS rule is overriden in dyn CSS if user changes the font size of the icon
}
@else {
padding-left: calc( 10px + 0.7 * 50px );//50px is the default size of the quote icon, this CSS rule is overriden in dyn CSS if user changes the font size of the icon
}
}
//border before
&.sek-border-before {
@if ( true == $is_rtl ) {
padding-right: 15px;
border-right: 5px solid rgba(0,0,0,.1);;
}
@else {
padding-left: 15px;
border-left: 5px solid rgba(0,0,0,.1);;
}
.sek-cite {
clear: both;
display: block;
margin-top: 1.5em;
position: relative;
//font-style: italic;
@if ( true == $is_rtl ) {
padding-right: 2.2em;
padding-left: 0.25em;
}
@else {
padding-left: 2.2em;
padding-right: 0.25em;
}
&::before {
display: block;
content: '';
top: 1em;
position: absolute;
background: none;
width: 2em;
height: auto;
@if ( true == $is_rtl ) {
right: 0;
}
@else {
left: 0;
}
//border color inherited from the text color
border-top: 1px solid;
}
}
}
//icon before
&.sek-quote-icon-before {
position: relative;
display: flex;
.sek-quote-content *:last-child {
margin-bottom: .75em;
}
&::before {
// Feb 2020 => replaced font awesome by a unicode character well supported
// see https://github.com/presscustomizr/nimble-builder/issues/603
content: "\275D";//https://unicode-table.com/en/275D/
font-family: "Arial Unicode MS", Code2000;//<= https://www.fileformat.info/info/unicode/char/275D/fontsupport.htm
font-size: 50px;
line-height: 1em;
color: #ccc;
font-style: normal;
text-align: center;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-variant: normal;
text-rendering: auto;
display: flex;
width: auto;
margin: 0;
@if ( true == $is_rtl ) {
right: 0;
}
@else {
left: 0;
}
position: absolute;
top: 10px;
}
}
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_shortcode.scss
+12
View File
@@ -0,0 +1,12 @@
/*************************************
* SHORTCODE MODULE
*************************************/
[data-sek-module-type="czr_shortcode_module"] [data-sek-use-flexbox="true"] {
// implemented to fix : https://github.com/presscustomizr/nimble-builder/issues/565
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_simple_form.scss
+94
View File
@@ -0,0 +1,94 @@
/*************************************
* SIMPLE FORM MODULE
*************************************/
.#{$project-prefix}simple-form-wrapper {
input[type=text], textarea {
font-size: 16px;
width: 100% !important;
padding: 0.4em 0.5em;
border-radius: 3px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
outline: none;
font-weight: normal;
max-width: 100%;
border: none;
color: #555555;
background-color: #ffffff;
}
textarea {
height: auto;
max-height: 150px;
}
.sek-form-field {
margin-bottom: 15px;
clear: both;
}
label {
// font-family: "Lucida Grande","Lucida Sans Unicode",Tahoma,sans-serif;
color: #444444;
font-weight: bold;
text-align: left;
margin: 0;
padding: 0 0 3px 0;
width: auto;
display: block;
}
&.use-outset-shadow .sek-form-field input[type="text"], &.use-outset-shadow .sek-form-field textarea {
-webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2) !important;
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2) !important;
}
&.use-inset-shadow .sek-form-field input[type="text"], &.use-inset-shadow .sek-form-field textarea {
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
}
#sek-form-respond {
padding: 20px 0;
}
input[type="checkbox"] + label {
display: inline;
font-weight: bold;
margin-left: 0.5rem;
}
}
// Submission message
.sek-form-message {
padding: 10px;
margin: 10px 0;
text-align: center;
line-height: 1.5em;
font-size: 16px;
border-radius: 4px;
&.sek-mail-failure {
color: #ff0000;
border: 1px solid #ff0000;
background: none;
background: rgba(255, 0, 0, 0.05);
}
&.sek-mail-success {
color: #008000;
border: 1px solid #008000;
background: none;
background: rgba(0, 128, 0, 0.05);
}
&.sek-mail-aborted {
color: #ffa500;
border: 1px solid #ffa500;
background: none;
background: rgba(255, 165, 0, 0.05);
}
}
// Badge visibility
.grecaptcha-badge {
z-index: 1;//fixes badge not visible in the Customizr theme.
}
.sek-hide-rc-badge .grecaptcha-badge {
display: none;
}
.sek-show-rc-badge .grecaptcha-badge {
display: block;
visibility: visible!important;
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_social_icons.scss
+23
View File
@@ -0,0 +1,23 @@
/*************************************
* SOCIAL ICONS MODULE
*************************************/
[data-sek-module-type="czr_social_icons_module"] .sek-module-inner .sek-social-icons-wrapper {
margin: 10px 0; //consistent with the 'spacing' default value on module registration
}
.nb-loc .sek-module-inner .sek-social-icons-wrapper {
text-align: center; //consistent with the 'h_alignment_css' default value on module registration
> *:not(:last-child) { padding-right: 8px; }
> li {
display: inline-block;
a { color: #707070; }// <= consistent with default
.sek-social-icon {
font-size: 28px;//<= same as in Hueman theme
line-height: 1.5em; //consistent with the default registration param
}
.sek-social-icon {
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
}
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_spacer.scss
+6
View File
@@ -0,0 +1,6 @@
/*************************************
* SPACER MODULE
*************************************/
.sek-module-inner .sek-spacer {
height: 20px;
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_special_image.scss
+135
View File
@@ -0,0 +1,135 @@
/*************************************
* NIMBLE IMAGE MODULE
*************************************/
.sek-nimble-image-wrapper {
max-width: 100%;
overflow: hidden;
width: 100%;
position: relative;
display: block;
background-position: center center;
background-size: cover;
&::before {
content: '';
display: block;
padding-top: 100%;
}
display: flex;
align-items: center;
justify-content: center;
backface-visibility: hidden;
transform-style: preserve-3d;
@at-root .nb-loc [data-sek-level] .sek-module-inner .sek-nimble-image-wrapper a {
color: #ffffff;
&:hover {
color: #ffffff;
}
}
.nb-icon-text-wrapper {
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
top: 0;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
align-items: center;
justify-content: center;
//background-color: rgba(206,206,206,0.5);
.nb-pro-img-icon {
font-size: 80px;
line-height: 1em;
color: #000000;
transition: all .3s ease;
}
.nb-pro-img-text, .nb-pro-img-text * {
color: #000000;
font-size: 16px;
line-height: 1.5em;
font-weight: 400;
transition: all .3s ease;
}
.nb-pro-img-text p {
margin: 0;
padding: 0;
}
}
//hover color consistent with default value
&.nb-icon-has-hover-color:hover .nb-pro-img-icon {
color: #969696;
}
}
.sek-nimble-image-mask {
position: absolute;
border-color: #fff;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow: hidden;
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
&::before {
position: absolute;
content: '';
z-index: 1;
border: 150vw solid;
border-color: inherit;
box-sizing: content-box;
transition: all .3s ease;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
// .sek-nimble-image-wrapper.nb-mask-expand &,
// .sek-nimble-image-wrapper.nb-mask-always-shrinked & {
// width: 63%;
// padding-bottom: 63%;
// }
// .sek-nimble-image-wrapper.nb-mask-expand.hover &,
// .sek-nimble-image-wrapper.nb-mask-expand:hover & {
// width: 88%;
// padding-bottom: 88%;
// }
.sek-module-inner .sek-nimble-image-wrapper.nb-mask-expand:hover &,
.sek-module-inner .sek-nimble-image-wrapper.nb-mask-shrink &,
.sek-module-inner .sek-nimble-image-wrapper.nb-mask-always-expanded & {
width: 88%;
padding-bottom: 88%;
}
.sek-module-inner .sek-nimble-image-wrapper.nb-mask-shrink:hover &,
.sek-module-inner .sek-nimble-image-wrapper.nb-mask-expand &,
.sek-module-inner .sek-nimble-image-wrapper.nb-mask-always-shrinked & {
width: 63%;
padding-bottom: 63%;
}
// .sek-nimble-image-wrapper.expanded &,
// .sek-nimble-image-wrapper.nb-mask-expand.hover &,
// .sek-nimble-image-wrapper.nb-mask-expand:hover & {
// transform: scale(1.4);
// }
}
.sek-nimble-image-wrapper.nb-circle-mask &::before {
border-radius: 50%;
}
}
.sek-nimble-image {
position: absolute;
width: 100%;
height: 100%;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
z-index: 0;
top: 0;
}
wp-content/plugins/nimble-builder/assets/front/scss/modules/_tiny_mce_editor.scss
+8
View File
@@ -0,0 +1,8 @@
/*************************************
* TINY MCE EDITOR MODULE
*************************************/
[data-sek-module-type="czr_tiny_mce_editor_module"] {
// Could be improved in the future
// see https://css-tricks.com/styling-underlines-web/ and http://benjam.info/blog/posts/2015-01-31-css-underline/
a{text-decoration: underline;}
}