?
vc_ui-panel-window.less 0000666 00000004050 15126352344 0011153 0 ustar 00 @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;
}
}
// 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;
}
}
} vc_ui-panel-header.less 0000666 00000007063 15126352344 0011103 0 ustar 00 @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: #2b4b80;
@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 url(../vc/editors/ui/vc_ui-header-graphics/vc_ui-header-graphic.png) 100% 0 no-repeat;
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_ui-icon-pixel-close,
.vc_ui-icon-pixel-minimize {
margin: 5px;
}
.vc_ui-icon-pixel-cog {
margin: 3px;
}
}
}
// 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: '';
background: transparent url(../vc/editors/ui/vc_ui-header-graphics/vc_ui-icon-pixel-search.png) 0 0 no-repeat;
display: block;
opacity: .5;
position: absolute;
left: 6px;
top: 50%;
transform: translateY(-50%);
transition-property: opacity;
transition-duration: @vcui-panel-header-transition-duration;
transition-timing-function: ease-in-out;
cursor: pointer;
}
input[type=search]:focus + label {
opacity: 1;
cursor: default;
}
}
}
vc_ui-panel-footer.less 0000666 00000001547 15126352344 0011152 0 ustar 00 @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_ui-panel.less 0000666 00000001633 15126352344 0007652 0 ustar 00 @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: 100000;
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;
}
}