1061 lines
20 KiB
CSS
1061 lines
20 KiB
CSS
/**
|
|
* All of the CSS for WPvivid Plugins Dashboard should be
|
|
* included in this file.
|
|
*/
|
|
.wpvivid-canvas {
|
|
max-width:1600px;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-dashboard, .wpvivid-backup{
|
|
position: relative;
|
|
|
|
border: 1px solid #ccd0d4;
|
|
box-shadow: 0 1px 1px rgba(0,0,0,.04);
|
|
background: #fff;
|
|
}
|
|
.wpvivid-welcome-panel {
|
|
width:100%;
|
|
padding: 0px 10px 0;
|
|
border: 1px solid #ccd0d4;
|
|
box-shadow: 0 1px 1px rgba(0,0,0,.04);
|
|
background: #fff;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-red {
|
|
background:red;
|
|
color:#fff;
|
|
}
|
|
.wpvivid-green {
|
|
background:#8bc34a;
|
|
color:#fff;
|
|
}
|
|
.wpvivid-blue {
|
|
background:#007cba;
|
|
color:#fff;
|
|
}
|
|
.wpvivid-orange {
|
|
background:orange;
|
|
color:#fff;
|
|
}
|
|
.wpvivid-grey {
|
|
background-color:grey;
|
|
color: #fff;
|
|
}
|
|
span.dashicons{
|
|
margin-right:2px;
|
|
}
|
|
.wpvivid-welcome-panel .about-description{
|
|
font-size: 16px;
|
|
margin: 0;
|
|
}
|
|
.wpvivid-page-title {
|
|
font-weight: 700;
|
|
font-size:1.2em;
|
|
}
|
|
.wpvivid-dashicons-large {
|
|
font-size:5em;
|
|
width:1.2em;
|
|
height:1.2em;
|
|
float:left;
|
|
}
|
|
.wpvivid-dashicons-large:hover{
|
|
text-shadow: 0px 0px 2px rgba(0,0,0,0.4);
|
|
}
|
|
.wpvivid-dashicons-middle {
|
|
font-size:3em;
|
|
width:1.2em;
|
|
height:1.2em;
|
|
float:left;
|
|
|
|
}
|
|
|
|
.wpvivid-welcome-bar{
|
|
width:100%;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.wpvivid-welcome-bar-left, .wpvivid-block-left {
|
|
width:50%;
|
|
float:left;
|
|
padding:1em;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-welcome-bar-right, .wpvivid-block-right {
|
|
width:50%;
|
|
float:left;
|
|
padding:1em;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-features-box, .wpvivid-two-cols{
|
|
width:50%;
|
|
float:left;
|
|
font-size:14px;
|
|
padding:1em 1em 1em 1em;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-four-cols{
|
|
width:25%;
|
|
float:left;
|
|
font-size:14px;
|
|
|
|
box-sizing: border-box;
|
|
border:1px solid #f1f1f1;
|
|
}
|
|
.wpvivid-one-coloum {
|
|
width:100%;
|
|
float:left;
|
|
padding:1em 1em 1em 1em;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.wpvivid-dashboard-list {
|
|
padding:1em;
|
|
border:1px solid #eee;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.wpvivid-dashboard li {
|
|
border: 1px solid #eee;
|
|
margin: 0px;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.wpvivid-dashboard li::after {
|
|
content: "";
|
|
clear: both;
|
|
display: table;
|
|
}
|
|
|
|
.wpvivid-dashboard .wpvivid-two-col li {
|
|
border: 1px solid #eee;
|
|
margin: 0px;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.wpvivid-dashboard .wpvivid-two-col li::after {
|
|
content: "";
|
|
clear: both;
|
|
display: table;
|
|
}
|
|
|
|
.wpvivid-dashboard .wpvivid-three-cols li img {
|
|
padding:1em;
|
|
width: 5em;
|
|
height: 5em;
|
|
float: left;
|
|
margin: 0.5em;
|
|
}
|
|
|
|
.wpvivid-dashboard .wpvivid-two-col .wpvivid-three-cols li img {
|
|
padding:1em;
|
|
width: 5em;
|
|
height: 5em;
|
|
float: left;
|
|
margin: 0.5em;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols li
|
|
{
|
|
width:33%;
|
|
float:left;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols-update{
|
|
position:absolute;
|
|
display:block;
|
|
width:1.5em;
|
|
height:1.5em;
|
|
border:1px solid orange;
|
|
border-radius:50%;
|
|
text-align:center;
|
|
vertical-align:middle;
|
|
background:orange;
|
|
color:#fff;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols li {
|
|
border: 1px solid #eee;
|
|
padding:0.2em 0.2em 0 0.2em;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.wpvivid-dashboard .wpvivid-three-cols li::after {
|
|
content: "";
|
|
clear: both;
|
|
display: table;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols-li {
|
|
padding:0.5em 0;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols-active {
|
|
background:#eaf1fe;
|
|
}
|
|
.wpvivid-sidebar-main{
|
|
width:100%;
|
|
float:left;
|
|
font-size:13px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.wpvivid-sidebar-main li::after {
|
|
content: "";
|
|
clear: both;
|
|
display: table;
|
|
}
|
|
.wpvivid-sidebar-main li {
|
|
margin: 0px;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.wpvivid-sidebar-main li img {
|
|
padding:1em;
|
|
width: 5em;
|
|
height: 5em;
|
|
float: left;
|
|
margin: 0.5em;
|
|
}
|
|
.wpvivid-sidebar{
|
|
width:100%;
|
|
float:left;
|
|
font-size:13px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.wpvivid-sidebar li::after {
|
|
content: "";
|
|
clear: both;
|
|
display: table;
|
|
}
|
|
.wpvivid-sidebar li {
|
|
border-bottom: 1px solid #eee;
|
|
margin: 0px;
|
|
padding: 10px;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
.wpvivid-sidebar li img {
|
|
padding:1em;
|
|
width: 5em;
|
|
height: 5em;
|
|
float: left;
|
|
margin: 0.5em;
|
|
}
|
|
.wpvivid-features-box-image-progress {
|
|
width:100%;
|
|
}
|
|
.wpvivid-features-box-image-optimiztion-details {
|
|
width:50%;
|
|
}
|
|
.wpvivid-features-box-image-optimiztion-plate {
|
|
width:50%;
|
|
}
|
|
.wpvivid-features-box-image-optimiztion-percentage{
|
|
margin-top:2.5em;
|
|
}
|
|
.wpvivid-features-box-image-optimiztion-number {
|
|
font-size: 5em;
|
|
font-family:Sans-serif;
|
|
font-weight:600;
|
|
color:orange;
|
|
float:left;
|
|
text-shadow:0 0.05em 0.05em rgba(0,0,0,0.4);
|
|
}
|
|
.wpvivid-features-box-image-optimiztion-percentage-unit {
|
|
font-size:1em;
|
|
color:grey;
|
|
float:left;
|
|
font-size:1.2em;
|
|
padding-bottom:1em;
|
|
}
|
|
.wpvivid-rectangle {
|
|
border-radius:0.4em;
|
|
padding:0.5em;
|
|
margin-left: 0.5em;
|
|
margin-right:0.5em;
|
|
font-size:0.8em;
|
|
}
|
|
.wpvivid-rectangle-small {
|
|
border-radius:0.4em;
|
|
padding:0.2em;
|
|
margin-left: 0.5em;
|
|
margin-right:0.5em;
|
|
font-size:0.6em;
|
|
}
|
|
.wpvivid-span-progress {
|
|
display:block;
|
|
width:100%;
|
|
height:1.5em;
|
|
background-color:#9d9fa5;
|
|
border-radius:0;
|
|
color: #fff;
|
|
|
|
}
|
|
.wpvivid-span-processed-progress {
|
|
display:block;
|
|
height:1.5em;
|
|
background-color:#8bc34a;
|
|
border-radius:0;
|
|
color: #fff;
|
|
padding-left:0.5em;
|
|
}
|
|
.wpvivid-span-processed-percent-progress{
|
|
width:53%;
|
|
}
|
|
.wpvivid-clear-float {
|
|
content: "";
|
|
clear: both;
|
|
display: table;
|
|
width:100%;
|
|
}
|
|
.wpvivid-title {
|
|
font-size:1.2em;
|
|
color:#000;
|
|
}
|
|
.wpvivid-nav-bar{
|
|
width: 100%;
|
|
float: left;
|
|
padding: 1em;
|
|
background-color: #fff;
|
|
margin-bottom: 1em;
|
|
border-top:1px solid #ddd;
|
|
border-bottom:1px solid #ddd;
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
.wpvivid-two-col{
|
|
width:50%;
|
|
float:left;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-float-right{
|
|
float:right;
|
|
}
|
|
.wpvivid-float-left{
|
|
float:left;
|
|
}
|
|
.wpvivid-dashicons-green {
|
|
color:#8bc34a;
|
|
}
|
|
.wpvivid-dashicons-red {
|
|
color:red;
|
|
}
|
|
.wpvivid-dashicons-orange {
|
|
color:orange;
|
|
}
|
|
.wpvivid-dashicons-blue {
|
|
color:#007cba;
|
|
}
|
|
.wpvivid-dashicons-grey, .wpvivid-dashicons-editor-help{
|
|
color:#999;
|
|
}
|
|
.wpvivid-nav-tab-wrapper {
|
|
padding-bottom:0!important;
|
|
|
|
}
|
|
.wpvivid-nav-tab {
|
|
background:#ffffff;
|
|
}
|
|
.wpvivid-nav-tab-active,.wpvivid-nav-tab-active, .wpvivid-nav-tab-active:focus:active, .wpvivid-nav-tab-active:hover {
|
|
border-bottom:1px solid #ffffff;
|
|
background:#ffffff;
|
|
}
|
|
.wpvivid-tabcontent {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.wpvivid-workflow {
|
|
padding:1em;
|
|
border:1px solid #eee;
|
|
border-radius:8px;
|
|
}
|
|
|
|
|
|
/* tooltip */
|
|
.wpvivid-tooltip {
|
|
display:inline-block;
|
|
position:relative;
|
|
text-align:left;
|
|
}
|
|
/* tooltip - top */
|
|
.wpvivid-top {
|
|
min-width:300px;
|
|
top:-20px;
|
|
left:50%;
|
|
transform:translate(-50%, -100%);
|
|
padding:10px 20px;
|
|
color:#444444;
|
|
background-color:#FFFFFF;
|
|
font-weight:normal;
|
|
font-size:13px;
|
|
border-radius:8px;
|
|
position:absolute;
|
|
z-index:99999999;
|
|
box-sizing:border-box;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
visibility:hidden; opacity:0; transition:opacity 0.8s;
|
|
}
|
|
|
|
.wpvivid-tooltip:hover .wpvivid-top {
|
|
visibility:visible; opacity:1;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-top i {
|
|
position:absolute;
|
|
top:100%;
|
|
left:50%;
|
|
margin-left:-12px;
|
|
width:24px;
|
|
height:12px;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-top i::after {
|
|
content:'';
|
|
position:absolute;
|
|
width:12px;
|
|
height:12px;
|
|
left:50%;
|
|
transform:translate(-50%,-50%) rotate(45deg);
|
|
background-color:#FFFFFF;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
}
|
|
|
|
/* tooltip - bottom */
|
|
.wpvivid-bottom {
|
|
min-width:300px;
|
|
top:40px;
|
|
left:50%;
|
|
transform:translate(-50%, 0);
|
|
padding:10px 20px;
|
|
color:#444444;
|
|
background-color:#FFFFFF;
|
|
font-weight:normal;
|
|
font-size:13px;
|
|
border-radius:8px;
|
|
position:absolute;
|
|
z-index:99999999;
|
|
box-sizing:border-box;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
visibility:hidden; opacity:0; transition:opacity 0.4s;
|
|
}
|
|
|
|
.wpvivid-dashicons-editor-help:hover .wpvivid-bottom {
|
|
visibility:visible; opacity:1;
|
|
}
|
|
|
|
.wpvivid-dashicons-white-editor-help:hover .wpvivid-bottom {
|
|
visibility:visible; opacity:1;
|
|
}
|
|
|
|
.wpvivid-dashicons-white:hover .wpvivid-bottom {
|
|
visibility:visible; opacity:1;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-bottom i {
|
|
position:absolute;
|
|
bottom:100%;
|
|
left:50%;
|
|
margin-left:-12px;
|
|
width:24px;
|
|
height:12px;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-bottom i::after {
|
|
content:'';
|
|
position:absolute;
|
|
width:12px;
|
|
height:12px;
|
|
left:50%;
|
|
transform:translate(-50%,50%) rotate(45deg);
|
|
background-color:#FFFFFF;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
}
|
|
/* tooltip - left */
|
|
.wpvivid-left {
|
|
min-width:300px;
|
|
top:50%;
|
|
right:100%;
|
|
margin-right:20px;
|
|
transform:translate(0, -50%);
|
|
padding:10px 20px;
|
|
color:#444444;
|
|
background-color:#FFFFFF;
|
|
font-weight:normal;
|
|
font-size:13px;
|
|
border-radius:8px;
|
|
position:absolute;
|
|
z-index:99999999;
|
|
box-sizing:border-box;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
visibility:hidden; opacity:0; transition:opacity 0.8s;
|
|
}
|
|
|
|
.wpvivid-tooltip:hover .wpvivid-left {
|
|
visibility:visible; opacity:1;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-left i {
|
|
position:absolute;
|
|
top:50%;
|
|
left:100%;
|
|
margin-top:-12px;
|
|
width:12px;
|
|
height:24px;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-left i::after {
|
|
content:'';
|
|
position:absolute;
|
|
width:12px;
|
|
height:12px;
|
|
left:0;
|
|
top:50%;
|
|
transform:translate(-50%,-50%) rotate(-45deg);
|
|
background-color:#FFFFFF;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
}
|
|
/* tooltip - right */
|
|
.wpvivid-right {
|
|
min-width:300px;
|
|
top:50%;
|
|
left:100%;
|
|
margin-left:20px;
|
|
transform:translate(0, -50%);
|
|
padding:10px 20px;
|
|
color:#444444;
|
|
background-color:#FFFFFF;
|
|
font-weight:normal;
|
|
font-size:13px;
|
|
border-radius:8px;
|
|
position:absolute;
|
|
z-index:99999999;
|
|
box-sizing:border-box;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
visibility:hidden;
|
|
opacity:0;
|
|
transition:opacity 0.8s;
|
|
}
|
|
|
|
.wpvivid-tooltip:hover .wpvivid-right {
|
|
visibility:visible; opacity:1;
|
|
}
|
|
.wpvivid-installer-list li{
|
|
padding:0.2em 0;
|
|
}
|
|
.wpvivid-tooltip .wpvivid-right i {
|
|
position:absolute;
|
|
top:50%;
|
|
right:100%;
|
|
margin-top:-12px;
|
|
width:12px;
|
|
height:24px;
|
|
overflow:hidden;
|
|
}
|
|
|
|
.wpvivid-tooltip .wpvivid-right i::after {
|
|
content:'';
|
|
position:absolute;
|
|
width:12px;
|
|
height:12px;
|
|
left:0;
|
|
top:50%;
|
|
transform:translate(50%,-50%) rotate(-45deg);
|
|
background-color:#FFFFFF;
|
|
box-shadow:0 1px 8px rgba(0,0,0,0.5);
|
|
}
|
|
|
|
/* radio box style */
|
|
|
|
.wpvivid-radio {
|
|
display: block;
|
|
position: relative;
|
|
padding-left: 2em;
|
|
margin-bottom: 1em;
|
|
cursor: pointer;
|
|
font-size: 1em;
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
/* Hide the browser's default radio button */
|
|
.wpvivid-radio input {
|
|
position: absolute;
|
|
opacity: 0;
|
|
cursor: pointer;
|
|
}
|
|
/* Create a custom radio button */
|
|
.wpvivid-radio-checkmark {
|
|
position: absolute;
|
|
top: 2px;
|
|
left: 0;
|
|
height: 16px;
|
|
width: 16px;
|
|
background-color: #eee;
|
|
border-radius: 50%;
|
|
}
|
|
/* On mouse-over, add a grey background color */
|
|
.wpvivid-radio:hover input ~ .wpvivid-radio-checkmark {
|
|
background-color: #ccc;
|
|
}
|
|
/* When the radio button is checked, add a blue background */
|
|
.wpvivid-radio input:checked ~ .wpvivid-radio-checkmark {
|
|
background-color: #8bc34a;
|
|
}
|
|
/* Create the indicator (the dot/circle - hidden when not checked) */
|
|
.wpvivid-radio-checkmark:after {
|
|
content: "✔";
|
|
position: absolute;
|
|
font-size:12px;
|
|
top:-1px;
|
|
left:3px;
|
|
display: none;
|
|
color:white;
|
|
}
|
|
/* Show the indicator (dot/circle) when checked */
|
|
.wpvivid-radio input:checked ~ .wpvivid-radio-checkmark:after {
|
|
display: block;
|
|
}
|
|
|
|
/* custom checkbox */
|
|
|
|
/* Customize the label (the container) */
|
|
.wpvivid-checkbox {
|
|
display: block;
|
|
position: relative;
|
|
|
|
padding-left: 2em;
|
|
cursor: pointer;
|
|
font-size: 1em;
|
|
|
|
-webkit-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
}
|
|
/* Hide the browser's default checkbox */
|
|
.wpvivid-checkbox input {
|
|
position: absolute;
|
|
opacity: 0;
|
|
cursor: pointer;
|
|
height: 0;
|
|
width: 0;
|
|
}
|
|
/* Create a custom checkbox */
|
|
.wpvivid-checkbox-checkmark {
|
|
position: absolute;
|
|
top: 3px;
|
|
left: 0;
|
|
height: 16px;
|
|
width: 16px;
|
|
background-color: #eee;
|
|
border-radius: 4px;
|
|
}
|
|
/* On mouse-over, add a grey background color */
|
|
.wpvivid-checkbox:hover input ~ .wpvivid-checkbox-checkmark {
|
|
background-color: #ccc;
|
|
border-radius: 4px;
|
|
}
|
|
/* When the checkbox is checked, add a blue background */
|
|
.wpvivid-checkbox input:checked ~ .wpvivid-checkbox-checkmark {
|
|
background-color: #8bc34a;
|
|
border-radius: 4px;
|
|
}
|
|
/* Create the checkmark/indicator (hidden when not checked) */
|
|
.wpvivid-checkbox-checkmark:after {
|
|
content: "";
|
|
position: absolute;
|
|
display: none;
|
|
}
|
|
/* Show the checkmark when checked */
|
|
.wpvivid-checkbox input:checked ~ .wpvivid-checkbox-checkmark:after {
|
|
display: block;
|
|
}
|
|
/* Style the checkmark/indicator */
|
|
.wpvivid-checkbox .wpvivid-checkbox-checkmark:after {
|
|
left: 4px;
|
|
top: 0px;
|
|
width: 5px;
|
|
height: 10px;
|
|
border: solid white;
|
|
border-width: 0px 3px 3px 0;
|
|
-webkit-transform: rotate(45deg);
|
|
-ms-transform: rotate(45deg);
|
|
transform: rotate(45deg);
|
|
}
|
|
/* toggle switch */
|
|
|
|
/* The switch - the box around the slider */
|
|
.wpvivid-switch {
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 32px;
|
|
height: 16px;
|
|
}
|
|
|
|
/* Hide default HTML checkbox */
|
|
.wpvivid-switch input {
|
|
opacity: 0;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
|
|
/* The slider */
|
|
.wpvivid-slider {
|
|
position: absolute;
|
|
cursor: pointer;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0px;
|
|
background-color: #ccc;
|
|
-webkit-transition: .4s;
|
|
transition: .4s;
|
|
}
|
|
|
|
.wpvivid-slider:before {
|
|
position: absolute;
|
|
content: "";
|
|
height: 12px;
|
|
width: 12px;
|
|
left: 2px;
|
|
bottom: 2px;
|
|
background-color: white;
|
|
-webkit-transition: .4s;
|
|
transition: .4s;
|
|
}
|
|
|
|
input:checked + .wpvivid-slider {
|
|
background-color: #8bc34a;
|
|
}
|
|
|
|
input:focus + .wpvivid-slider {
|
|
box-shadow: 0 0 1px #8bc34a;
|
|
}
|
|
|
|
|
|
input:checked + .wpvivid-slider:before {
|
|
-webkit-transform: translateX(16px);
|
|
-ms-transform: translateX(16px);
|
|
transform: translateX(16px);
|
|
}
|
|
|
|
/* Rounded sliders */
|
|
.wpvivid-slider.wpvivid-round {
|
|
border-radius: 16px;
|
|
}
|
|
|
|
.wpvivid-slider.wpvivid-round:before {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
|
|
/*general postion*/
|
|
.wpvivid-tooltip-padding-top {
|
|
padding-top:0.2em;
|
|
}
|
|
.wpvivid-tooltip-padding-top-small {
|
|
padding-top:0.1em;
|
|
}
|
|
|
|
/* HD computer monitor */
|
|
|
|
@media only screen and (min-width: 1366px) {
|
|
|
|
.wpvivid-four-cols{
|
|
width:100%;
|
|
margin-bottom:1em;
|
|
}
|
|
}
|
|
|
|
/* Tablets in landscape mode, older desktop monitors */
|
|
|
|
@media only screen and (min-width: 1024px) and (max-width: 1365px) {
|
|
|
|
|
|
#poststuff #post-body.columns-2 {
|
|
margin-right: 0px;
|
|
}
|
|
#wpbody-content #post-body.columns-2 #postbox-container-1 {
|
|
margin-right: 0;
|
|
width: 100%;
|
|
}
|
|
.wpvivid-four-cols{
|
|
width:100%;
|
|
margin-bottom:1em;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* Tablets in portrait mode, large display smartphones landscape mode */
|
|
|
|
@media only screen and (min-width: 768px) and (max-width: 1023px) {
|
|
.wpvivid-two-col {
|
|
width:100%;
|
|
}
|
|
.wpvivid-float-right{
|
|
float:left;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols li{
|
|
width:100%;
|
|
box-sizing: border-box;
|
|
}
|
|
.wpvivid-four-cols{
|
|
width:100%;
|
|
margin-bottom:1em;
|
|
}
|
|
.wpvivid-welcome-bar-left{
|
|
width:100%;
|
|
|
|
}
|
|
.wpvivid-welcome-bar-right{
|
|
display:none;
|
|
}
|
|
.wpvivid-ignore{
|
|
display:none;
|
|
}
|
|
|
|
}
|
|
|
|
/* Smartphones in landscape mode */
|
|
|
|
@media only screen and (min-width: 421px) and (max-width: 767px) {
|
|
.wpvivid-features-box,.wpvivid-two-col {
|
|
width:100%;
|
|
}
|
|
.wpvivid-float-right{
|
|
float:left;
|
|
}
|
|
.wpvivid-welcome-bar-left{
|
|
width:100%;
|
|
}
|
|
.wpvivid-welcome-bar-right{
|
|
display:none;
|
|
}
|
|
.wpvivid-four-cols{
|
|
width:100%;
|
|
margin-bottom:1em;
|
|
}
|
|
.wpvivid-ignore{
|
|
display:none;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols li{
|
|
width:100%;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
|
|
/* Smartphones in portrait mode */
|
|
|
|
@media only screen and (max-width: 420px) {
|
|
.wpvivid-features-box,.wpvivid-two-col {
|
|
width:100%;
|
|
}
|
|
.wpvivid-float-right{
|
|
float:left;
|
|
}
|
|
.wpvivid-welcome-bar-left{
|
|
width:100%;
|
|
|
|
}
|
|
.wpvivid-welcome-bar-right{
|
|
display:none;
|
|
}
|
|
|
|
.wpvivid-four-cols{
|
|
width:100%;
|
|
margin-bottom:1em;
|
|
}
|
|
.wpvivid-ignore{
|
|
display:none;
|
|
}
|
|
.wpvivid-img-opt-responsive{
|
|
margin-top:1em;
|
|
padding-top:1em;
|
|
border-top:1px solid #f1f1f1;
|
|
}
|
|
.wpvivid-dashboard .wpvivid-three-cols li{
|
|
width:100%;
|
|
box-sizing: border-box;
|
|
}
|
|
}
|
|
|
|
.wpvivid-rectangle {
|
|
border-radius:0.4em;
|
|
padding:0.5em;
|
|
margin-left: 0.5em;
|
|
margin-right:0.5em;
|
|
font-size:0.8em;
|
|
}
|
|
.wpvivid-rectangle-small {
|
|
border-radius:0.4em;
|
|
padding:0.2em;
|
|
margin-left: 0.5em;
|
|
margin-right:0.5em;
|
|
font-size:0.6em;
|
|
}
|
|
.wpvivid-icon-16px{
|
|
font-size:16px;
|
|
margin-top:2px;
|
|
color:#aaa;
|
|
cursor:pointer;
|
|
}
|
|
.wpvivid-icon-16px-nopointer{
|
|
font-size:16px;
|
|
margin-top:2px;
|
|
}
|
|
.wpvivid-text-line{
|
|
padding:1px;
|
|
white-space:nowrap;
|
|
}
|
|
.wpvivid-text-selected{
|
|
background:#eee;
|
|
}
|
|
.wpvivid-text-line:hover{
|
|
background:#eee;
|
|
}
|
|
.wpvivid-grey {
|
|
background-color:grey;
|
|
color: #fff;
|
|
}
|
|
.wpvivid-grey-light {
|
|
background-color:#eee;
|
|
color: grey;
|
|
}
|
|
.wpvivid-hover-blue:hover{
|
|
background:#007cba;
|
|
color:#fff;
|
|
cursor:pointer;
|
|
}
|
|
.wpvivid-font-hover-blue:hover{
|
|
color:#007cba;
|
|
cursor:pointer;
|
|
}
|
|
.wpvivid-hover-green:hover{
|
|
background:#8bc34a;
|
|
color:#fff;
|
|
cursor:pointer;
|
|
}
|
|
.nav-tab-delete-img-addon{position: absolute;top: 2px;right: 3px;}
|
|
|
|
/* WPvivid Restore Progress Bar */
|
|
.wpvivid-stepper-wrapper
|
|
{
|
|
margin-top: auto;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin-bottom: 20px;
|
|
}
|
|
.wpvivid-stepper-item
|
|
{
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
flex: 1;
|
|
}
|
|
|
|
@media (max-width: 768px)
|
|
{
|
|
.wpvivid-stepper-item
|
|
{
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
|
|
|
|
.wpvivid-stepper-item::before
|
|
{
|
|
position: absolute;
|
|
content: "";
|
|
border-bottom: 2px solid #ccc;
|
|
width: 100%;
|
|
top: 20px;
|
|
left: -50%;
|
|
z-index: 2;
|
|
}
|
|
|
|
.wpvivid-stepper-item::after {
|
|
position: absolute;
|
|
content: "";
|
|
border-bottom: 2px solid #ccc;
|
|
width: 100%;
|
|
top: 20px;
|
|
left: 50%;
|
|
z-index: 2;
|
|
}
|
|
|
|
.wpvivid-stepper-item .wpvivid-step-counter {
|
|
position: relative;
|
|
z-index: 5;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50%;
|
|
background: #ccc;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.wpvivid-stepper-item.active {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.wpvivid-stepper-item.completed .wpvivid-step-counter {
|
|
background-color: #8bc34a;
|
|
color:#fff;
|
|
}
|
|
|
|
.wpvivid-stepper-item.completed::after {
|
|
position: absolute;
|
|
content: "";
|
|
border-bottom: 2px solid #4bb543;
|
|
width: 100%;
|
|
top: 20px;
|
|
left: 50%;
|
|
z-index: 3;
|
|
}
|
|
|
|
.wpvivid-stepper-item:first-child::before {
|
|
content: none;
|
|
}
|
|
.wpvivid-stepper-item:last-child::after {
|
|
content: none;
|
|
}
|
|
|
|
.wpvivid-custom-exclude-tree-info .jstree-open>.jstree-ocl {
|
|
background-position: -165px -75px !important;
|
|
}
|
|
|
|
.wpvivid-custom-exclude-tree-info .jstree-closed>.jstree-ocl {
|
|
background-position: -133px -75px !important;
|
|
}
|
|
|
|
.wpvivid-addon-info-text {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
|
|
.wpvivid-addons {
|
|
cursor:pointer;
|
|
}
|
|
|
|
.wpvivid-remote-storage-tab h2.nav-tab-wrapper :nth-child(n+3):nth-child(-n+11) {
|
|
display:block;
|
|
}
|
|
|
|
.quicksnapshot{width:100%;float:left; box-sizing:border-box;margin-right:10px; padding:10px;}
|
|
.quicksnapshot label{display:inline-block;margin-bottom:10px;} |