| Current Path : /home/krobertfnz/www/wp-content/updraft/themes-old/nex/vamtam/assets/css/ |
| Current File : /home/krobertfnz/www/wp-content/updraft/themes-old/nex/vamtam/assets/css/buttons.less |
// common styles for dynamically generated buttons (to be used with .button-gen())
.button-gen-common() {
display: inline-block;
text-align: center;
cursor: pointer;
position: relative;
z-index: 0;
vertical-align: middle;
-ms-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
text-decoration: none;
text-shadow: none;
-webkit-font-smoothing: auto;
transition: color .3s ease-out, border .3s ease-out, background .3s ease-out, box-shadow .3s ease-out !important; // !important necessary for RevSlider compatibility (>=5.1)
font: normal 14px/1em var( --vamtam-primary-font-font-family );
&:focus {
outline: 1px dotted #000;
}
&:hover {
text-decoration: none;
}
}
.button-gen-solid-common() {
border-radius: 0px;
border: none;
padding: 16px 30px;
-webkit-font-smoothing: auto;
}
.button-gen-solid() {
.button-gen-common();
.button-gen-solid-common();
}
.button-gen-underline-common() {
line-height: 1.2em;
padding: 0px 0px 2px 0px;
border-bottom: 2px solid;
}
.button-gen-underline() {
.button-gen-common();
.button-gen-underline-common();
}
.button-gen-border-common() {
border-radius: 0px;
box-shadow: none;
padding: 14px 29px;
border: 1px solid;
}
.button-gen-common-sc() {
.button-gen-common();
&.button-solid {
.button-gen-solid-common();
}
&.button-border {
.button-gen-border-common();
}
&.button-underline {
.button-gen-underline-common();
}
}
// mixins for generating button styles based on their background color
//
// this MUST include only colors
.button-gen( @bgcolor ) {
background: var( e( @bgcolor ) );
color: var( e( "@{bgcolor}-hc" ) );
box-shadow: 0 0 25px -14px var( e( @bgcolor ) );
}
.button-gen-border( @bgcolor ) {
background: rgba( var( e( "@{bgcolor}-rgb" ) ), 0 );
color: var( e( @bgcolor ) );
border-color: var( e( @bgcolor ) );
}
.button-gen-sc( @bgcolor ) {
&.button-solid {
.button-gen( @bgcolor );
}
&.button-border,
&.button-underline {
.button-gen-border( @bgcolor )
}
}
/////////////////
.button-gen-hover( @bgcolor ) {
&:hover {
background: var( e( @bgcolor ) );
color: var( e( "@{bgcolor}-hc" ) );
box-shadow: 0 0 25px -14px var( e( @bgcolor ) );
}
}
.button-gen-border-hover( @bgcolor ) {
&:hover {
border-color: var( e( @bgcolor ) );
background: var( e( @bgcolor ) );
color: var( e( "@{bgcolor}-hc" ) );
}
}
.button-gen-underline-hover( @bgcolor ) {
&:hover {
color: var( e( @bgcolor ) );
border-color: var( e( @bgcolor ) );
}
}
.button-gen-hover-sc( @bgcolor ) {
&.button-solid {
.button-gen-hover( @bgcolor );
}
&.button-border {
.button-gen-border-hover( @bgcolor );
}
&.button-underline {
.button-gen-underline-hover( @bgcolor );
}
}
/////////////////////////////////////////////////////
// submit buttons and a catch-all selector which may style some plugins
.button,
button,
input[type=button],
input[type=submit],
.woocommerce.widget_shopping_cart .widget_shopping_cart_content .buttons a.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce #content input.button,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.woocommerce-page #respond input#submit,
.woocommerce-page #content input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
#tribe-events-content .tribe-common .tribe-common-c-btn {
.button-gen-solid();
.button-gen( '--vamtam-accent-color-1' );
.button-gen-hover( '--vamtam-accent-color-6' );
}
// actual buttons below
.vamtam-button {
.button-gen-common-sc();
&.accent1 { .button-gen-sc( '--vamtam-accent-color-1' ); }
&.accent2 { .button-gen-sc( '--vamtam-accent-color-2' ); }
&.accent3 { .button-gen-sc( '--vamtam-accent-color-3' ); }
&.accent4 { .button-gen-sc( '--vamtam-accent-color-4' ); }
&.accent5 { .button-gen-sc( '--vamtam-accent-color-5' ); }
&.accent6 { .button-gen-sc( '--vamtam-accent-color-6' ); }
&.accent7 { .button-gen-sc( '--vamtam-accent-color-7' ); }
&.accent8 { .button-gen-sc( '--vamtam-accent-color-8' ); }
&.hover-accent1 { .button-gen-hover-sc( '--vamtam-accent-color-1' ); }
&.hover-accent2 { .button-gen-hover-sc( '--vamtam-accent-color-2' ); }
&.hover-accent3 { .button-gen-hover-sc( '--vamtam-accent-color-3' ); }
&.hover-accent4 { .button-gen-hover-sc( '--vamtam-accent-color-4' ); }
&.hover-accent5 { .button-gen-hover-sc( '--vamtam-accent-color-5' ); }
&.hover-accent6 { .button-gen-hover-sc( '--vamtam-accent-color-6' ); }
&.hover-accent7 { .button-gen-hover-sc( '--vamtam-accent-color-7' ); }
&.hover-accent8 { .button-gen-hover-sc( '--vamtam-accent-color-8' ); }
}
/* RevSLider Buttons */
.rev-btn.rev-withicon i.vamtam-arrow-right-sample,
.rev-btn.rev-withicon i.vamtam-arrow-left-sample,
.rev-btn.rev-withicon i.vamtam-arrow-top-sample,
.rev-btn.rev-withicon i.vamtam-arrow-bottom-sample {
margin: 0px !important;
font-size: 24px;
font-family: theme;
}
.vamtam-arrow-left-sample:before {
content: icon( vamtam-theme-arrow-left-sample );
}
.vamtam-arrow-right-sample:before {
content: icon( vamtam-theme-arrow-right-sample );
}
.vamtam-arrow-top-sample:before {
content: icon( vamtam-theme-arrow-top-sample );
}
.vamtam-arrow-bottom-sample:before {
content: icon( vamtam-theme-arrow-bottom-sample );
}
/* Underline buttons */