Your IP : 216.73.216.44
/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; visibility: hidden; }
.clearboth, .clearfix:after { clear: both; }
/* fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }
.invisible {
visibility: hidden;
}
.vamtam-config-page .disabled .button,
.vamtam-config-page .disabled .button-primary {
opacity: .3;
}
/*
* tabs/ tab sections
*/
#vamtam-config-tabs {
ul {
margin: 0;
padding: 0;
}
li {
display: inline-block;
margin: 0;
}
a {
color: #555;
border-color: #ccc;
background: #e4e4e4;
}
a:hover,
.ui-tabs-active a {
color: #000;
background: none;
border-color: #ccc;
border-bottom-color: #f1f1f1;
}
.ui-tabs-active a {
border-width: 1px;
color: #464646;
}
}
h2.vamtam-config-no-tabs {
padding-left: 1px;
font-size: 30px;
}
/*
* admin header
*/
#vamtam-config-title {
display: none;
width: 827px;
margin-top: 30px;
padding-top: 10px;
}
/*
* helper links under header
*/
#vamtam-first-run,
#vamtam-config-title-links {
background-color: #f0f0f0;
padding: 5px 10px;
border-top: 1px solid #fff;
}
#vamtam-first-run {
border-bottom: 1px solid #dfdfdf;
border-width: 1px 0;
background-color: #ccf;
}
#vamtam-config-title-links * {
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#vamtam-config-title-links .button-primary {
float: right;
position: relative;
top: 3px;
margin-top: -3px;
padding: 0 6px;
margin-right: 10px;
}
#vamtam-config-title-links a {
color: #666;
text-decoration: none;
margin: 0 5px;
text-transform: uppercase;
font-size: 10px;
font-weight: bold;
position: relative;
top: 4px;
float: left;
}
#vamtam-config-title-links a:hover {
color: #21759b;
}
#vamtam-config-title-links a:first-child { margin-left: 0; }
#vamtam-config-title-links a:last-child { margin-right: 0; }
/*
* title in admin header
*/
#vamtam-config-title h2 {
color: #666;
padding: 10px;
font-style: normal;
border-bottom: 1px solid #dfdfdf;
}
#vamtam-config-title p {
margin: 0;
padding: 10px 0;
}
#vamtam-config-title .message {
margin: 0;
-moz-border-radius: 0;
border-radius: 0;
border: 0;
background: #999BB9;
color: #f0f0f0;
text-align: center;
}
/*
* config groups
*/
.vamtam-config-group {
.config-info {
padding: 15px 60px 15px 0;
.info-wrapper {
padding: 20px 18px;
position: relative;
background-color: #fff;
border-left: 4px solid #0074a2;
box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.1);
.title {
color: #B07320;
font-weight: bold;
}
.desc {
display: none;
padding-top: 15px;
color: #707070;
&.visible {
display: block;
}
}
> a {
position: absolute;
right: 18px;
top: 20px;
}
}
}
.config-separator {
font-weight: bold;
padding: 30px 0 16px 7px;
line-height: 1;
border-bottom: 1px solid #ccc;
font-size: 1.17em;
}
}
.vamtam-config-group.metabox {
background: none;
border: 0;
&,
input,
select,
textarea {
font-family: sans-serif;
font-family: 12px;
}
.ui-tabs-nav {
background: none;
padding: 0;
border-bottom: 1px solid #ccc;
}
.vamtam-meta-tab {
display: inline-block;
border: 0;
margin-bottom: -2px;
padding-bottom: 1px;
background: transparent;
a {
display: inline-block;
text-decoration: none;
padding: 14px 18px 10px 18px;
line-height: 1;
font-size: 14px;
font-family: sans-serif;
color: #21759b;
&:hover {
color: #d54e21;
}
}
&.ui-tabs-active {
margin-bottom: -2px;
a {
border: 1px solid #ccc;
border-bottom-color: #fff;
background: #fff;
border-radius: 3px 3px 0 0;
color: #464646;
}
}
}
.vamtam-meta-part {
background: #fff;
&.ui-tabs-panel {
border-top-width: 1px;
padding: 0 6px;
}
}
}
#vamtam-portfolio-formats-select {
.vamtam-config-group.metabox .vamtam-meta-part {
background: transparent;
border: 0;
padding: 0;
}
.rtitle {
display: none;
}
.rcontent {
margin-left: 0;
padding-top: 0;
.toggle-radio {
display: block;
padding: 4px 0;
}
}
.vamtam-config-row {
border: 0;
}
}
.vamtam-config-group h4 {
font-size: 15px;
font-weight: normal;
color: #464646;
margin: 10px 0;
padding: 7px 0;
font-family: Georgia,"Times New Roman","Bitstream Charter",Times,serif;
}
.vamtam-config-row.autofill {
&.no-box {
.rcontent > div {
background: transparent;
border: 0;
}
}
.rcontent > div {
max-width: 648px;
background: #fff;
border: 1px solid #eee;
.autofill-description {
margin: 0;
text-shadow: 0 1px 0 #fff;
color: #555;
background: #fff;
border-bottom: 1px solid #eee;
font: 400 14px/19px 'Open Sans', sans-serif;
padding: 7px 12px;
}
.autofill-thumbs {
padding: 8px;
a {
display: inline-block;
margin: 11px;
border: 1px solid #ddd;
box-shadow: 0 1px 0 #fff;
position: relative;
z-index: 1;
img {
cursor: pointer;
vertical-align: bottom;
}
&.selected,
&:hover {
box-shadow: 0 0 0 1px white, 0 0 0 5px #85CA47;
&:before {
content: "";
display: block;
position: absolute;
background-image: url(../images/mark.png);
background-repeat: no-repeat;
height: 30px;
width: 30px;
top: -15px;
right: -15px;
z-index: 11;
}
}
}
}
}
}
.vamtam-config-row {
padding: 6px 20px;
clear: both;
}
.vamtam-config-row {
padding: 0 0 20px 0;
border-bottom: 1px solid #e9e9e9;
&.slim {
border-bottom: 0;
padding-bottom: 0;
}
&.short-border {
border-bottom: 0;
padding-bottom: 0;
.rcontent {
padding-bottom: 20px;
border-bottom: 1px solid #e9e9e9;
}
}
&.no-border {
border-bottom: 0;
}
select {
max-width: 100%;
}
.rtitle {
float: left;
width: 160px;
padding: 27px 12px 0 12px;
h4 {
margin: 0;
padding: 0;
font-family: sans-serif;
font-size: 12px;
}
}
.rcontent {
padding-top: 25px;
margin-left: 184px;
}
}
/*
* footer
*/
.save-vamtam-config {
width: 827px;
margin: 0;
padding: 20px 14px 25px 14px;
}
/*
* portfolio gallery
*/
.imageItemWrap .hndle {
vertical-align: middle;
width: 10px;
}
.imageItemWrap .hndle div {
width: 10px;
height: 10px;
background: #55f;
-moz-border-radius: 50px;
border-radius: 50px;
-moz-box-shadow: 0 0 10px rgba(0,0,0,0.4);
-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.4);
-o-box-shadow: 0 0 10px rgba(0,0,0,0.4);
box-shadow: 0 0 10px rgba(0,0,0,0.4);
}
#imagesSortable .sortItem-placeholder {
background: #f0f0f0;
border: 1px solid #ccc;
}
#credits_tbl {
border: 1px solid #dfdfdf;
}
.vamtam_page_vamtam_help #vamtam-config,
.vamtam-help {
padding: 10px 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.result {
color: #FF4B33;
display: block;
}
/* toggle */
.vamtam-config-row.toggle {
.rcontent {
img {
margin-right: 10px;
border: 1px solid #bbb;
}
.toggle-radio {
display: inline-block;
margin-right: 15px;
}
}
}
/* toggle */
/* radio */
.vamtam-config-row.radio {
.toggle-radio {
display: inline-block;
margin-right: 15px;
}
}
/* radio */
.vamtam-config-row .slide-type {
margin-bottom: 5px;
}
.vamtam-config-row[data-slide-type="html"] .slide-types .image {
display: none;
}
.vamtam-config-row .slide-types .html textarea {
width: 100%;
}
.hidden_el {
border-top: 1px solid #ccc;
padding-top: 10px
}
.hidden_el:first-child {
border-top: 0;
padding: 0
}
.vamtam-config-row {
select[multiple] {
height: 6em;
}
label.checkbox-row {
line-height: 1.8;
}
}
/*** image upload ***/
.upload-basic-wrapper {
.image-upload-controls {
display: inline-block;
vertical-align: bottom;
width: 160px;
height: 25px;
padding-right: 10px;
&.vamtam-video-upload-controls {
width: auto;
}
}
.image-upload-preview {
display: none;
vertical-align: bottom;
}
&.active {
.image-upload-preview:not(.hidden) {
display: inline-block;
}
}
.button {
display: inline-block;
margin-right: 5px;
}
img {
border: 1px solid #dfdfdf;
max-width: 80px;
max-height: 25px;
min-width: 30px;
vertical-align: bottom;
}
}
.vamtam-upload-undo,
.vamtam-upload-clear {
display: inline-block;
margin-left: 1px;
}
.vamtam-upload-undo.hidden,
.vamtam-upload-clear.hidden {
display: none;
}
/** backgrounds **/
.vamtam-config-row.background {
.bg-block {
margin-right: 15px;
display: inline-block;
&.bg-color,
&.bg-image {
width: 300px;
}
.ui-range-slider {
width: 150px;
}
}
.bg-position {
width: 82px;
}
.hidden {
display: none;
}
.toggle-radio {
padding-right: 15px;
}
.bg-inner-row {
padding-bottom: 25px;
&:last-child {
padding-bottom: 0;
}
}
}
/** text fields **/
.vamtam-config-row {
&.text input,
&.textarea textarea {
width: 600px;
max-width: 100%
}
}
/** color rows **/
.color-row .single-color {
float: left;
padding-right: 5px;
}
.vamtam-config-row .single-desc {
font-size: 9px;
padding-bottom: 8px;
color: #777;
}
.color-row .single-color input {
font-size: 11px;
}
.vamtam-config-row .vamtam-colorpicker {
width: 130px;
border: 1px solid #dfdfdf;
border-radius: 3px;
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAAZCAYAAACLvRPfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjJEMDQwNDAzMkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjJEMDQwNDA0MkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MkQwNDA0MDEyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MkQwNDA0MDIyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5nbDNSAAABO0lEQVR42uzdPS4FUQAF4DtBIXRCtBQ24CesACFhC4SCHShEFDZAITbgtyRhd+NM5tnDvfF9yenf5CQnkzfz7uv6vi8V65K75KoA/15X+WD9uUzukymVgcFqwXHynMyqDQxWC3aSz2RBdWCwWrCW/CQr6gOD1YLl5CtZVyEYrBbMJx/JnhrBYLVgJnlKTlQJBquJa0huk2t1gsFqxXnyWLyrBQarEYfJazKnWjBYLdgq4xPERfWCwWrBbhnf1QIMVtU2J3dYS+oFg1Wzg+St+A4LDFblzsr4lHBarWCwqr2G5GYSwGBVa7ibGt50P1UlGKyaDb8lfE/21QgGq2bDaQ3DuVgbKgSDVbPhPKzvZFV9YLBqtl3Gd6ycOAoGq2pHyUtxpjsYrMpdJA/FSQxgsGr+fMX/EgITvwIMAJBNY7YggCv5AAAAAElFTkSuQmCC');
background-position: -15px center;
padding-left: 50px;
color: #444 !important;
font-size: 12px;
background-size: cover;
&.vamtam-state-transparent {
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAAZCAAAAACu1kwDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjJEMDQwNDA3MkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjJEMDQwNDA4MkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MkQwNDA0MDUyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MkQwNDA0MDYyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6IWNVXAAAAwklEQVRYw+3YrwvCYBDG8f3fN4PJaBSbiPHwR7M4DGJSbKLJ4sBkmuDU7QzDKDxmv0+7+oH37r1LrIk3+V4dgiQqlu8qsGQsHz3AkrGsfwNLxrLuFSwZyzr5f2NpSp9qegFLxvLxCSzXX2MG1g+ta1KBpff5YQmWPhR7BVgylg34Z8lmiztYKtbqyQ9exdrWrDsiVrpnN1SxWhsWaRWrfeTqIF8dzlwd1DE4LwIsESsrAywRa/0KsESsWR1gaVjpMsgbTfhCyWAv+vsAAAAASUVORK5CYII=')
}
}
#vamtam-colorpicker {
background: #fafafa;
border: 1px solid #ccc;
border-radius: 3px;
z-index: 1000000;
.transparent {
display: block;
text-align: center;
border-top: 1px solid #ccc;
margin-top: 10px;
cursor: pointer;
color: inherit;
padding: 5px 0;
}
}
/** select rows **/
.select-row,
.range-row {
.single-option {
display: inline-block;
padding-right: 5px;
}
}
#front-static-pages label[for="page_for_posts"] {
display: none;
}
body.toplevel_page_layerslider {
#wpbody-content .screen-meta-toggle a {
background: none;
}
}
.rAds {
display: none !important;
}
.vamtam-import-button.button {
vertical-align: baseline;
margin-right: 10px;
+ .import-success {
color: #46b450;
}
+ .import-fail {
color: #dc3232;
}
}
.form-table.vamtam-table th {
width: 280px;
}
.vamtam-system-status {
.dashicons-yes {
color: #46b450;
}
.dashicons-warning {
color: #ffb900;
}
}
.vamtam-box-button {
width: 200px;
background: #FFFFFF;
border: 1px solid #DDDDDD;
display: inline-block;
margin-right: 15px;
margin-bottom: 15px;
text-align: center;
text-decoration: none;
transition: all .3s ease;
color: #000;
font-weight: 600;
font-size: 12px;
&:hover {
box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.07);
.dashicons {
color: #00a0d2;
}
}
.dashicons {
display: block;
width: 100%;
padding: 10px 0px;
color: #0073AA;
font-size: 30px;
font-weight: normal;
height: 60px;
line-height: 60px;
}
span.label {
width: 100%;
display: block;
background: #FAFAFA;
padding: 10px 0px;
border-top: 1px solid #E6E6E6;
}
}
//Vamtam Theme Setup
.vamtam-ts {
margin-left: -20px;
margin-top: -15px;
display: flex;
#vamtam-ts-side {
flex: 0 0 25%;
background-color: white;
min-width: 300px;
min-height: 100%;
position: fixed;
top: 32px;
z-index: 1;
width: 300px;
}
#vamtam-ts-main {
flex: 0 1 75%;
background-color: #f1f1f1;
margin-left: 300px;
flex-basis: 100%;
}
#vamtam-ts-main {
> .main-content {
padding: 40px 35px;
.vamtam-box-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 100%;
span.icon {
color: #4270a4;
font-size: 35px;
margin-bottom: 30px;
width: unset;
}
svg {
fill: #4270a4;
margin-bottom: 30px;
width: 35px;
}
> a, a.vamtam-ts-button {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
padding: 10px 20px;
font-weight: bold;
min-height: 50px;
text-align: center;
}
}
.vamtam-box-wrap {
box-sizing: border-box;
border: 1px solid #e1e1e1;
background-color: white;
> header {
padding: 10px 20px;
background-color: #f8f8f8;
h3 {
font-weight: 500;
}
}
> .content {
padding: 20px;
display: flex;
flex-direction: column;
justify-content: flex-end;
box-sizing: border-box;
> a, a.vamtam-ts-button {
border-radius: 3px;
padding: 10px 30px;
min-height: auto;
width: max-content;
}
p {
&.vamtam-description {
margin-top: 0;
margin-bottom: 20px;
font-size: 14px;
color: #4b4b4b;
&.warning {
color: #f0c875;
}
}
&:empty {
display: none;
}
}
}
}
}
> #message {
margin-top: 30px;
}
}
&#vamtam-ts-homepage {
#vamtam-check-license-disclaimer {
position: absolute;
bottom: 0;
border-top: 1px solid #e5e5e5;
margin-top: 100px;
padding: 20px 20px 0 20px;
font-size: 1.4em;
color: #7b7d85;
> h5 {
color: black;
margin: 0;
}
}
#vamtam-envato-license-key {
height: 60px;
max-width: 60%;
border: 1px solid #dedede;
font-weight: bold;
margin: 0;
&::placeholder {
color: #d2d2d2;
}
}
#vamtam-check-license.unregister {
cursor: pointer;
display: flex !important;
background-color: #c2321f;
border-color: #c2321f;
color: white;
box-shadow: none;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
height: 60px;
padding: 0 20px;
flex-direction: column;
justify-content: center;
align-items: center;
margin-left: -5px;
margin-bottom: 0;
span.icon {
font-size: 2em;
}
&.disabled {
pointer-events: none;
}
}
#vamtam-ts-main {
position: fixed;
right: 0;
left: 35px;
top: 0;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: center;
}
body:not(.vamtam-not-verified) & {
.form-table {
th {
display: none;
}
td {
margin-top: 25px;
}
}
}
}
&#vamtam-ts-help {
> #vamtam-ts-main {
padding: 35px;
> .main-content {
> .vamtam-sd {
> .content {
padding: 20px 20px 0 20px;
> span {
display: block;
font-size: 14px;
margin-bottom: 20px;
}
> .cards-wrap {
display: flex;
flex-wrap: wrap;
padding: 10px;
> span {
flex: 1 1 calc( 33% - 40px );
margin: 20px;
}
}
}
}
> .vamtam-hd-ss-wrap {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 40px;
> .vamtam-hd {
flex: 1;
position: relative;
margin-right: 15px;
p.vamtam-description {
margin-bottom: 50px;
}
}
> .vamtam-ss {
flex: 1;
margin-left: 15px;
table.form-table {
&, td, tr, th {
padding: 0;
margin: 0;
}
td {
> p.description {
margin: 10px;
color: #4b4b4b;
}
> label {
margin: 10px;
}
}
}
th {
display: none;
}
}
}
}
}
}
&#vamtam-ts-import-content {
#vamtam-ts-main {
> .main-content {
display: flex;
flex-wrap: wrap;
> .vamtam-box-wrap {
margin: 10px;
&.import-fail > header {
background-color: #fcf2f2;
}
#import-statuses {
display: flex;
flex-wrap: wrap;
margin: 0;
li {
font-size: 14px;
margin-bottom: 20px;
margin-right: 20px;
}
span.import-status {
width: 10px;
height: 10px;
display: inline-block;
border-radius: 50%;
margin-right: 10px;
&.yes { background-color: #85c43d; }
&.warning { background-color: #f0c875; }
&.no { background-color: #d5d5d5; }
}
}
.import-btn-wrap {
display: flex;
align-items: center;
margin-top: 20px;
a.vamtam-ts-button {
display: flex;
justify-content: center;
margin-right: 10px;
}
.import-success {
color: #46b450;
}
.import-fail {
color: #b5321f;
a {
text-decoration: none;
color: #4e7dad;
}
}
}
}
> .vamtam-box-wrap:nth-child(1) {
flex-basis: calc( 100% - 20px );
}
> .vamtam-box-wrap:not(:nth-child(1)) {
flex-basis: calc( 50% - 20px );
}
}
}
}
span.icon {
font-family: 'theme';
font-size: 3em;
}
.vamtam-ts-button {
border: 1px solid #4474a6;
border-bottom-width: 3px;
background-color: #4b81b4;
font-weight: 500;
font-size: 15px;
color: white;
cursor: pointer;
min-height: 50px;
padding: 10px 35px;
text-decoration: none;
&:hover {
background-color: #4b81b4;
color: white;
border-color: #4474a6;
}
&.disabled {
pointer-events: none;
background-color: #fbfbfb;
color: #afafaf;
border-color: #e5e5e5;
}
&.done {
color: #565656;
background-color: #f2f2f2;
border: none;
border-radius: 2px;
&::before {
font-family: "dashicons";
content: "\f147";
margin-right: 5px;
margin-left: -5px;
display: inline-block;
vertical-align: bottom;
}
}
}
.input {
margin-bottom: 20px;
background-color: #fff;
font-size: 17px;
width: 100%;
min-height: 50px;
padding: 15px 15px;
border-radius: 5px;
border: none;
text-align: center;
transition: box-shadow 0.3s, transform 0.3s;
}
#vamtam-theme-title {
position: relative;
font-weight: bold;
color: black;
> span {
display: block;
}
#vamtam-ts-greeter {
font-size: 21px;
margin-bottom: 8px;
font-weight: 500;
}
#vamtam-ts-greeter-title {
font-size: 32px;
margin-bottom: 10px;
line-height: 1;
}
#vamtam-ts-greeter-ver {
display: inline-block;
background-color: #f2f2f2;
font-size: 12px;
font-weight: normal;
padding: 3px 7px;
border-radius: 3px;
color: #4b4b4b;
}
margin-bottom: 40px;
}
#vamtam-ts-dash-register,
#vamtam-ts-import-content,
#tgmpa-plugins {
form#vamtam-register-form {
padding-top: 50px;
text-align: center;
svg#vamtam-envato-logo {
height: 30px;
width: auto;
}
}
.form-table {
tbody {
display: flex;
flex-direction: column;
justify-content: center;
align-content: center;
}
th, td {
display: block;
width: 100%;
text-align: center;
}
tr {
display: flex;
flex-direction: column;
input[type="text"] {
.input();
}
span button {
.vamtam-ts-button();
}
}
}
}
// Plugin page, filter tabs
#vamtam-plugins-filters {
> ul {
display: flex;
flex-flow: row wrap;
align-items: center;
list-style: none;
padding-left: 20px;
margin: 0;
> li {
margin: 0;
display: inline-flex;
&:last-child {
margin-left: 5px;
}
a {
padding: 10px;
font-size: 12px;
font-weight: bold;
max-height: 30px;
text-decoration: none;
background-color: #e4e4e4;
color: #565656;
border: 1px solid #d6d6d6;
cursor: pointer;
&.active {
border-bottom: 1px solid #f1f1f1;
background-color: transparent;
color: black;
}
&:focus {
box-shadow: none;
outline: none;
}
}
}
}
> hr {
height: 1px;
margin-top: -1px;
border: 0;
background-color: #d6d6d6;
}
}
.submit {
padding: 20px;
input[type="submit"] {
.vamtam-ts-button();
text-shadow: unset;
}
}
#vamtam-ts-nav-menu {
display: flex;
flex-direction: column;
height: 100%;
padding: 40px 35px;
box-sizing: border-box;
.ts-icon {
color: #4270a4;
fill: #4270a4;
margin-right: 20px;
&.dashicons {
font-size: 30px;
line-height: unset;
}
}
> ul {
position: relative;
margin-bottom: 0;
> li {
list-style: none;
margin-bottom: 15px;
a {
&.disabled {
opacity: 0.6;
pointer-events: none;
}
span.vamtam-step-status {
position: absolute;
right: 15px;
border-radius: 50%;
display: inline-block;
justify-self: flex-end;
width: 5px;
height: 5px;
&.success {
background-color: #85c43d;
}
&.error {
background-color: #e15741;
}
&.warning {
background-color: #f0c875;
}
}
}
&.is-active a {
background-color: #e0eff7;
border-color: #4b81b4;
}
}
}
> ul > li a,
> a#vamtam-hs-btn {
display: flex;
align-items: center;
padding: 20px;
color: black;
border: 1px solid #e5e5e5;
background-color: white;
border-radius: 5px;
font-size: 1.1em;
text-decoration: none;
font-weight: bold;
box-sizing: border-box;
max-height: 62px;
}
> #vamtam-human-menu {
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
}
> a#vamtam-hs-btn {
position: absolute;
bottom: 50px;
z-index: 1;
background: white;
color: black;
width: 230px;
box-sizing: border-box;
&.is-active {
border: 1px solid #ff3d3b;
}
.ts-icon {
fill: #ff3d3b;
}
}
}
#vamtam-ts-dash-register {
.form-table {
th:first-of-type {
font-weight: normal;
font-size: 1.3em;
margin-top: 20px;
margin-bottom: 10px;
}
td, th {
padding: 0;
}
}
p#vamtam-code-help {
text-decoration: none;
font-size: smaller;
font-weight: bold;
margin-bottom: 20px;
}
#vamtam-verified-code p {
margin-bottom: -30px;
padding: 0 20px;
font-size: 20px;
color: #1c1b17;
}
}
#vamtam-check-license-result {
margin: 20px;
color: white;
p.vamtam-check-license-response span {
display: block;
padding: 20px;
font-size: 18px;
border-radius: 5px;
margin-bottom: 20px;
&#success {
background-color: #85c43d;
}
&#fail, &.fail {
background-color: #e15741;
}
}
}
.vamtam-licence-wrap {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 25px;
#vamtam-license-result,
#vamtam-license-result-wrap > span {
box-sizing: border-box;
height: 60px;
padding: 20px;
font-size: 15px;
font-weight: bold;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
color: white;
margin-right: -5px;
display: flex;
align-items: center;
justify-content: center;
z-index: 1;
svg {
fill: currentColor;
margin-right: 10px;
}
.dashicons {
font-size: 30px;
width: auto;
height: auto;
}
&.valid {
background-color: #85c43d;
}
&.invalid {
background-color: #e15741;
}
}
#vamtam-license-result-wrap {
z-index: 1;
> span {
display: none;
}
}
}
#vamtam-post-result {
> p {
display: none;
padding: 0 20px;
}
}
// TGMPA Install Plugins Page
&#vamtam-ts-tgmpa {
#tgmpa-plugins{
padding-top: 50px;
table.wp-list-table {
margin: 0 20px;
width: calc( 100% - 40px );
thead > tr {
> td, > th {
padding-top: 15px;
padding-bottom: 15px;
}
}
}
th#description {
width: 40%;
}
#bulk-action-selector-bottom {
.input();
font-size: 14px;
min-height: 0;
padding: 10px 15px;
border-radius: 3px;
border: initial;
margin-bottom: 0;
margin-right: 10px;
font-weight: 500;
height: 47px; //safari has a bug with min-height in flex containers.
}
.tablenav.bottom {
> .bulkactions {
display: flex;
justify-content: center;
align-items: center;
float: none;
padding: 20px;
padding-bottom: 0;
@media only screen and (max-width: 480px) {
flex-direction: column;
#bulk-action-selector-bottom {
max-width: unset;
margin-bottom: 10px;
}
}
}
}
#the-list tr:nth-child(odd) {
background-color: #f7f7f7;
}
.tablenav.top,
tfoot {
display: none;
}
#doaction2 {
.vamtam-ts-button();
}
#vamtam-recommended-plugins-notice {
display: none;
background-color: #f8e9a3;
color: #4c4834;
padding: 20px;
border-radius: 5px;
border: 1px solid #f4d169;
margin: 20px;
align-items: center;
svg {
flex-shrink: 0;
margin-right: 20px;
}
}
#vamtam-required-plugins-notice {
display: none;
margin: 20px;
color: #6e6e6e;
strong {
color: black;
}
> br {
margin-bottom: 12px;
}
}
&.no-row-actions {
.row-actions.visible {
display: none;
}
}
//TGMPA logo
.tablenav.bottom > p {
display: none;
}
}
.subsubsub {
width: 100%;
text-align: center;
display: none;
}
}
.vamtam-notice-wrap {
flex-basis: 100%;
min-height: 150px;
background-color: white;
display: flex;
align-items: center;
.vamtam-notice {
border-left: 4px solid red;
padding: 5px 20px;
background-color: white;
}
}
@media only screen and (max-width: 360px) {
&#vamtam-ts-help {
> #vamtam-ts-main > .main-content {
.vamtam-box-btn {
> a, a.vamtam-ts-button {
word-wrap: break-word;
white-space: normal;
}
}
}
}
}
@media only screen and (max-width: 768px) {
flex-direction: column;
&#vamtam-ts-homepage {
#vamtam-ts-main {
position: static;
}
#vamtam-check-license-disclaimer {
position: static;
margin-bottom: -90px;
}
#vamtam-ts-dash-register {
padding: 20px;
}
}
&#vamtam-ts-import-content {
#vamtam-ts-main {
.main-content > .vamtam-box-wrap:not(:nth-child(1)) {
flex-basis: calc( 100% - 20px );
}
}
}
&#vamtam-ts-help {
> #vamtam-ts-main {
padding: 0;
}
}
#vamtam-ts-side {
min-height: auto;
position: relative;
width: auto;
}
#vamtam-ts-main {
margin-left: 0;
> .main-content {
padding: 20px;
}
}
#vamtam-ts-nav-menu {
> a#vamtam-hs-btn {
position: static;
width: auto;
}
}
}
@media only screen and (max-width: 999px) {
&#vamtam-ts-help {
> #vamtam-ts-main > .main-content {
.vamtam-hd-ss-wrap {
flex-direction: column;
> div {
&:nth-child(1) {
margin-right: 0px;
margin-bottom: 15px;
}
&:nth-child(2) {
margin-left: 0px;
margin-top: 15px;
}
}
}
}
}
}
@media only screen and (max-height: 560px) and (min-width: 768px) {
&#vamtam-ts-homepage {
#vamtam-ts-side,
#vamtam-ts-main {
position: absolute;
}
}
}
}
body {
// Hide footer on theme setup pages.
&.vamtam_page_vamtam_theme_setup_plugin_manager,
&.vamtam_page_tgmpa-install-plugins,
&.vamtam_page_vamtam_theme_setup_import_content,
&.toplevel_page_vamtam_theme_setup,
&.vamtam_page_vamtam_theme_help {
#wpfooter {
display: none;
}
}
&.toplevel_page_vamtam_theme_setup {
#wpbody {
position: static;
> #wpbody-content {
> #message {
position: absolute;
right: 0;
margin: 10px;
}
}
}
&:not(.folded) {
#vamtam-ts-homepage #vamtam-ts-main {
left: 160px;
}
}
@media only screen and (min-width: 783px ) and (max-width: 960px) {
&.auto-fold {
#vamtam-ts-homepage #vamtam-ts-main {
left: 35px;
}
}
}
@media only screen and (min-width: 769px ) and (max-width: 782px) {
&.auto-fold {
#vamtam-ts-homepage #vamtam-ts-main {
left: -10px;
}
}
}
}
&.vamtam_page_tgmpa-install-plugins {
#wpbody {
> #wpbody-content {
> #message {
position: absolute;
right: 0;
margin: 10px;
}
}
}
}
}