This commit is contained in:
KhaiNguyen
2020-02-13 10:39:37 +07:00
commit 59401cb805
12867 changed files with 4646216 additions and 0 deletions

View File

@@ -0,0 +1,274 @@
@vcui-button-border: 1px;
@vcui-button-transition-duration: .2s;
@vcui-button-transition-properties: color, background, border, opacity, transform;
@vcui-button-shape-rounded-radius: 3px;
@vcui-control-button-opacity: .8;
// sizes
// md size (default)
@vcui-button-size-md-vertical: 14px;
@vcui-button-size-md-horizontal: 21px;
@vcui-button-size-md-font-size: 14px;
@vcui-button-size-md-line-height: 1.4;
@vcui-button-message-size-md-horizontal: 8px;
// sm size
@vcui-button-size-sm-vertical: 8px;
@vcui-button-size-sm-horizontal: 21px;
@vcui-button-size-sm-font-size: 14px;
@vcui-button-size-sm-line-height: 1.4;
@vcui-button-message-size-md-horizontal: 8px;
// States
// State default
@vcui-button-default-color: #fff;
@vcui-button-default-background: #bcbcbc;
@vcui-button-message-default-color: darken(@vcui-button-default-background, 10%);
// State success
@vcui-button-success-color: #fff;
@vcui-button-success-background: #7bcd2d;
@vcui-button-message-success-color: darken(desaturate(@vcui-button-success-background, 20%), 10%);
// State danger
@vcui-button-danger-color: #fff;
@vcui-button-danger-background: #ff7877;
@vcui-button-message-danger-color: darken(desaturate(@vcui-button-danger-background, 20%), 10%);
// State action
@vcui-button-action-color: #fff;
@vcui-button-action-background: #0473aa;
@vcui-button-message-action-color: darken(desaturate(@vcui-button-action-background, 10%), 5%);
// State info
@vcui-button-info-color: #fff;
@vcui-button-info-background: #00aeee;
@vcui-button-message-info-color: darken(desaturate(@vcui-button-info-background, 20%), 10%);
// State warning
@vcui-button-warning-color: #fff;
@vcui-button-warning-background: #feb710;
@vcui-button-message-warning-color: darken(desaturate(@vcui-button-warning-background, 20%), 10%);
// State disabled
@vcui-button-disabled-color: #F3F3F3;
@vcui-button-disabled-background: #D8D8D8;
@vcui-button-message-disabled-color: darken(desaturate(@vcui-button-disabled-background, 10%), 5%);
// ui button
.vc_general.vc_ui-button {
display: inline-block;
margin: 0;
text-align: center;
vertical-align: middle;
cursor: pointer;
background: transparent;
border: @vcui-button-border solid transparent;
box-sizing: border-box;
word-wrap: break-word;
user-select: none;
text-decoration: none;
position: relative;
transition-property: @vcui-button-transition-properties;
transition-duration: @vcui-button-transition-duration;
transition-timing-function: ease-in-out;
outline: none;
font-weight: 400;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
#vc_ui-button > .make-size(
@padding-vertical: @vcui-button-size-md-vertical;
@padding-horizontal: @vcui-button-size-md-horizontal;
@font-size: @vcui-button-size-md-font-size;
);
&:hover,
&:focus {
border: @vcui-button-border solid transparent;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
}
.vc_ui-button {
// shapes
#vc_ui-button > .make-shape(~'vc_ui-button-shape-rounded'; @vcui-button-shape-rounded-radius);
// states
#vc_ui-button > .make-state(
~'vc_ui-button-default';
@text: @vcui-button-default-color;
@background: @vcui-button-default-background;
);
#vc_ui-button > .make-state(
~'vc_ui-button-success';
@text: @vcui-button-success-color;
@background: @vcui-button-success-background;
);
#vc_ui-button > .make-state(
~'vc_ui-button-danger';
@text: @vcui-button-danger-color;
@background: @vcui-button-danger-background;
);
#vc_ui-button > .make-state(
~'vc_ui-button-action';
@text: @vcui-button-action-color;
@background: @vcui-button-action-background;
);
#vc_ui-button > .make-state(
~'vc_ui-button-info';
@text: @vcui-button-info-color;
@background: @vcui-button-info-background;
);
#vc_ui-button > .make-state(
~'vc_ui-button-success';
@text: @vcui-button-success-color;
@background: @vcui-button-success-background;
);
#vc_ui-button > .make-state(
~'vc_ui-button-warning';
@text: @vcui-button-warning-color;
@background: @vcui-button-warning-background;
);
&[disabled]:not(.vc_ui-button-undisabled) {
color: @vcui-button-disabled-color;
background-color: @vcui-button-disabled-background;
cursor: not-allowed;
&:hover,
&:focus {
background-color: @vcui-button-disabled-background;
}
}
}
//sizes
.vc_general.vc_ui-button {
&.vc_ui-button-size-sm {
#vc_ui-button > .make-size(
@padding-vertical: @vcui-button-size-sm-vertical;
@padding-horizontal: @vcui-button-size-sm-horizontal;
@font-size: @vcui-button-size-sm-font-size;
);
}
}
// ui button message
.vc_ui-button-message {
display: inline-block;
vertical-align: middle;
font-size: @vcui-button-size-md-font-size;
// states
#vc_ui-button > .make-state(
~'vc_ui-button-message-default';
@text: @vcui-button-message-default-color;
);
#vc_ui-button > .make-state(
~'vc_ui-button-message-success';
@text: @vcui-button-message-success-color;
);
#vc_ui-button > .make-state(
~'vc_ui-button-message-danger';
@text: @vcui-button-message-danger-color;
);
#vc_ui-button > .make-state(
~'vc_ui-button-message-action';
@text: @vcui-button-message-action-color;
);
}
// control button
.vc_general.vc_ui-control-button {
display: inline-block;
text-align: center;
vertical-align: middle;
cursor: pointer;
background: transparent;
color: inherit;
border: none;
box-sizing: border-box;
word-wrap: break-word;
user-select: none;
text-decoration: none;
transition-property: @vcui-button-transition-properties;
transition-duration: @vcui-button-transition-duration;
transition-timing-function: ease-in-out;
opacity: @vcui-control-button-opacity;
outline: none;
&:hover,
&:focus {
opacity: 1;
background-color: transparent;
}
&:active {
box-shadow: none;
}
&[disabled] {
opacity: @vcui-control-button-opacity;
cursor: default;
}
// pixel icon behaviour
.vc_ui-icon-pixel {
vertical-align: top;
}
}
// MIXINS
#vc_ui-button {
// make size
.make-size(@padding-vertical: false; @padding-horizontal: false; @font-size: false; @line-height: false) {
& when not (@padding-vertical = false) {
padding-top: @padding-vertical;
padding-bottom: @padding-vertical;
}
& when not (@padding-horizontal = false) {
padding-left: @padding-horizontal;
padding-right: @padding-horizontal;
}
& when not (@font-size = false) {
font-size: @font-size;
}
& when not (@line-height = false) {
font-size: @line-height;
}
}
// make shape
.make-shape(@selector; @border-radius) {
&.@{selector} {
border-radius: @border-radius;
}
}
// make state
.make-state(@selector; @text: false; @background: false; @border: false) {
&.@{selector} {
& when not (@text = false) {
color: @text;
}
& when not (@background = false) {
background-color: @background;
&:hover,
&:focus {
& when (lightness(@background) > 70%) {
background-color: darken(@background, 5%);
}
& when not (lightness(@background) > 70%) {
background-color: darken(@background, 3%);
}
}
}
& when not (@border = false) {
border-color: @border;
}
}
}
}

View File

@@ -0,0 +1,65 @@
@import 'vc_ui-list-bar.less';
@vcui-dropdown: 1px;
@vcui-dropdown-font-size: 13px;
@vc-ui-list-bar-o-bounded-rows-count: 7;
@vc-ui-list-bar-item-trigger-width: 200px;
.vc_ui-dropdown {
position: relative;
&.vc_active,
&.vc_animating {
.vc_ui-dropdown-content {
display: block;
}
}
.vc_ui-dropdown-trigger {
}
.vc_ui-dropdown-content {
box-sizing: content-box;
display: none;
overflow: hidden;
transition-property: height, padding;
transition-duration: .2s;
transition-timing-function: ease-in-out;
position: absolute;
z-index: 120;
top: 100%;
left: 0;
box-shadow: 0 0 5px rgba(0, 0, 0, .1);
}
// list bar behaviour
.vc_ui-list-bar-o-bounded {
max-height: (@vc-ui-list-bar-item-padding-vertical * 2 + @vc-ui-list-bar-font-size) * @vc-ui-list-bar-o-bounded-rows-count;
overflow-y: auto;
overflow-x: hidden;
}
.vc_ui-list-bar-item-trigger {
width: @vc-ui-list-bar-item-trigger-width;
flex: 1;
&[disabled] {
cursor: not-allowed;
background: #f5f5f5;
color: #bbbaba;
}
}
}
.vc_ui-settings-button {
.vc-c-icon-check {
display: none;
}
&.vc_done {
.vc-c-icon-check {
display: inline-block;
}
.vc-c-icon-cog {
display: none;
}
}
}

View File

