assets/css/scss/partials/_woocommerce.scss
.vertical-align {
@media (min-width: 768px) {
display: flex;
align-items: center;
}
}
// Account
body:not(.logged-in).woocommerce-account.my-plan {
.wc-social-login {
max-width: 550px;
margin-left: auto;
margin-right: auto;
}
.woocommerce {
max-width: 550px;
margin-left: auto;
margin-right: auto;
p.woocommerce-LostPassword.lost_password {
a {
color: #f7ae00;
}
}
h1.lost-your-password-title {
font-size: 30px;
display: block;
font-family: 'Lora', serif;
margin-bottom: 20px;
}
.woocommerce-ResetPassword.lost_reset_password {
.woocommerce-form-row.form-row.form-row-first {
width: 100%;
label {
font-weight: 400;
}
}
}
}
#main .woocommerce button.woocommerce-button.button.woocommerce-form-login__submit {
padding: 10px 40px;
}
}
body.woocommerce-order-received {
.wc-social-login,
.woocommerce-info {
display: none;
}
}
// Edit Account
body.woocommerce-account.woocommerce-edit-account {
#primary.content-area {
margin-top: 0px;
margin-bottom: 0px;
}
}
// Lost Password
body.logged-in.woocommerce-account.woocommerce-lost-password {
article.page {
padding: 8.4rem 0;
}
}
body:not(.logged-in).woocommerce-account.woocommerce-lost-password {
.wrap.container {
width: 100%;
.archive-header-wrapper.banner-page {
display: block !important;
padding: 0;
height: 200px;
width: 100vw;
.archive-header {
height: 100%;
display: flex;
justify-content: center;
align-items: center;
.archive-title {
font-size: 0;
&:before {
font-size: 40px;
content: 'Lost Password';
}
}
}
}
}
article.page {
width: 66.66667% !important;
margin: 0 auto;
.woocommerce {
form {
.form-row-first label {
font-weight: 700 !important;
}
.form-row-last {
float: none;
width: 100%;
}
}
}
}
}
body:not(.logged-in).woocommerce-login,
body:not(.logged-in).content-restricted,
body:not(.logged-in).gutenberg-compatible-template.using-gutenberg.woocommerce-login,
body:not(.logged-in).gutenberg-compatible-template.using-gutenberg.content-restricted {
.woocommerce,
.wc-social-login {
max-width: 550px;
margin-left: auto;
margin-right: auto;
}
}
body:not(.logged-in) {
.excerpt {
.woocommerce {
display: none;
}
}
}
// Banners
.page-banner-wrap {
.page-banner {
> .page-banner-image {
bottom: 0;
background-color: #2b3840;
}
}
}
// Checkout
.mobile-header-hamburger.checkout {
#masthead {
#searchform {
display: none;
}
}
}
.checkout.lsx-wc-checkout-distraction-free.page-template {
.checkout-cta-bottom {
display: inherit;
margin-top: 4.25rem;
}
.header-wrap {
#lsx-banner {
display: none;
}
#masthead {
.primary-navbar {
display: none !important;
}
.checkout-navbar {
width: 100%;
display: flex;
justify-content: flex-end;
@media (max-width: 1199px) {
display: none;
}
ul {
li {
a {
font-weight: bold;
}
}
}
}
}
}
.wrap.container {
#primary {
#main {
.woocommerce {
.woocommerce-notices-wrapper {
display: none;
}
}
}
}
}
}
#payment {
&.woocommerce-checkout-payment {
.form-row.place-order {
background: #fff;
padding: 0px 20px 20px 20px !important;
.woocommerce-terms-and-conditions-wrapper {
background: #f6f6f6;
margin-left: -20px;
margin-right: -20px;
.validate-required {
padding-bottom: 20px !important;
}
}
button#place_order {
margin-top: 5px;
float: initial;
width: 100%;
background-color: #f7ae00;
box-shadow: 2px 2px 0 0 #ce9100;
&:hover {
background-color: #ce9100;
}
}
}
}
}
// Login page
.page.login,
.recipe-template-default,
.post-type-archive-recipe,
.tax-recipe-type,
.tax-recipe-cuisine,
.my-plan,
.single-plan {
#footer-cta,
#footer-widgets {
display: none;
}
}
// Single Plan
.content-area {
.plans-products-wrapper {
@include media('>=tablet') {
max-width: 1140px;
display: flex;
justify-content: space-between;
margin-left: auto;
margin-right: auto;
}
@include media('<=phone') {
padding: 0 2rem;
}
.plan-product {
text-align: center;
margin-left: auto;
margin-right: auto;
padding: 2.4rem;
margin-bottom: 4rem;
background-color: white;
flex-grow: 1;
min-width: 50%;
@extend .box-shadow;
@media (min-width: 768px) {
&:not(.col-md-12) {
max-width: 540px;
}
min-width: auto;
width: 50%;
}
.title {
a {
color: $gray;
font-size: 22px;
font-weight: bold;
}
}
.amount {
color: #30bb00;
font-size: 22px;
font-weight: bold;
padding: 1rem;
display: block;
}
}
}
}
// Plan Archive
.post-type-archive-plan {
.woocommerce-notices-wrapper {
margin-top: 4.25rem;
padding-left: 5px;
padding-right: 5px;
&:empty {
display: none;
}
.woocommerce-message {
margin-bottom: 0;
}
}
}