舒舒服服水电费多少发多少*(^&*(
/home/unifccue/www/wp-content/themes/woodmart/inc/admin/assets/sass/pages/xtemos/_setup-wizard.scss
// ------------------------------------------------------------------------------------------------
// SETUP WIZARD
// ------------------------------------------------------------------------------------------------
@if $page-setup-wizard {
.xts-wizard {
#wpbody-content {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
padding-top: 0;
// min-height: calc(100vh - 100px);
min-height: 100vh;
max-width: 100%;
:is(
.xts-setup-wizard-wrap,
.xts-footer) {
// margin-right: auto;
// margin-left: auto;
margin-inline: auto;
max-width: 1000px;
width: 100%;
}
.xts-footer {
margin-top: 20px;
}
}
&:has(.xts-plugin-wrapper.xts-loading), // #PARTS-HAS
&:has(.xts-import-items.xts-loading) { // #PARTS-HAS
.xts-wizard-nav,
#wpadminbar,
#adminmenu,
.xts-footer.xts-theme-style {
pointer-events: none;
}
}
}
.xts-setup-wizard {
display: flex;
min-height: 580px;
border-radius: var(--xts-brd-radius);
background-color: #F7F7F7;
--xts-primary-color: #7CB32B;
--xts-btn-primay-color: #7CB32B;
--xts-btn-primary-color-hover: #70A128;
--xts-primary-color-darker-10: #70A128;
--xts-primary-color-darker-20: #659124;
--xts-primary-color--rgb: 124, 179, 43;
img {
max-width: 100%;
height: auto;
vertical-align: middle;
}
a {
outline: none;
box-shadow: none;
text-decoration: none;
transition: all .25s ease;
}
input[type="text"] {
&:disabled {
pointer-events: none;
}
}
.xts-box {
background-color: transparent;
box-shadow: none;
}
.xts-box-header {
margin-bottom: 25px;
min-height: auto;
border: none;
h3 {
margin: 0;
}
}
:is(
.xts-box-header,
.xts-box-content) {
padding: 0;
}
.xts-msg {
> p {
// margin-top: 0;
// margin-bottom: 30px;
margin-block: 0 30px;
}
}
.xts-notice {
font-size: 12px;
}
.xts-note {
background-color: #F1F1F1;
font-size: 12px;
}
::-webkit-scrollbar,
::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb {
border-radius: 3px;
}
::-webkit-scrollbar {
width: 5px;
}
::-webkit-scrollbar-track {
background-color: rgba(#000,.05);
}
::-webkit-scrollbar-thumb {
background-color: rgba(#000,.12);
}
}
.xts-wizard-nav {
position: relative;
display: flex;
flex-direction: column;
justify-content: space-between;
max-width: 260px;
width: 100%;
// background: linear-gradient(180deg, var(--xts-primary-color) 0%, var(--xts-primary-color-darker-10) 100%);
background: linear-gradient(180deg, rgba(124,179,43,1) 0%, rgba(104,153,30,1) 100%);
border-start-start-radius: var(--xts-brd-radius);
border-end-start-radius: var(--xts-brd-radius);
flex-shrink: 0;
ul {
margin: 0;
padding: 60px 45px;
li {
margin-bottom: 20px;
transition: all .25s ease;
user-select: none;
a {
position: relative;
display: flex;
align-items: center;
color: rgba(255,255,255,.8);
&:before {
content: "";
display: block;
margin-inline: 1px 13px;
// margin-inline-start: 1px;
// margin-inline-end: 13px;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #FFF;
}
&:after {
content: "\f15e";
position: absolute;
top: 0;
inset-inline-start: 1px;
width: 20px;
color: var(--xts-primary-color);
text-align: center;
font-size: 16px;
font-family: "dashicons";
line-height: 20px;
}
}
&.xts-active {
opacity: 1;
a {
color: #FFF;
&:after {
top: 6px;
inset-inline-start: 7px;
width: 8px;
height: 8px;
border-radius: 50%;
background-color: var(--xts-primary-color);
font-size: 0;
}
}
}
&:is(
.xts-active,
.xts-disabled) {
pointer-events: none;
}
&.xts-disabled {
opacity: .5;
a {
&:before {
margin-top: 1px;
margin-inline: 2px 14px;
// margin-inline-start: 2px;
// margin-inline-end: 14px;
margin-bottom: 2px;
width: 17px;
height: 17px;
}
&:after {
display: none;
}
}
}
&:hover {
&:not(.xts-disabled) {
a {
color: #FFF;
}
}
}
}
}
.xts-wizard-nav-bg-img {
position: absolute;
// right: 0;
// left: 0;
inset-inline: 0;
bottom: 0;
}
}
.xts-wizard-help {
display: flex;
align-items: center;
padding: 0 40px 40px 40px;
color: #FFF;
font-size: 18px;
&:before {
margin-inline-end: 10px;
}
&:hover,
&:focus {
color: rgba(255,255,255,.8);
}
}
.xts-wizard-content {
display: flex;
flex-grow: 1;
flex-direction: column;
justify-content: space-between;
padding: 60px 60px 40px 60px;
h3 {
// margin-top: 0;
// margin-bottom: 25px;
font-size: 26px;
line-height: 1;
// + p {
// margin-bottom: 25px;
// }
}
p {
color: #A2A2A2;
}
.xts-btn {
// display: inline-flex;
align-items: center;
padding: 0 20px;
height: 40px;
line-height: 40px;
&.xts-shown {
display: inline-flex;
}
}
.xts-disabled .xts-color-primary, // NOTE IF FOOTER IS DISABLED
.xts-color-primary.xts-disabled {
// background-color: var(--xts-grey-color) !important;
color: #B9B9B9 !important;
pointer-events: none;
user-select: none;
}
.xts-disabled .xts-btn.xts-color-primary,
.xts-color-primary.xts-disabled {
background-color: var(--xts-grey-color) !important;
}
.xts-disabled {
.xts-inline-btn {
opacity: .5;
}
}
.xts-next {
&:after {
// margin-inline-start: 5px;
// margin-inline-end: -5px;
margin-inline: 5px -5px;
font-weight: 400;
@include font-icon($xts-icon-button-right);
.rtl & {
@include font-icon($xts-icon-button-left);
}
}
}
.xts-prev {
&:before {
// margin-inline-start: -5px;
// margin-inline-end: 5px;
margin-inline: -5px 5px;
font-weight: 400;
@include font-icon($xts-icon-button-left);
}
.rtl & {
&:before {
@include font-icon($xts-icon-button-right);
}
}
}
}
.xts-wizard-logo {
margin-bottom: 25px;
min-height: 36px;
max-width: 245px;
width: 245px;
}
.xts-wizard-footer {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 30px;
&.xts-disabled {
pointer-events: none;
}
}
:is(
.xts-wizard-footer,
.xts-wizard-buttons) {
:is(
.xts-btn,
.xts-inline-btn) {
&:not(:first-child) {
margin-inline-start: 20px;
}
}
.xts-inline-btn {
// margin-top: 10px;
// margin-bottom: 10px;
margin-block: 10px;
}
}
// ------------------------------------------
// 1. WELCOME
// ------------------------------------------
.xts-wizard-welcome {
p {
max-width: 550px;
}
}
.xts-wizard-content {
.xts-wizard-signature {
margin-top: 30px;
// min-height: 57px;
line-height: 60px;
img {
margin-inline-start: 10px;
max-width: 95px;
}
}
}
.xts-wizard-buttons {
margin-top: 40px;
}
// ------------------------------------------
// 2. ACTIVATION
// ------------------------------------------
.xts-wizard-content {
.xts-license {
.xts-box-header {
// display: flex;
flex-wrap: wrap;
h3 {
margin-bottom: 20px;
}
p {
display: block;
width: 100%;
}
}
}
.xts-license-img {
display: none;
}
.xts-license-content {
flex-basis: 100%;
max-width: 100%;
}
.xts-license-btn {
&:before {
inset-inline-start: 14px;
}
input {
padding-inline-start: 35px;
}
}
}
// ------------------------------------------
// 3. CHILD THEME
// ------------------------------------------
.xts-wizard-child-theme {
&.xts-installed {
.xts-child-image {
opacity: 1;
transform: none;
&:before {
opacity: 1;
}
}
+ .xts-wizard-footer {
.xts-skip {
display: none;
}
}
}
&:not(.xts-installed) {
+ .xts-wizard-footer {
.xts-next {
display: none;
}
}
}
}
.xts-theme-images {
display: flex;
align-items: center;
margin-bottom: 20px;
min-height: 115px;
> div {
padding: 3px;
border: 1px solid rgba(0, 0, 0, .05);
border-radius: var(--xts-brd-radius);
background-color: #FFF;
img {
border-radius: inherit;
}
}
}
.xts-main-image {
position: relative;
z-index: 5;
}
.xts-child-image {
position: relative;
margin-inline-start: 10px;
max-width: 135px;
opacity: 0;
transition: all .4s ease;
transform: translateX(-100%);
&:before {
position: absolute;
top: -7px;
inset-inline-end: -7px;
display: flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: var(--xts-primary-color);
color: #FFF;
font-size: 17px;
opacity: 0;
transition: all .4s ease .4s;
@include font-icon($xts-icon-check);
}
}
.xts-install-child-theme {
&.xts-loading {
&:after {
display: inline-block !important;
@include act-loader;
}
}
&:after {
display: none !important;
margin-inline-end: -5px;
margin-inline-start: 12px;
@include loader(14px,1px,rgba(255,255,255,.15),#FFF);
}
}
.xts-wizard-child-theme {
&.xts-installed {
.xts-color-primary {
background-color: var(--xts-grey-color);
color: #B9B9B9 !important;
pointer-events: none;
user-select: none;
}
}
}
// ------------------------------------------
// 4. PAGE BUILDER
// ------------------------------------------
.xts-wizard-builder-select {
display: flex;
flex-direction: column;
gap: 10px;
> :is(
div,
span) {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
width: 100%;
}
> div {
flex: 1 1 0%;
align-items: center;
flex-direction: row;
justify-content: flex-start;
gap: 15px;
padding: 20px;
// padding-top: 25px;
// border: 1px solid #EDEDED;
// border: 1px solid rgba(0, 0, 0, .05);
border-radius: var(--xts-brd-radius);
background-color: #FFF;
// text-align: center;
cursor: pointer;
transition: all .25s ease;
border: 2px solid transparent;
> * {
// opacity: .5;
// filter: grayscale(100%);
transition: inherit;
}
p {
margin-bottom: 0;
}
// &.xts-active {
// > * {
// opacity: 1;
// filter: grayscale(0);
// }
// }
// &.xts-active,
// &:hover {
// // border-color: var(--xts-btn-primay-color);
// // box-shadow: inset 0 0 0 1px var(--xts-btn-primay-color);
// border-color: var(--xts-btn-primay-color);
// }
&:hover {
border-color: var(--xts-option-border-color);
}
&.xts-active {
border-color: var(--xts-btn-primay-color);
}
}
> span {
display: none;
// margin-right: 15px;
// margin-left: 15px;
// margin-inline: 15px;
font-weight: 500;
}
}
.xts-page-builder-img {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.xts-page-builder-text {
display: flex;
flex-direction: column;
gap: 4px;
}
.xts-page-builder-title {
// margin-top: 15px;
// margin-bottom: 8px;
// margin-block: 15px 8px;
color: #333;
font-weight: 700;
font-size: 16px;
}
// ------------------------------------------
// 6. IMPORT
// ------------------------------------------
.xts-wizard-dummy {
.xts-sp-20 {
--xts-sp: 10px;
}
:is(
.xts-btn,
.xts-bordered-btn) {
padding: 0 10px;
height: 30px;
font-size: 11px;
line-height: 30px;
}
.xts-box-header {
margin-bottom: 20px;
.xts-col {
justify-content: space-between;
}
.xts-import-search {
// margin-inline-start: 10px;
// margin-inline-end: 0;
margin-inline: 10px 0;
}
}
:is(
.xts-col-remove-content,
.xts-col-dummy-nav) {
display: none !important;
}
.xts-notices-sticky {
top: 0;
margin-top: 0;
padding-top: 0;
background-color: #F7F7F7;
}
.xts-box-content {
overflow-x: hidden;
overflow-y: scroll;
padding-inline-end: 10px;
padding-bottom: 5px !important;
min-height: 400px;
max-height: 400px;
}
.xts-wizard-footer {
margin-top: 20px;
}
.xts-box-footer {
display: none;
}
.xts-import-item {
&:hover {
box-shadow: none;
}
}
.xts-import-item-title {
font-size: 13px;
line-height: 15px;
}
.xts-import-item-btn {
&:after {
inset-inline-start: 7px;
}
}
.xts-import-item-footer {
padding: 10px;
}
}
.xts-wizard-dummy {
&.imported-base {
+ .xts-wizard-footer {
.xts-skip {
display: none;
}
.xts-prev {
visibility: hidden;
opacity: 0;
}
}
}
&:not(.imported-base) {
+ .xts-wizard-footer {
.xts-next {
display: none;
}
}
}
}
// ------------------------------------------
// 7. DONE
// ------------------------------------------
.xts-wizard-content-inner {
&.xts-wizard-done {
display: none;
flex-direction: column;
justify-content: center;
height: 100%;
> p {
margin-top: 0;
}
.xts-wizard-buttons {
margin-top: 10px;
}
}
}
.xts-setup-wizard {
&.xts-done {
.xts-wizard-content-inner {
&.xts-wizard-dummy {
&,
+ .xts-wizard-footer {
display: none;
}
}
&.xts-wizard-done {
display: flex;
}
}
.xts-wizard-done-nav {
display: block;
}
.xts-wizard-nav {
> ul,
.xts-wizard-help {
display: none;
}
}
}
}
.xts-wizard-done-nav {
display: none;
margin-top: 50px;
// margin-right: 15px;
// margin-left: 15px;
margin-inline: 15px;
text-align: center;
h3 {
color: #FFF;
font-size: 22px;
}
p {
margin: 0 auto;
max-width: 210px;
color: rgba(255, 255, 255, .8);
font-size: 16px;
}
}
.xts-wizard-done-nav-img {
min-height: 140px;
}
// ------------------------------------------------------------------------------------------------
// RESPONSIVE
// ------------------------------------------------------------------------------------------------
@media (max-width: 1024px) {
.xts-wizard-nav {
max-width: 200px;
ul {
padding: 45px 25px;
}
}
.xts-wizard-help {
// padding-right: 20px;
// padding-left: 20px;
padding-inline: 20px;
}
}
// ------------------------------------------------------------------------------------------------
// RTL
// ------------------------------------------------------------------------------------------------
// .rtl {
// .xts-wizard-nav {
// ul {
// li {
// a {
// &:before {
// margin-right: 1px;
// margin-left: 13px;
// }
// &:after {
// right: 1px;
// left: auto;
// }
// }
// &.xts-active {
// a {
// &:after {
// right: 7px;
// left: auto;
// }
// }
// }
// &.xts-disabled {
// a {
// &:before {
// margin-right: 2px;
// margin-left: 14px;
// }
// }
// }
// }
// }
// }
// .xts-wizard-help {
// &:before {
// margin-right: 0;
// margin-left: 10px;
// }
// }
// .xts-wizard-content {
// .xts-next {
// &:after {
// content: "\f341";
// margin-right: 5px;
// margin-left: -5px;
// }
// }
// .xts-prev {
// &:before {
// content: "\f345";
// margin-right: -5px;
// margin-left: 5px;
// }
// }
// }
// .xts-wizard-footer,
// .xts-wizard-buttons {
// .xts-btn,
// .xts-inline-btn {
// &:not(:first-child) {
// margin-right: 25px;
// margin-left: 0;
// }
// }
// }
// // ------------------------------------------
// // 1. WELCOME
// // ------------------------------------------
// .xts-wizard-content {
// .xts-wizard-signature {
// img {
// margin-right: 10px;
// margin-left: 0;
// }
// }
// }
// // ------------------------------------------
// // 3. CHILD THEME
// // ------------------------------------------
// .xts-child-image {
// margin-right: 10px;
// margin-left: 0;
// transform: translateX(100%);
// &:before {
// right: auto;
// left: -7px;
// }
// }
// .xts-install-child-theme {
// &:after {
// margin-right: 12px;
// margin-left: -5px;
// }
// }
// }
}