@@ -0,0 +1,85 @@
/* bootstrap reference bug */
@import (reference)"../../config/variables.less";
@import (reference)"../../lib/grid.less";
/* / bootstrap reference bug */
@vc_media-xs-width: 350px;
@vc_media-sm-width: 700px;
@vc_media-md-width: 1050px;
@vc_media-lg-width: 1000px;
.vc_ui-flex-row {
&.vc_row {
display: flex;
flex-wrap: wrap;
&::before,
&::after {
width: 0;
}
}
[class*=vc_col] {
width: 100%;
}
}
.vc_make-media-grid(xs);
.vc_make-media-grid(sm);
.vc_make-media-grid(md);
.vc_make-media-grid(lg);
.vc_float-media-grid-columns(@class) {
// initial
.vc_col(@index) when (@index = 1) {
@item: ~".vc_media-@{class} .vc_col-@{class}-@{index}";
.vc_col((@index + 1), @item);
}
// general
.vc_col(@index, @list) when (@index =< @grid-columns) {
@item: ~".vc_media-@{class} .vc_col-@{class}-@{index}";
.vc_col((@index + 1), ~"@{list}, @{item}");
}
// terminal
.vc_col(@index, @list) when (@index > @grid-columns) {
@{list} {
float: left;
}
}
.vc_col(1); // kickstart it
}
.vc_float-media-grid-columns-rtl(@class) {
// initial
.vc_col-rtl(@index) when (@index = 1) {
@item: ~"[dir=rtl] .vc_rtl-columns-reverse .vc_media-@{class} .vc_col-@{class}-@{index}";
.vc_col-rtl((@index + 1), @item);
}
// general
.vc_col-rtl(@index, @list) when (@index =< @grid-columns) {
@item: ~"[dir=rtl] .vc_rtl-columns-reverse .vc_media-@{class} .vc_col-@{class}-@{index}";
.vc_col-rtl((@index + 1), ~"@{list}, @{item}");
}
// terminal
.vc_col-rtl(@index, @list) when (@index > @grid-columns) {
@{list} {
float: right;
}
}
.vc_col-rtl(1); // kickstart it
}
.vc_make-media-grid(@class) {
.vc_float-media-grid-columns(@class);
.vc_float-media-grid-columns-rtl(@class);
.vc_media-@{class} {
.vc_loop-grid-columns(@grid-columns, @class, width);
.vc_loop-grid-columns(@grid-columns, @class, pull);
.vc_loop-grid-columns(@grid-columns, @class, push);
.vc_loop-grid-columns(@grid-columns, @class, offset);
}
}

View File

@@ -0,0 +1,6 @@
//Fonts
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=cyrillic,latin,greek);
.vc_ui-font-open-sans {
font-family: "Open Sans", Helvetica, sans-serif!important;
}

View File

@@ -0,0 +1,7 @@
// Gaps
.vc_ui-grid-gap {
> [class],
> * {
margin-bottom: @vcui-panel-header-gap;
}
}

View File

@@ -0,0 +1,16 @@
// Helpers
@vcui-help-block-color: #929292;
.vc_ui-help-block {
color: @vcui-help-block-color;
font-style: italic;
a {
font-weight: 600;
color: darken(@vcui-help-block-color, 5%);
text-decoration: none;
border: none;
&:hover {
color: darken(@vcui-help-block-color, 15%);
}
}
}

View File

@@ -0,0 +1,209 @@
@vcui-icon-pixel-border: 1px;
@vcui-icon-pixel-size-sm: 12px;
@vcui-icon-pixel-size-md: 24px;
.vc_ui-icon-pixel {
display: inline-block;
vertical-align: middle;
font-style: normal;
font-size: 1em;
height: 1em;
padding-top: .5em;
box-sizing: border-box;
&::before {
content: '';
display: block;
background: transparent url(../vc/editors/ui/vc_ui-icon-pixel/vc_ui-sprite.png) no-repeat;
line-height: 1;
transform: translateY(-50%);
}
}
.vc_ui-icon-pixel-info {
&::before {
height: 22px;
width: 22px;
background-position: -1px -1px;
font-size: 22px;
}
}
.vc_ui-icon-pixel-close {
&::before {
height: 16px;
width: 16px;
background-position: -4px -28px;
font-size: 16px;
}
}
.vc_ui-icon-pixel-minimize {
&::before {
height: 16px;
width: 16px;
background-position: -4px -52px;
font-size: 16px;
}
}
.vc_ui-icon-pixel-cog {
&::before {
height: 20px;
width: 20px;
background-position: -2px -74px;
font-size: 20px;
}
}
.vc_ui-icon-pixel-lt-sm {
&::before {
height: 12px;
width: 8px;
background-position: -2px -96px;
font-size: 12px;
}
}
.vc_ui-icon-pixel-gt-sm {
&::before {
height: 12px;
width: 8px;
background-position: -15px -96px;
font-size: 12px;
}
}
.vc_ui-icon-pixel-times-sm {
&::before {
height: 12px;
width: 12px;
background-position: 0 -108px;
font-size: 12px;
}
}
.vc_ui-icon-pixel-times-grey-sm {
&::before {
height: 12px;
width: 12px;
background-position: -1px -192px;
font-size: 12px;
}
}
.vc_ui-icon-pixel-plus-sm {
&::before {
height: 12px;
width: 12px;
background-position: -12px -108px;
font-size: 12px;
}
}
.vc_ui-icon-pixel-times {
&::before {
height: 14px;
width: 14px;
background-position: -5px -125px;
font-size: 12px;
}
}
.vc_ui-icon-pixel-check {
&::before {
height: 14px;
width: 17px;
background-position: -4px -150px;
font-size: 14px;
}
}
.vc_ui-icon-pixel-search {
&::before {
height: 15px;
width: 15px;
background-position: -5px -173px;
font-size: 15px;
}
}
.vc_ui-icon-pixel-control-plus {
&::before {
height: 18px;
width: 18px;
background-position: -3px -204px;
font-size: 18px;
}
}
.vc_ui-icon-pixel-control-edit {
&::before {
height: 26px;
width: 24px;
background-position: 0 -246px;
font-size: 26px;
}
}
.vc_ui-icon-pixel-control-template {
&::before {
height: 23px;
width: 23px;
background-position: 0 -222px;
font-size: 23px;
}
}
.vc_ui-icon-pixel-control-trash-dark {
&::before {
height: 17px;
width: 16px;
background-image: url(../vc/editors/ui/vc_ui-icon-pixel/controls.png);
background-position: -16px -64px;
font-size: 17px;
}
}
.vc_ui-icon-pixel-control-search-dark {
&::before {
height: 14px;
width: 14px;
background-image: url(../vc/editors/ui/vc_ui-icon-pixel/controls.png);
background-position: -17px -97px;
font-size: 14px;
}
}
.vc_ui-icon-pixel-control-edit-dark {
&::before {
height: 16px;
width: 16px;
background-image: url(../vc/editors/ui/vc_ui-icon-pixel/controls.png);
background-position: -16px -32px;
font-size: 16px;
}
}
.vc_ui-icon-pixel-control-add-dark {
&::before {
height: 14px;
width: 14px;
background-image: url(../vc/editors/ui/vc_ui-icon-pixel/controls.png);
background-position: -17px -17px;
font-size: 14px;
}
}
.vc_ui-icon-pixel-control-triangle-desc-dark {
&::before {
height: 7px;
width: 11px;
background-image: url(../vc/editors/ui/vc_ui-icon-pixel/controls.png);
background-position: -18px -165px;
font-size: 7px;
}
}
.vc_ui-icon-pixel-control-triangle-asc-dark {
&::before {
height: 7px;
width: 11px;
background-image: url(../vc/editors/ui/vc_ui-icon-pixel/controls.png);
background-position: -18px -181px;
font-size: 7px;
}
}

View File

@@ -0,0 +1,72 @@
@vc-ui-list-bar-border-size: 1px;
@vc-ui-list-bar-border-color: #dbdbdb;
@vc-ui-list-bar-background: #f5f5f5;
@vc-ui-list-bar-background-hover: #eaeaea;
@vc-ui-list-bar-trigger-color: #5e5e5e;
@vc-ui-list-bar-item-padding-vertical: 10px;
@vc-ui-list-bar-item-padding-horizontal: 10px;
@vc-ui-list-bar-font-size: 13px;
// list bar
.vc_ui-list-bar {
margin: 0;
padding: 0;
list-style: none;
border: @vc-ui-list-bar-border-size solid @vc-ui-list-bar-border-color;
& + .vc_ui-list-bar {
border-top-width: 0;
}
background: @vc-ui-list-bar-background;
font-size: @vc-ui-list-bar-font-size;
}
.vc_ui-list-bar-item {
margin: 0;
padding: 0;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
transition-property: color, background;
transition-duration: .2s;
transition-timing-function: ease-in-out;
&:hover {
background: @vc-ui-list-bar-background-hover;
.vc_ui-list-bar-item-actions {
visibility: visible;
opacity: 1;
}
}
}
.vc_ui-list-bar-item-trigger {
font-size: @vc-ui-list-bar-font-size;
line-height: 1;
text-transform: none;
color: @vc-ui-list-bar-trigger-color;
background: transparent;
border: none;
text-decoration: none;
text-align: left;
padding: @vc-ui-list-bar-item-padding-vertical @vc-ui-list-bar-item-padding-horizontal;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
font-weight: 400;
cursor: pointer;
&:hover {
background: transparent;
}
}
.vc_ui-list-bar-item-actions {
padding-left: @vc-ui-list-bar-item-padding-vertical;
padding-right: @vc-ui-list-bar-item-padding-vertical;
visibility: hidden;
opacity: 0;
transition-property: opacity;
transition-duration: .2s;
transition-timing-function: ease-in-out;
}
.vc_ui-list-bar-group {
}

View File

@@ -0,0 +1,52 @@
// Loaders
@vc_ui-wp-spinner-svg-src: '../vc/loaders/spinner.svg';
@vc_ui-wp-spinner-light-svg-src: '../vc/loaders/spinner-light.svg';
@vc_ui-wp-spinner-animation-duration: 1.08s;
@vc_ui-wp-spinner-base-size: 16px;
.vc_ui-wp-spinner {
margin: 0;
padding: 0;
height: 1em;
width: 1em;
display: inline-block;
vertical-align: middle;
opacity: .7;
position: relative;
&::before {
content: '';
display: block;
height: @vc_ui-wp-spinner-base-size;
width: @vc_ui-wp-spinner-base-size;
background: transparent url(@vc_ui-wp-spinner-light-svg-src) 50% 50% no-repeat;
background-size: contain;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
animation: vc_ui-wp-spinner-animation @vc_ui-wp-spinner-animation-duration linear infinite;
}
&.vc_ui-wp-spinner-lg {
&::before {
height: @vc_ui-wp-spinner-base-size * 2;
width: @vc_ui-wp-spinner-base-size * 2;
}
}
&.vc_ui-wp-spinner-dark {
&::before {
background-image: url(@vc_ui-wp-spinner-svg-src);
}
}
}
@keyframes vc_ui-wp-spinner-animation {
from {
transform: translate(-50%, -50%) rotate(0deg);
}
to {
transform: translate(-50%, -50%) rotate(360deg);
}
}

View File

@@ -0,0 +1,18 @@
.vc_ui-panel {
.vc_panel-tabs {
> .vc_edit-form-tab {
&.vc_row {
display: none;
flex-wrap: wrap;
&::before,
&::after {
width: 0;
}
}
&.vc_active {
display: flex;
}
}
}
}

View File

@@ -0,0 +1,126 @@
@import "vc_ui-panel/vc_ui-panel-content.less";
@import "vc_ui-list-bar.less";
@import "vc_ui-icon-pixel.less";
@vcui-template-list-border: #e2e2e2;
@vcui-template-list-background: #f9f9f9;
@vcui-template-list-trigger-color: #5e5e5e;
@vcui-template-list-trigger-color-hover: #23282d;
.vc_ui-template-list {
//border: 1px solid red
&.vc_ui-list-bar {
border: none;
margin-left: -@vcui-panel-content-padding-horizontal;
margin-right: -@vcui-panel-content-padding-horizontal;
margin-bottom: -@vcui-panel-content-padding-vertical;
background: transparent;
}
.vc_ui-list-bar-item {
border: 1px solid @vcui-template-list-border;
border-left: none;
border-right: none;
position: relative;
&:hover {
background-color: @vcui-template-list-background;
}
}
.vc_ui-list-bar-item-actions {
padding-left: @vcui-panel-content-padding-horizontal;
padding-right: @vcui-panel-content-padding-horizontal;
}
.vc_ui-control-button {
padding-left: .2em;
padding-right: .2em;
.vc-composer-icon {
font-size: 20px;
margin: 0 3px;
&.vc-c-icon-add {
font-size: 14px;
}
&.vc-c-icon-delete_empty {
font-size: 12px;
}
}
.vc_ui-wp-spinner {
margin: 0;
height: 16px;
width: 16px;
&::before {
&:extend(.vc_ui-wp-spinner::before);
}
}
}
.vc_active, .vc_loading {
.vc_ui-list-bar-item {
background-color: @vcui-template-list-background;
}
.vc_ui-list-bar-item-actions {
visibility: visible;
opacity: 1;
}
}
.vc_ui-list-bar-item-trigger {
padding: @vcui-panel-content-padding-horizontal;
font-weight: 600;
outline: none;
transition-property: color;
transition-duration: .2s;
transition-timing-function: ease-in-out;
color: @vcui-template-list-trigger-color;
&:hover {
color: @vcui-template-list-trigger-color-hover;
}
}
.vc_ui-preset {
&:not(:last-child) {
margin-bottom: -1px;
}
&:last-child:not(.vc_active) {
border-bottom: none;
}
}
.vc_ui-preset-content {
box-sizing: content-box;
display: none;
overflow: hidden;
transition-property: height, padding;
transition-duration: .2s;
transition-timing-function: ease-in-out;
padding: 0;
}
.vc_active,
.vc_animating {
.vc_ui-template-content {
display: block;
}
}
}
#vc_ui-panel-preset {
width: 80vw;
max-height: 85vh;
h3 {
margin-bottom: 0.5em;
}
.vc_ui-list-bar-item-trigger {
cursor: auto;
}
.vc_properties-list [data-vc-panel-message] .vc_message_box {
padding: 0em 1em 1em 4em;
}
.vc_ui-panel-content-container {
min-height: 140px;
}
}

View File

@@ -0,0 +1,47 @@
.vc_layout-panel-switcher() {
.vc_layout-btn {
display: inline-block;
background-position: center center;
background-repeat: no-repeat;
background-color: white;
cursor: pointer;
padding: 2px;
margin: 8px 4px 1px 0;
color: #A0A0A0;
font-size: 14px;
&:hover {
color: #0473aa;
}
}
.vc_custom-layout-btn {
background-color: transparent;
display: block;
width: auto;
height: auto;
margin: 4px 0 3px;
font-size: 11px;
text-align: center;
}
}
[data-vc-ui-element="panel-row-layout"] {
width: 420px;
z-index: 100001;
top: 90px;
left: 50%;
input.vc_row_layout[type="text"] {
width: 288px;
padding: 8px;
line-height: 1;
}
.vc_layout-panel-switcher {
.vc_layout-panel-switcher;
}
.vc_ui-panel-window-inner > .vc_ui-panel-content-container {
overflow: hidden;
}
}
.vc_general.vc_ui-button-update-layout {
vertical-align: top;
}

View File

@@ -0,0 +1,173 @@
@import "vc_ui-panel/vc_ui-panel-content.less";
@import "vc_ui-list-bar.less";
@import "vc_ui-icon-pixel.less";
@vcui-template-list-border: #e2e2e2;
@vcui-template-list-background: #f9f9f9;
@vcui-template-list-trigger-color: #5e5e5e;
@vcui-template-list-trigger-color-hover: #23282d;
.vc_ui-template-list {
//border: 1px solid red
&.vc_ui-list-bar {
border: none;
margin-left: -@vcui-panel-content-padding-horizontal;
margin-right: -@vcui-panel-content-padding-horizontal;
margin-bottom: -@vcui-panel-content-padding-vertical;
background: transparent;
}
.vc_ui-list-bar-item {
border: 1px solid @vcui-template-list-border;
border-left: none;
border-right: none;
position: relative;
&:hover {
background-color: @vcui-template-list-background;
}
}
.vc_ui-list-bar-item-actions {
padding-left: @vcui-panel-content-padding-horizontal;
padding-right: @vcui-panel-content-padding-horizontal;
}
.vc_ui-control-button {
padding-left: .2em;
padding-right: .2em;
.vc-composer-icon {
font-size: 20px;
&.vc-c-icon-add {
font-size: 24px;
}
}
.vc_ui-wp-spinner {
margin: 0;
height: 16px;
width: 16px;
&::before {
&:extend(.vc_ui-wp-spinner::before);
}
}
}
.vc_active, .vc_loading {
.vc_ui-list-bar-item {
background-color: @vcui-template-list-background;
}
.vc_ui-list-bar-item-actions {
visibility: visible;
opacity: 1;
}
}
.vc_ui-list-bar-item-trigger {
padding: @vcui-panel-content-padding-horizontal;
font-weight: 600;
outline: none;
transition-property: color;
transition-duration: .2s;
transition-timing-function: ease-in-out;
color: @vcui-template-list-trigger-color;
&:hover {
color: @vcui-template-list-trigger-color-hover;
}
}
.vc_ui-template {
&:not(:last-child) {
margin-bottom: -1px;
}
&:last-child:not(.vc_active) {
border-bottom: none;
}
}
.vc_template-save-btn {
min-width: 150px;
}
.vc_ui-template-content {
box-sizing: content-box;
display: none;
overflow: hidden;
transition-property: height, padding;
transition-duration: .2s;
transition-timing-function: ease-in-out;
padding: 0;
}
.vc_active,
.vc_animating {
.vc_ui-template-content {
display: block;
}
}
.vc_ui-preview-icon {
&:extend(.vc_ui-icon-pixel-control-triangle-desc-dark all);
}
.vc_active {
.vc_ui-preview-icon {
&:extend(.vc_ui-icon-pixel-control-triangle-asc-dark all);
}
.vc-c-icon-arrow_drop_down {
&:extend(.vc-c-icon-arrow_drop_up all);
}
}
}
#vc_ui-panel-templates {
width: 80vw;
max-height: 85vh;
// hide preview icon on mobile devices
&:not(.vc_media-sm) {
.vc_ui-control-button[data-vc-preview-handler] {
display: none;
}
.vc_active,
.vc_animating {
.vc_ui-template-content {
display: none;
}
}
}
h3 {
margin-bottom: 0.5em;
}
}
//BC:
.vc_input-group .vc_form-control.vc_panel-templates-name {
width: 99%;
}
.vc_ui-panel {
.vc_panel-tabs {
[data-vc-panel-message] {
width: 100%;
margin-bottom: 10px;
.vc_message_box {
padding: 0em 1em 1em 4em;
}
}
}
}
// todo: remove this nasty important @todo 4.10
[data-vc-template-search="true"] {
.vc_edit-form-tab {
display: flex !important;
&.vc-search-result-empty {
display: none !important;
}
[data-vc-hide-on-search="true"] {
display: none;
}
.vc_ui-template-list.vc_ui-list-bar {
margin-bottom: 0;
}
}
.vc_ui-panel-content{
padding-bottom: 0;
}
}

View File

@@ -0,0 +1,32 @@
@vcui-panel-content-padding-horizontal: 18px;
@vcui-panel-content-padding-vertical: 18px;
@vcui-panel-content-font-size: 14px;
@vcui-panel-content-background: #fff;
@vcui-panel-content-color: #5e5e5e;
.vc_ui-panel-content-container {
background: @vcui-panel-content-background;
margin: 0;
padding: 0;
font-size: @vcui-panel-content-font-size;
color: @vcui-panel-content-color;
overflow-x: hidden;
overflow-y: auto;
min-height: 150px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.vc_ui-panel-content {
padding: @vcui-panel-content-padding-vertical @vcui-panel-content-padding-horizontal;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.vc_ui-content-hidden {
.vc_ui-panel-content {
display: none;
}
}

View File

@@ -0,0 +1,36 @@
@import "../vc_ui-button.less";
@import "../vc_ui-icon-pixel.less";
@vcui-panel-footer-padding-horizontal: 18px;
@vcui-panel-footer-padding-vertical: 18px;
@vcui-panel-footer-font-size: 14px;
@vcui-panel-footer-background: #f6f6f6;
@vcui-panel-footer-button-group-space: 6px;
@vcui-panel-footer-button-fw: 140px;
.vc_ui-panel-footer-container {
padding: @vcui-panel-footer-padding-vertical @vcui-panel-footer-padding-horizontal;
background: @vcui-panel-footer-background;
margin: 0;
font-size: @vcui-panel-footer-font-size;
}
.vc_ui-panel-footer {
// button behavior
.vc_ui-button-group {
margin: -@vcui-panel-footer-button-group-space/2;
box-sizing: border-box;
.vc_ui-button,
.vc_ui-button-message {
margin: @vcui-panel-footer-button-group-space/2;
}
}
.vc_ui-button-fw {
min-width: @vcui-panel-footer-button-fw;
.vc-c-icon-check {
font-weight: bold;
}
}
}

View File

@@ -0,0 +1,152 @@
@import "../vc_ui-button.less";
@import "../vc_ui-icon-pixel.less";
@import "../vc_ui-dropdown.less";
@import "../vc_ui-tabs-line.less";
@vcui-panel-header-font-size: 14px;
@vcui-panel-header-padding-horizontal: 18px;
@vcui-panel-header-padding-vertical: 14px;
@vcui-panel-header-gap: 16px;
@vcui-panel-header-background: #0473aa;
@vcui-panel-header-color: #fff;
@vcui-panel-header-heading-font-size: 20px;
@vcui-panel-header-search-width: 200px;
@vcui-panel-header-search-width-focus: 110%;
@vcui-panel-header-search-color: #333;
@vcui-panel-header-search-placeholder-color: #aaa;
@vcui-panel-header-transition-duration: .2s;
.vc_ui-panel-header-container {
padding: @vcui-panel-header-padding-vertical @vcui-panel-header-padding-horizontal;
background: @vcui-panel-header-background;
margin: 0;
font-size: @vcui-panel-header-font-size;
&.vc_ui-panel-header-o-stacked-bottom {
padding-bottom: 0;
}
}
.vc_ui-panel-header {
color: @vcui-panel-header-color;
&::after {
content: '';
display: block;
clear: both;
height: 0;
visibility: hidden;
}
.vc_ui-panel-header-controls {
float: right;
margin: 2px 0 0 12px;
.vc_ui-dropdown {
display: inline-block;
}
.vc_ui-dropdown-content {
left: auto;
right: 0;
}
}
.vc_ui-panel-header-header {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
}
.vc_ui-panel-header-heading {
flex-grow: 1;
margin: 0 1em 0 0;
font-size: @vcui-panel-header-heading-font-size;
color: inherit;
font-weight: 300;
line-height: normal;
}
.vc_ui-panel-header-actions {
}
.vc_ui-panel-header-content {
clear: both;
}
.vc_ui-control-button {
margin: 0;
padding: 0;
// buttons with icons
.vc-composer-icon {
font-size: 26px;
}
.vc-c-icon-cog {
font-size: 20px;
}
}
}
// search box
.vc_ui-search-box {
width: @vcui-panel-header-search-width;
input[type=search] {
display: inline-block;
margin: 0;
padding: 7px 12px 7px 32px;
line-height: normal;
font-size: 12px;
font-family: inherit;
vertical-align: middle;
color: @vcui-panel-header-search-color;
border: none;
box-sizing: border-box;
transition: all .2s ease-in-out;
border-radius: 5px;
width: 100%;
position: relative;
left: 0;
&:focus {
color: @vcui-panel-header-search-color;
}
&::-moz-placeholder {
.style-placeholder();
opacity: 1;
}
&:-ms-input-placeholder {
.style-placeholder();
}
&::-webkit-input-placeholder {
.style-placeholder();
}
.style-placeholder() {
text-overflow: ellipsis;
line-height: inherit;
color: @vcui-panel-header-search-placeholder-color;
font-size: inherit;
font-style: italic;
}
}
.vc_ui-search-box-input {
position: relative;
label {
height: 24px;
width: 24px;
content: '';
display: block;
position: absolute;
left: 6px;
top: 0;
bottom: 0;
margin: auto;
transition-property: color;
transition-duration: @vcui-panel-header-transition-duration;
transition-timing-function: ease-in-out;
cursor: pointer;
color: #BFC2C8;
font-size: 22px;
}
input[type=search]:focus + label {
cursor: default;
color: #7F8591;
}
}
}

View File

@@ -0,0 +1,89 @@
@vcui-panel-window-font-size: 14px;
@vcui-panel-window-frame-size: 7px;
@vcui-panel-window-frame-color: transparent;
@vcui-panel-window-main-background: #fff;
@vcui-panel-window-main-color: #5e5e5e;
.vc_ui-panel-window {
box-sizing: content-box;
font-size: @vcui-panel-window-font-size;
padding: @vcui-panel-window-frame-size;
background: @vcui-panel-window-frame-color;
}
.vc_ui-panel-window-inner {
background: @vcui-panel-window-main-background;
color: @vcui-panel-window-main-color;
box-shadow: 1px 1px 4px rgba(0, 0, 0, .25);
position: relative;
max-height: inherit;
display: flex;
flex-direction: column;
align-items: stretch;
align-content: stretch;
flex-basis: 100%;
> .vc_ui-panel-header-container,
> .vc_ui-panel-footer-container {
flex: 0 0 auto;
}
> .vc_ui-panel-content-container {
flex: 1 1 auto;
position: relative;
}
}
// minimized window
.vc_ui-panel-window {
&.vc_minimized {
&:not(.vc_animating) {
.vc_ui-panel-header-content,
.vc_ui-panel-content-container,
.vc_ui-panel-footer-container {
display: none;
}
.vc_ui-minimize-button {
transform: scaleY(-1);
}
}
}
&.vc_animating {
.vc_ui-panel-window-inner {
overflow: hidden;
}
&:not(.vc_minimized) {
.vc_ui-minimize-button {
transform: scaleY(-1);
}
}
}
}
@media (max-width: @screen-xs-max) {
.vc_ui-panel-window {
box-sizing: border-box !important;
width: 100vw !important;
height: 100vh !important;
max-height: none !important;
position: fixed !important;
left: 0 !important;
top: 0 !important;
padding: 5vh 5vw !important;
overflow-y: auto !important;
overflow-x: hidden !important;
&.vc_active {
display: block !important;
}
// don't allow minimizing on mobile
.vc_ui-minimize-button {
display: none !important;
}
// always unminimized on mobile
.vc_ui-panel-header-content,
.vc_ui-panel-content-container,
.vc_ui-panel-footer-container {
display: block !important;
}
}
}

View File

@@ -0,0 +1,45 @@
@import "../vc_ui-fonts.less";
@import "../vc_ui-panel/vc_ui-panel-window.less";
@import "../vc_ui-panel/vc_ui-panel-header.less";
@import "../vc_ui-panel/vc_ui-panel-content.less";
@import "../vc_ui-panel/vc_ui-panel-footer.less";
@import "../vc_ui-panel/vc_ui-panel-footer.less";
@import "../vc_ui-prompt.less";
@import "../vc_ui-gaps.less";
@import "../vc_ui-flex-bootstrap.less";
@vcui-panel-width: 650px;
.vc_ui-panel {
display: none;
&.vc_ui-panel-window {
width: @vcui-panel-width;
position: fixed;
z-index: 50000;
top: 74px;
left: 50%;
}
&.vc_active {
display: flex;
}
.panel-body {
padding: 0;
}
.vc_panel-tabs {
flex-grow: 1;
}
.vc_layout-onion {
width: 350px;
flex-grow: initial;
}
}
// Loaders behaviour
.vc_ui-panel {
.vc_ui-panel-content > .vc_ui-wp-spinner {
display: block;
margin: 0 auto;
width: 80px;
height: 80px;
}
}

View File

@@ -0,0 +1,141 @@
@vcui-prompt-font-size: 14px;
@vcui-prompt-background: #f5f5f5;
@vcui-prompt-border: #dbdbdb;
@vcui-prompt-color: #5e5e5e;
@vcui-prompt-padding: 15px;
@vcui-prompt-size: 16px;
@vcui-prompt-gap: 18px;
@vcui-prompt-xs-width: 258px;
@vcui-prompt-sm-width: 395px;
.vc_ui-prompt {
font-size: @vcui-prompt-font-size;
box-sizing: content-box;
overflow: hidden;
transition-property: opacity;
transition-duration: .2s;
transition-timing-function: ease-in-out;
position: absolute;
z-index: 100;
top: 100%;
left: 0;
box-shadow: 0 0 5px rgba(0, 0, 0, .1);
background-color: @vcui-prompt-background;
color: @vcui-prompt-color;
padding: @vcui-prompt-padding;
visibility: hidden;
opacity: 0;
input {
box-sizing: border-box;
}
&.vc_visible {
visibility: visible;
opacity: 1;
overflow-y: auto;
}
}
.vc_media-xs {
.vc_ui-prompt {
width: @vcui-prompt-xs-width;
left: auto;
right: 0;
}
}
.vc_media-sm {
.vc_ui-prompt {
width: @vcui-prompt-sm-width;
}
}
.vc_ui-prompt-controls {
float: right;
margin-left: 1em;
.vc_ui-prompt-close {
height: @vcui-prompt-size;
width: @vcui-prompt-size;
line-height: @vcui-prompt-size;
vertical-align: top;
position: relative;
right: -3px;
}
.vc_ui-icon-pixel {
display: block;
line-height: 1;
}
}
.vc_ui-prompt-content {
display: flex;
flex-wrap: wrap;
margin-left: -@vcui-prompt-gap/2;
margin-right: -@vcui-prompt-gap/2;
}
.vc_ui-prompt-column {
padding-left: @vcui-prompt-gap/2;
padding-right: @vcui-prompt-gap/2;
&:first-child {
flex-grow: 1;
}
.vc_ui-button {
.vc-composer-icon {
font-weight: bold;
}
}
}
// behaviours
.vc_ui-dropdown {
.vc_ui-prompt {
position: absolute;
}
.vc_ui-button {
text-transform: none;
}
}
// Presets full width
.vc_ui-prompt {
&.vc_ui-prompt-presets, &.vc_ui-prompt-templates, &.vc_ui-prompt-view-presets {
display: none;
&.vc_visible {
display: block;
position: relative;
width: calc(~'100% - 30px');
left: 0;
right: 0;
top: 0;
margin-bottom: 20px;
margin-top: 0;
background: #FFF;
box-shadow: none;
}
.vc_ui-prompt-controls {
float: none;
margin: 0;
text-align: right;
.vc_ui-control-button {
font-size: 30px;
height: 40px;
width: 40px;
color: grey;
}
}
}
.vc_ui-control-button {
&.vc_hidden {
display: none;
}
}
}
.vc_ui-notice .vc_message_box.vc_message_box-standard p.messagebox_text {
margin: 0;
padding: 0;
}
.vc_ui-notice .vc_message_box.vc_message_box-standard {
margin-bottom: 20px;
}

View File

@@ -0,0 +1,161 @@
@vcui-tabs-line-border: 1px;
@vcui-tabs-line-border-radius: 5px;
@vcui-tabs-line-font-size: 14px;
@vcui-tabs-line-padding-horizontal: 12px;
@vcui-tabs-line-padding-vertical: 16px;
@vcui-tabs-line-active-background: #fff;
@vcui-tabs-line-hover-background: rgba(0, 0, 0, .1);
@vcui-tabs-line-active-color: #5e5e5e;
@vcui-tabs-line-transition-duration: .2s;
@vcui-tabs-line-transition-properties: color, background, border;
@vcui-tabs-line-dropdown-z-index: 1010;
@vcui-tabs-line-dropdown-max-width: 300px;
@vcui-tabs-line-dropdown-border-size: 1px;
@vcui-tabs-line-dropdown-border-color: #dbdbdb;
@vcui-tabs-line-dropdown-background: #f5f5f5;
@vcui-tabs-line-dropdown-background-hover: #eaeaea;
@vcui-tabs-line-dropdown-trigger-color: #5e5e5e;
@vcui-tabs-line-dropdown-trigger-padding-vertical: 10px;
@vcui-tabs-line-dropdown-trigger-padding-horizontal: 10px;
@vcui-tabs-line-dropdown-font-size: 12px;
@vcui-tabs-line-dropdown-o-bounded-rows-count: 7;
.vc_general.vc_ui-tabs-line {
padding: 0;
margin: 0;
list-style: none;
> li {
float: left;
margin: 0;
padding: 0;
}
> .vc_ui-tabs-line-dropdown-toggle {
float: right;
}
.vc_ui-tabs-line-trigger {
box-sizing: border-box;
display: block;
text-transform: none;
border: @vcui-tabs-line-border solid transparent;
font-size: @vcui-tabs-line-font-size;
font-weight: 400;
line-height: 1;
background: transparent;
color: inherit;
text-decoration: none;
font-family: inherit;
padding: @vcui-tabs-line-padding-vertical @vcui-tabs-line-padding-horizontal;
margin: 0;
outline: none;
transition-property: @vcui-tabs-line-transition-properties;
transition-duration: @vcui-tabs-line-transition-duration;
transition-timing-function: ease-in-out;
border-radius: @vcui-tabs-line-border-radius @vcui-tabs-line-border-radius 0 0;
white-space: nowrap;
cursor: pointer;
user-select: none;
text-align: left;
&:hover,
&:focus {
border: @vcui-tabs-line-border solid transparent;
background-color: @vcui-tabs-line-hover-background;
}
&:active {
box-shadow: none;
}
}
> .vc_active {
> .vc_ui-tabs-line-trigger {
background-color: @vcui-tabs-line-active-background;
color: @vcui-tabs-line-active-color;
cursor: default;
}
}
&::after {
content: "";
display: table;
clear: both;
}
}
.vc_ui-tabs-line .vc_ui-tabs-line-dropdown-toggle {
position: absolute;
float: right;
visibility: hidden;
&.vc_visible {
visibility: visible;
position: relative;
}
> .vc_ui-tabs-line-trigger {
&::after {
content: '. . .';
font-weight: 600;
display: inline;
}
}
&.vc_active {
> .vc_ui-tabs-line-trigger {
background-color: @vcui-tabs-line-hover-background;
color: inherit;
cursor: pointer;
}
}
}
.vc_ui-tabs-line .vc_ui-tabs-line-dropdown {
position: absolute;
z-index: @vcui-tabs-line-dropdown-z-index;
top: 100%;
right: 0;
display: none;
overflow: hidden;
transition-property: height, padding;
transition-duration: .2s;
transition-timing-function: ease-in-out;
padding: 0;
margin: 0;
list-style: none;
max-width: @vcui-tabs-line-dropdown-max-width;
box-shadow: 0 0 5px rgba(0, 0, 0, .1);
background: @vcui-tabs-line-dropdown-background;
border: @vcui-tabs-line-dropdown-border-size solid @vcui-tabs-line-dropdown-border-color;
li {
margin: 0;
padding: 0;
}
&.vc_active,
&.vc_animating {
display: block;
}
.vc_ui-tabs-line-trigger {
padding: @vcui-tabs-line-dropdown-trigger-padding-vertical @vcui-tabs-line-dropdown-trigger-padding-horizontal;
border-radius: 0;
font-size: @vcui-tabs-line-dropdown-font-size;
color: @vcui-tabs-line-dropdown-trigger-color;
&:hover {
background-color: @vcui-tabs-line-dropdown-background-hover;
}
}
.vc_active {
.vc_ui-tabs-line-trigger {
background-color: @vcui-tabs-line-dropdown-background-hover;
cursor: default;
}
}
}
// initializing
.vc_ui-tabs-line {
opacity: 1;
transition: opacity @vcui-tabs-line-transition-duration ease-in-out;
&.vc_initializing {
transition: opacity 0ms;
opacity: 0;
> li:not(:first-child):not(.vc_ui-tabs-line-dropdown-toggle) {
position: absolute;
visibility: hidden;
}
}
}

View File

@@ -0,0 +1,159 @@
/* 1. Buttons
---------------------------------------------------------- */
.vc_btn,
a.vc_btn,
button.vc_btn {
cursor: pointer;
display: inline-block;
text-decoration: none !important;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
&,
&:hover,
&:focus {
border: 1px solid transparent;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
// @padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius
.button-size(@vc_btn_padding_vertical; @vc_btn_padding_horizontal; 100%; 20px; 4px);
// Button Sizes
// --------------------------------------------------
&-lg {
// line-height: ensure even-numbered height of button next to large input
.button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
}
&-sm {
// line-height: ensure proper height of button next to small input
.button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
}
&-xs {
.button-size(@padding-xs-vertical; @padding-xs-horizontal; @font-size-small; @line-height-small; @border-radius-small);
}
//Button design variations
&_rounded {
//default style
}
&_square {
border-radius: 0;
}
&_square_outlined {
border-radius: 0;
background: none !important;
&,
&:hover,
&:focus {
border: 2px solid;
}
}
&_round {
border-radius: 25px;
}
&_outlined {
background: none !important;
&,
&:hover,
&:focus {
border: 2px solid;
}
}
/* Button colors variations */
&-blue {
.vc_btn_variants(@blue, #ffffff);
}
&-turquoise {
.vc_btn_variants(@turquoise, #ffffff);
}
&-pink {
.vc_btn_variants(@pink, #ffffff);
}
&-violet {
.vc_btn_variants(@violet, #ffffff);
}
&-peacoc {
.vc_btn_variants(@peacoc, #ffffff);
}
&-chino {
.vc_btn_variants(@chino, #ffffff);
}
&-mulled_wine {
.vc_btn_variants(@mulled_wine, #ffffff);
}
&-vista_blue {
.vc_btn_variants(@vista_blue, #ffffff);
}
&-black {
.vc_btn_variants(@black, #ffffff);
}
&-grey {
.vc_btn_variants(@grey, #666666);
}
&-orange {
.vc_btn_variants(@orange, #ffffff);
}
&-sky {
.vc_btn_variants(@sky, #ffffff);
}
&-green {
.vc_btn_variants(@green, #ffffff);
}
&-juicy_pink {
.vc_btn_variants(@juicy_pink, #ffffff);
}
&-sandy_brown {
.vc_btn_variants(@sandy_brown, #ffffff);
}
&-purple {
.vc_btn_variants(@purple, #ffffff);
}
&-white {
.vc_btn_variants(@white, #666666);
}
&-grace {
.vc_btn_variants(@grace, #ffffff);
}
&-default {
.button-variant(@vc_btn_default_color; @vc_btn_default_bg; @btn-default-border);
}
&-primary {
.button-variant(@vc_btn_primary_color; @vc_btn_primary_bg; @btn-primary-border);
}
// Success appears as green
&-success {
.button-variant(@btn-success-color; @btn-success-bg; @btn-success-border);
}
// Info appears as blue-green
&-info {
.button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
}
// Warning appears as orange
&-warning {
.button-variant(@btn-warning-color; @btn-warning-bg; @btn-warning-border);
}
// Danger and error appear as red
&-danger {
.button-variant(@btn-danger-color; @btn-danger-bg; @btn-danger-border);
}
}
.vc_button-2-wrapper {
display: inline-block;
vertical-align: middle;
&.vc_button-2-align-left {
display: block;
text-align: left;
}
&.vc_button-2-align-right {
display: block;
text-align: right;
}
&.vc_button-2-align-center {
display: block;
text-align: center;
}
}
@import "../lib/wpb_icon.less";

View File

@@ -0,0 +1,69 @@
.vc_fullscreen {
.vc_fullscreen-button {
display: none;
}
.vc_windowed-button {
display: block;
}
#post-body-content,
#screen-meta-links,
#postbox-container-1,
.ui-sortable-handle:not(.vc_control),
.handlediv,
.wrap > h1,
.wrap > .notice,
.postbox,
#wpfooter {
display: none;
}
#poststuff #post-body.columns-2 {
margin-right: 0;
}
#wpbody-content {
padding-bottom: 0;
}
#poststuff {
padding-top: 0;
}
.wrap {
margin: 0;
}
#wpcontent {
margin-left: 16px;
padding-top: @vc_navbar_height;
}
.vc_save-backend {
display: block;
}
.vc_navbar {
padding-left: 40px;
position: fixed;
z-index: 9980;
width: 100%;
top: 32px;
left: 0;
}
}
@media screen and (max-width: 782px) {
.vc_fullscreen {
#wpcontent {
margin-left: 0;
padding-top: @vc_navbar_height;
}
.vc_navbar {
padding-left: 0;
top: 46px; // #wpadminbar height
}
}
}

View File

@@ -0,0 +1,32 @@
.vc_helper {
width: auto !important;
height: auto !important;
.box-sizing(border-box);
z-index: 1006;
position: absolute;
padding: 4px 15px 4px 30px;
border: 1px solid @vc_controls_border;
background-color: @vc_controls_background;
.border-top-radius(3px);
.border-bottom-radius(3px);
vertical-align: middle;
color: #FFFFFF;
font-size: 9px;
@import '../lib/elements_icons.less';
.vc_element-icon {
display: inline-block;
margin: 0 8px 0 0;
vertical-align: middle;
}
&.vc_helper-vc_row {
border: 1px solid #285A85;
background-color: #285A85;
}
&.vc_helper-vc_column {
border: 1px solid #F9B418;
background-color: #F9B418;
}
&-tab {
width: auto !important;
}
}

View File

@@ -0,0 +1,46 @@
.vc_message {
display: none;
position: fixed;
.box-sizing(border-box);
padding: 10px;
text-align: center;
top: 56px;
left: 0;
width: 100%;
background: #CCCCCC;
color: #000000;
&.success, &.type-success {
background: #d8edc7;
border-bottom: 1px solid #cae1b7;
color: #8A987E;
}
&.error, &.type-error {
background: #EBE4C7;
border-bottom: 1px solid #DDD2B3;
color: #938D7C;
}
}
.vc_panel-message {
display: none;
z-index: 100000;
position: absolute;
.box-sizing(border-box);
padding: 10px;
text-align: center;
top: 38px;
left: 0;
width: 100%;
background: #CCCCCC;
color: #000000;
&.type-success {
background: #d8edc7;
border-bottom: 1px solid #cae1b7;
color: #8A987E;
}
&.type-error {
background: #EBE4C7;
border-bottom: 1px solid #DDD2B3;
color: #938D7C;
}
}

View File

@@ -0,0 +1,88 @@
/** VC Modal block popup */
.add_element_size(@counter, @max_width: 1330px) when (@counter >= 0) {
.add_element_size((@counter - 1), (@max_width - @vc_add_element_button_width));
@media (min-width: @max_width) {
.vc_modal-dialog {
width: (10px + @vc_add_element_width + @counter * @vc_add_element_button_width);
}
}
}
.vc_modal {
display: none;
overflow: auto;
overflow-y: hidden;
position: fixed;
top: 0 !important;
right: 0;
bottom: 0;
left: 0;
-webkit-overflow-scrolling: touch;
width: auto !important;
margin-left: 0 !important;
background-color: transparent !important;
z-index: @vc_zindex_modal !important;
&.fade .vc_modal-dialog {
.translate(0, -25%);
.transition-transform(~"0.3s ease-out");
}
&.in .vc_modal-dialog {
.translate(0, 0)
}
*, & {
.box-sizing(border-box);
}
}
.add_element_size(4);
.vc_modal-content {
position: relative;
background-color: @modal-content-bg;
.box-shadow(0 3px 9px rgba(0, 0, 0, .5));
background-clip: padding-box;
// Remove focus outline from opened modal
outline: 0;
-webkit-border-radius: @vc_modal_content_radius;
-moz-border-radius: 2px;
border-radius: 2px;
border: 1px solid @vc_modal_content_border_color;
}
.vc_modal-header {
.vc_box-heading;
}
.vc_modal-title {
.modal-title;
.vc_heading(16px);
cursor: default;
border: 0 !important;
}
.vc_modal-body {
.modal-body;
overflow-y: auto;
}
.vc_modal-footer {
.modal-footer;
}
// Default bootstrap classes for modal box
.modal-open {
.modal-open;
}
.clousus {
z-index: @zindex-modal-background;
}
.modal-backdrop {
.modal-backdrop;
}
// Measure scrollbar width for padding body during modal show/hide
.modal-scrollbar-measure {
.modal-scrollbar-measure;
}

View File

@@ -0,0 +1,312 @@
@vcui-navbar-transition-duration: .2s;
@vcui-navbar-transition-function: ease-in-out;
.vc_navbar {
.box-sizing(border-box);
min-height: @vc_navbar_height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
margin: @vc_navbar_margin;
border: 0;
// Prevent floats from breaking the navbar
&:extend(.clearfix all);
* {
.box-sizing(border-box);
}
.vc_navbar-collapse {
padding: 0;
}
background-color: @vc_navbar_background_color;
border-bottom: none;
.vc_navbar-nav {
display: block;
margin: 0;
> li {
float: left;
margin: 0;
a {
}
height: 56px;
}
}
.vc_navbar-brand {
.navbar-brand();
font-size: 0;
background: transparent url(@vcui_navbar_logo) center center no-repeat;
background-size: 36px;
display: block;
width: 42px;
height: 42px;
padding: 27px 30px 27px 35px;
&.vc_ui-wp-spinner {
background-image: none;
}
}
&.vc_navbar-frontend {
.vc_navbar-brand {
&.vc_ui-wp-spinner {
&::before {
background-image: url(@vc_ui-wp-spinner-light-svg-src);
}
}
}
}
.vc_last {
padding-right: 25px;
}
.vc_right-space {
padding-right: 5px;
}
.vc_icon-btn {
display: block;
width: 60px;
height: @vc_navbar_height;
padding: 28px 30px;
cursor: pointer;
outline: 0;
background: transparent;
transition: background-color @vcui-navbar-transition-duration @vcui-navbar-transition-function;
position: relative;
font-size: 22px;
&[disabled] {
.opacity(0.2);
}
&:not([disabled]):hover {
background-color: @vc_navbar_icon_btn_color_hover;
}
&:not([disabled]):focus {
background-color: transparent;
}
.vc-composer-icon, .vc_navbar-icon {
color: @vc_navbar_icon_color;
position: absolute;
left: 50%;
top: 50%;
.translate(-50%, -50%);
}
}
.vc_open {
> a, > a:focus {
background-color: @vc_navbar_background_color;
}
}
.vc_btn-backend-editor {
margin-right: 2px;
}
.vc_btn-save {
margin-left: 2px;
&-draft {
margin-right: 2px;
}
}
.vc_back-button {
font-size: 26px;
padding: 20px 23px;
}
.vc_post-settings {
font-size: 20px;
}
.vc_windowed-button {
display: none;
}
.vc_badge-custom-css {
display: block;
background-color: #fcb714;
position: absolute;
top: 9px;
left: 31px;
font-size: 9px;
font-weight: normal;
border-radius: 4px;
padding: 2px 3px;
z-index: 1;
}
.vc_save-backend {
display: none;
.vc_control-preview {
margin-right: 0;
}
.vc_control-save {
margin-left: 5px;
}
}
.vc_dropdown {
position: relative;
font-size: 18px;
.vc_dropdown-toggle {
transition: background-color @vcui-navbar-transition-duration @vcui-navbar-transition-function;
cursor: default;
display: block;
width: 68px;
height: 56px;
line-height: 16px;
padding: 19px;
text-decoration: none;
}
.vc_current-layout-icon {
color: #FFFFFF;
}
.vc-c-icon-arrow_drop_down {
color: #FFFFFF;
opacity: 0.5;
}
.vc_dropdown-list {
display: none;
position: absolute;
z-index: 1000;
top: 55px;
// left: 0px;
background: @vc_navbar_icon_btn_color_hover;
// border: 1px solid #1e5072;
// border-width: 0 1px 1px 1px;
padding-top: 1px;
.border-bottom-radius(3px);
> li {
margin: 0;
}
a {
display: block;
color: #FFFFFF;
text-decoration: none;
transition: background-color @vcui-navbar-transition-duration @vcui-navbar-transition-function;
background-color: transparent;
width: 68px;
height: 37px;
position: relative;
&::before {
position: absolute;
top: 50%;
left: 50%;
.translate(-50%, -50%);
}
&:hover {
background-color: #00aef0;
}
&.active {
background-color: #00aef0;
}
}
}
&:hover {
.vc_dropdown-toggle {
background-color: @vc_navbar_icon_btn_color_hover;
}
.vc_dropdown-list {
display: block;
}
}
.vc-c-icon-layout_landscape-smartphones {
font-size: 13px;
}
}
}
// Buttons in navbars
//
// Vertically center a button within a navbar (when *not* in a form).
.vc_navbar-btn {
transition: background-color @vcui-navbar-transition-duration @vcui-navbar-transition-function;
.navbar-vertical-align(@input-height-base);
margin-left: 21px;
margin-right: 21px;
&.vc_btn-sm {
.navbar-vertical-align(@input-height-small);
}
&.vc_btn-xs {
.navbar-vertical-align(22);
}
}
.vc_subnav-fixed {
position: fixed;
top: 32px;
left: 0;
z-index: 9980;
width: 100%;
padding-left: @vc_navbar_fixed_right_padding;
.vc_save-backend {
display: block;
}
}
.folded {
.vc_subnav-fixed {
padding-left: 40px;
}
}
@media screen and (max-width: 960px) {
.auto-fold {
.vc_subnav-fixed {
padding-left: 40px;
}
}
}
@media screen and (max-width: 782px) {
.vc_navbar li, .navbar-header {
display: none;
}
.vc_navbar li.vc_show-mobile {
display: block;
float: left;
}
.vc_navbar-nav {
float: left;
margin: 0;
&.navbar-right {
float: right;
}
}
.vc_navbar-header {
float: left;
}
.vc_navbar {
padding-left: 0;
position: fixed;
z-index: 9980;
width: 100%;
left: 0;
top: 46px; // #wpadminbar height
}
#wpcontent {
padding-top: @vc_navbar_height;
}
.auto-fold {
.vc_subnav-fixed {
padding-left: 0;
}
}
}
.vc_navbar-border-right {
border-right: 1px solid @vc_navbar_border_color;
}
.vc_dropdown-menu {
background-color: #000000;
}
.vc_navbar-header {
.navbar-header();
float: left;
}
.vc_navbar-collapse {
.navbar-collapse();
}
.vc_select-navbar {
margin: 12.5px 21px;
}
#vc_navbar-redo, #vc_navbar-undo {
transition: all 0.2s ease-in-out;
}

View File

@@ -0,0 +1,263 @@
@vc_panel-width: 700px;
.vc_input-group {
position: relative;
display: table;
border-collapse: separate;
.vc_form-control {
display: table-cell;
position: relative;
z-index: 2;
float: left;
width: 100%;
margin-bottom: 0;
}
.vc_input-group-btn {
position: relative;
font-size: 0;
white-space: nowrap;
width: 1%;
vertical-align: middle;
display: table-cell;
}
}
.vc_panel {
.panel;
width: @vc_panel-width;
position: fixed;
z-index: 100000;
top: 74px;
left: 50%;
// height: auto !important;
min-height: 150px;
.panel-body {
padding: 0;
}
display: none;
border-color: #DDDDDD;
}
.vc_panel-body {
.panel-body;
overflow-y: auto;
overflow-x: hidden;
&.vc_with-tabs {
margin-top: 50px;
}
}
.vc_panel-heading {
.vc_box-heading;
cursor: move;
}
.vc_panel-footer {
.panel-footer;
box-sizing: border-box;
.vc_btn-default {
&:hover {
border-color: #CCC;
}
&:focus {
background-color: #FFF; // TODO: check
}
}
}
.vc_panel-title {
.panel-title;
.vc_heading(16px);
border: 0 !important;
}
.vc_properties-list {
//padding: 10px 16px;
input,
textarea {
width: 100%;
padding: 8px 6px;
margin: 0;
}
input,
select {
font-size: 1em;
width: 100%;
padding: 8px 24px 8px 6px;
margin: 0;
}
select {
height: auto;
}
input[type="checkbox"] {
width: auto;
margin-left: 5px;
margin-right: 2px;
display: inline-block;
&:nth-child(2) {
margin-left: 0;
}
}
}
.vc_panel-tabs {
> .vc_edit-form-tabs-menu {
margin: 38px 0 10px;
// margin-top 38px comes from panel-heading.OuterHeight
padding-left: 10px;
display: block;
position: absolute;
top: 0; // fixes firefox bug!
left: 0;
right: 0;
background-color: #e6e6e6;
.vc_edit-form-tab-control {
display: list-item;
list-style: none;
float: left;
position: relative;
top: 0;
margin: 9px 2px 0 0; // see border-bottom-width: 0
border: 1px solid transparent;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-bottom-width: 0;
padding: 0;
white-space: nowrap;
font-weight: normal;
.transition(background-color 0.5s ease-out);
color: #949494;
.vc_edit-form-link {
color: #949494;
float: left;
padding: 11px 15px;
text-decoration: none;
outline: none;
cursor: pointer;
font-size: 12px;
&:focus {
.box-shadow(none);
}
}
&.vc_active {
background: #ffffff;
font-weight: normal;
color: #595959;
a {
color: #595959;
}
}
&.vc_tab-color-animated {
background-color: #d7d7d7;
}
}
> :first-child {
margin-left: 6px;
}
}
> .vc_edit-form-tab {
display: none;
&.vc_active {
display: block;
}
}
}
.vc_panel-tabs {
> .vc_panel-tabs-menu {
margin: 38px 0 10px;
// margin-top 38px comes from panel-heading.OuterHeight
padding-left: 10px;
display: block;
position: absolute;
top: 0; // fixes firefox bug!
left: 0;
right: 0;
background-color: #e6e6e6;
.vc_panel-tabs-control {
display: list-item;
list-style: none;
float: left;
position: relative;
top: 0;
margin: 9px 2px 0 0; // see border-bottom-width: 0
border: 1px solid transparent;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-bottom-width: 0;
padding: 0;
white-space: nowrap;
font-weight: normal;
.transition(background-color 0.5s ease-out);
color: #949494;
.vc_panel-tabs-link {
color: #949494;
float: left;
padding: 11px 15px;
text-decoration: none;
outline: none;
cursor: pointer;
font-size: 12px;
&:focus {
.box-shadow(none);
}
}
&.vc_active {
background: #ffffff;
font-weight: normal;
color: #595959;
a {
color: #595959;
}
}
&.vc_panel-tabs-color-animated {
background-color: #d7d7d7;
}
}
> :first-child {
margin-left: 6px;
}
}
> .vc_panel-tab {
display: none;
padding: 10px 15px;
&.vc_active {
display: block;
}
}
}
.vc_panel-opacity {
height: 38px !important;
overflow: hidden !important;
min-height: 0; // fixes min-height problem in frontend
&.vc_shortcode-edit-form {
padding-bottom: 0;
}
.vc_panel-footer, .vc_panel-body {
display: none;
}
}
.vc_description {
color: #999999;
display: block;
font-style: italic;
line-height: 20px;
margin-top: 8px;
clear: both;
}
.vc_google_fonts_form_field-preview-wrapper {
margin-top: 10px;
}
.vc_google_fonts_form_field-preview-container {
> span {
font-size: 20px;
}
}

View File

@@ -0,0 +1,26 @@
.vc_placeholder {
width: 100% !important;
background: transparent url(@vc_placeholder_pattern);
margin-top: 5px;
margin-bottom: 5px;
&-row {
padding: 0;
margin: 0 0 35px 0;
background: transparent url(@vc_placeholder_pattern);
height: 50px;
}
&-column {
background: transparent url(@vc_placeholder_pattern);
float: left;
}
&-tab {
background: transparent url(@vc_placeholder_pattern);
}
}
.vc_param_group-list {
.vc_placeholder {
height: 24px;
margin-bottom: 15px;
}
}

View File

@@ -0,0 +1,23 @@
#vc_preloader {
position: fixed;
top: 0;
left: 0;
//z-index: 1031;
z-index: 50021; // gutenberg modal
width: 100%;
height: 100%;
background: #FFF url(../vc/logo/wpb-logo.svg) center center no-repeat;
background-size: 72px;
.opacity(0.95);
}
#vc_overlay_spinner {
position: fixed;
top: 0;
left: 0;
z-index: 50021; // gutenberg modal
width: 100%;
height: 100%;
background: #FFF;
background-size: 72px;
.opacity(0.95);
}

View File

@@ -0,0 +1,123 @@
.composer-switch {
// WPBakery Page Builder/Classic Editor switch
cursor: default;
.box-sizing(border-box);
display: inline-block;
padding: 0;
font-size: 14px;
line-height: 27px;
border-radius: 4px;
a, a:visited {
transition: background-color .2s ease-in-out;
text-decoration: none;
cursor: pointer;
color: #ffffff;
display: inline-block;
line-height: 28px;
height: 28px;
padding: 8px 13px;
background-color: #0073aa;
outline: none;
box-shadow: none;
&.wpb_switch-to-composer {
&:hover {
background-color: #0d3d63;
}
}
&.wpb_switch-to-front-composer {
background-color: #0073aa;
&:hover {
background-color: #0d3d63;
}
}
&.wpb_switch-to-gutenberg {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color: #bcbcbc;
margin-top: 10px;
&:hover {
background-color: #afafaf;
}
}
}
.logo-icon {
background: #0073aa url(../vc/logo/wpb-logo-white.svg) no-repeat center center;
background-size: 16px;
width: 16px;
height: 28px;
display: inline-block;
vertical-align: top;
padding: 8px 10px 8px 13px;
}
.vc_spacer {
display: inline-block;
width: 1px;
background-color: #1f5b8c;
margin: 0;
height: 28px;
padding: 4px 0;
vertical-align: top;
position: relative;
}
> :nth-last-child(2) {
margin-right: 10px;
-webkit-border-top-right-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-topright: 4px;
-moz-border-radius-bottomright: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
}
.composer-inner-switch {
white-space: nowrap;
display: inline-block;
margin: 10px 10px 0 0;
vertical-align: top;
> :first-child {
-webkit-border-top-left-radius: 4px;
-webkit-border-bottom-left-radius: 4px;
-moz-border-radius-topleft: 4px;
-moz-border-radius-bottomleft: 4px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
> :last-child {
-webkit-border-top-right-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-topright: 4px;
-moz-border-radius-bottomright: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
}
.edit-post-header-toolbar {
.composer-switch {
font-size: 12px;
margin-top: 2px;
.wpb_switch-to-gutenberg {
margin-top: 0;
}
.composer-inner-switch {
margin-top: 0;
}
a, a:visited {
padding: 1px 7px;
}
}
}

View File

@@ -0,0 +1,8 @@
.vc_table {
.table;
border-collapse: collapse;
}
.vc_table-bordered {
.table-bordered;
}

View File

@@ -0,0 +1,98 @@
#vc_teaser {
.vc_teaser-constructor {
display: none;
.vc_toolbar {
margin-top: 6px;
text-align: center;
.vc_teaser-checkbox {
display: inline-block;
cursor: pointer;
overflow: hidden;
height: 26px;
margin-right: 4px;
position: relative;
label {
float: left;
width: auto;
input {
margin-right: 0px;
position: absolute;
top: -20px;
}
span {
text-align: center;
display: block;
border: 1px solid #CCCCCC;
padding: 2px 6px 1px;
-webkit-border-radius: @vc_teaser_checkbox_radius;
-moz-border-radius: @vc_teaser_checkbox_radius;
border-radius: @vc_teaser_checkbox_radius;
background: rgb(255, 255, 255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 70%, rgba(241, 241, 241, 1) 100%, rgba(246, 246, 246, 1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(70%, rgba(234, 234, 234, 1)), color-stop(100%, rgba(241, 241, 241, 1)), color-stop(100%, rgba(246, 246, 246, 1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 70%, rgba(241, 241, 241, 1) 100%, rgba(246, 246, 246, 1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 70%, rgba(241, 241, 241, 1) 100%, rgba(246, 246, 246, 1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 70%, rgba(241, 241, 241, 1) 100%, rgba(246, 246, 246, 1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(234, 234, 234, 1) 70%, rgba(241, 241, 241, 1) 100%, rgba(246, 246, 246, 1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6', GradientType=0); /* IE6-9 */
}
input:checked + span {
background: #FFF;
box-shadow: inset 1px 1px 1px 1px #DDDDDD;
color: #5e5e5e;
}
input:hover + span {
}
}
}
}
.vc_teaser_loading_block {
position: absolute;
top: 5px;
right: 5px;
}
.vc_teaser-control {
position: relative;
min-height: 20px;
padding: 4px;
border: 1px dashed #CCC;
margin-bottom: 4px;
.vc_text {
word-break: break-all;
}
.vc_image-featured {
font-size: 14px;
}
.vc_teaser_add_custom_image,
.vc_image-featured {
img {
max-width: 100%;
}
}
.vc_buttons {
margin-bottom: 4px;
}
.vc_link-controls {
margin-top: 4px;
}
textarea {
width: 100%;
height: 100px;
}
a.vc_active, a.vc_active-link {
font-weight: bold;
}
.vc_move {
background: url("../vc/drag_handler.gif") no-repeat center center #FCF8E3;
width: 20px;
height: 18px;
position: absolute;
right: 0;
top: 0;
cursor: move;
}
}
}
}

View File

@@ -0,0 +1,124 @@
@import "ui/vc_ui-fonts.less";
@import "ui/vc_ui-button.less";
@import "ui/vc_ui-helper.less";
@import "ui/vc_ui-icon-pixel.less";
@vc-welcome-border: rgba(125, 125, 125, 0.40);
@vc-welcome-margin: 14px;
@vc-welcome-base-font-size: 14px;
@vc-welcome-gap: 20px;
@vc-welcome-header-font-size: 36px;
@vc-welcome-header-line-height: 1em;
@vc-welcome-header-font-color: #656565;
.vc_welcome {
margin: @vc-welcome-margin;
font-size: @vc-welcome-base-font-size;
text-align: center;
padding: @vc-welcome-gap;
// buttons behavior
.vc_ui-btn-group {
margin-top: @vc-welcome-gap;
margin-bottom: @vc-welcome-gap;
}
.vc_ui-button {
margin: @vc-welcome-gap / 2;
margin-bottom: 0;
min-width: 190px;
text-transform: capitalize;
display: inline-flex;
justify-content: center;
text-decoration: none !important;
align-items: center;
.vc-composer-icon {
font-size: 21px;
padding: 0 .5em 0 0;
}
}
// icon behaviour
.vc_ui-icon-pixel {
padding-right: .5em;
}
}
.vc_welcome-brand {
margin-top: @vc-welcome-gap;
margin-bottom: @vc-welcome-gap * 1.5;
text-align: center;
img {
box-shadow: none;
display: inline-block;
}
}
.vc_welcome-header {
font-weight: 300;
font-size: @vc-welcome-header-font-size;
line-height: @vc-welcome-header-line-height;
color: @vc-welcome-header-font-color;
text-transform: uppercase;
margin-top: @vc-welcome-gap;
margin-bottom: @vc-welcome-gap * 2;
}
.vc_add-element-not-empty-button {
display: inline-block;
position: relative;
font-size: 18px;
color: #FFFFFF;
width: 39px;
height: 38px;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
background-color: #C9C9C9;
cursor: pointer;
border: none !important;
.border-radius(5px);
.transition(background-color 0.5s);
&:hover {
background-color: #E4E4E4;
color: #FFFFFF;
}
.vc-composer-icon {
position: absolute;
left: 50%;
top: 50%;
.translate(-50%, -50%);
}
}
// not empty state
.vc_welcome {
&.vc_not-empty {
border: 1px dashed @vc-welcome-border;
.vc_welcome-visible-e {
display: none;
}
}
&:not(.vc_not-empty) {
.vc_welcome-visible-ne {
display: none;
}
}
}
// editors behaviour
.vc_editor.compose-mode {
.vc_welcome {
margin: 0;
}
}
// media behaviour
@media screen and (max-width: @screen-sm) {
.vc_welcome {
.vc_ui-button {
display: block;
}
}
}