Scribd
Upload
19 views4 pages

Theam Code

The document contains CSS styles for the Woostify login form popup and various elements of a WooCommerce site. It includes styles for backgrounds, borders, padding, box shadows, and responsive design for buttons, forms, and navigation. Additionally, it features animations for countdown urgency messages and scrollbar customizations.

Uploaded by

nitingd8
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
19 views4 pages

Theam Code

The document contains CSS styles for the Woostify login form popup and various elements of a WooCommerce site. It includes styles for backgrounds, borders, padding, box shadows, and responsive design for buttons, forms, and navigation. Additionally, it features animations for countdown urgency messages and scrollbar customizations.

Uploaded by

nitingd8
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 4

/* Woostify Login Form Popup */

#woostify-login-form-popup .woostify-login-form-popup-content {
background: #fff; /* Background color */
max-width: 875px; /* Maximum width */
padding: 30px 20px; /* Padding */
width: 100%; /* Full width */
margin: 0 auto; /* Center alignment */
border-radius: 20px; /* Border radius */
box-shadow: rgb(204, 219, 232) 3px 3px 6px 0px inset, rgba(255, 255, 255, 0.5)
-3px -3px 6px 1px inset; /* Box shadow */
}

/* Scrollbar */
::-webkit-scrollbar {
width: 6px;
}
::-webkit-scrollbar-track {
background-color: #F7F7F7; /* Scrollbar track background color */
border-radius: 9px; /* Scrollbar track border radius */
}
::-webkit-scrollbar-thumb {
background: linear-gradient(180deg,#1000C7, #9303C7); /* Scrollbar thumb
background */
border-radius: 5px; /* Scrollbar thumb border radius */
}

/* Site Header Inner */


.site-header-inner {
background-color: #ffffff; /* Background color */
box-shadow: rgb(149 157 165 / 11%) 0px 8px 24px; /* Box shadow */
}

/* Buttons and Links */


.cart-sidebar-content .woocommerce-mini-cart__buttons a:not(.checkout),
.product-loop-meta .button,
.multi-step-checkout-button[data-action="back"],
.multi-step-checkout-button[data-action="back"] .woostify-svg-icon,
.review-information-link,
a {
color: rgba(22,22,22,1); /* Text color */
margin-bottom: 7px; /* Bottom margin */
}

/* WooCommerce Form Toggles */


.woocommerce-form-login-toggle .woocommerce-info,
.woocommerce-form-coupon-toggle .woocommerce-info {
margin-top: 30px; /* Top margin */
}

/* WooCommerce Product Shortcode Container */


.wpsc-header {
background-color: #1346af !important; /* Background color */
background: linear-gradient(230deg,#2301C7, #8C03C7); /* Gradient background */
border-radius: 20px; /* Border radius */
}

.wpsc-shortcode-container {
background-color: #fff !important; /* Background color */
border: 0px solid #ffffff !important; /* Border */
color: #ffffff; /* Text color */
border-radius: 20px; /* Border radius */
}

/* Shop Cart Sidebar */


#shop-cart-sidebar {
border-radius: 20px; /* Border radius */
}

/* Form Input Text */


.form-row .input-text {
width: 100%; /* Full width */
height: 50px; /* Height */
padding: 0 1em; /* Padding */
border-radius: 20px; /* Border radius */
box-shadow: rgba(0, 0, 0, 0.18) 0px 2px 4px; /* Box shadow */
}

/* My Account Tab Head */


.elementor-691 .elementor-element.elementor-element-2c7db0b .woostify-my-account-
tab-head {
text-align: center; /* Text alignment */
margin: 0px 0px 30px 0px; /* Margin */
box-shadow: rgba(17, 17, 26, 0.1) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 8px
24px, rgba(17, 17, 26, 0.1) 0px 16px 48px; /* Box shadow */
border-radius: 7px; /* Border radius */
padding-top: 5px; /* Top padding */
}

/* WooCommerce Account Form Styles */


.woocommerce-account .u-column1 .woocommerce-form-login {
width: 100%; /* Full width */
max-width: 100%; /* Maximum width */
background-color: white; /* Background color */
border-radius: 20px; /* Border radius */
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; /* Box shadow */
}

.woocommerce-account .woocommerce-form.woocommerce-form-register {
border: 2px dashed #e8e8e8; /* Border */
padding: 30px; /* Padding */
background-color: white; /* Background color */
border-radius: 20px; /* Border radius */
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; /* Box shadow */
}

/* Woostify Container in Boxed Layout */


.site-boxed-container .site-content .woostify-container {
max-width: 100%; /* Maximum width */
margin-top: 30px; /* Top margin */
}

/* Product Image Background Color (Home Page) */


.elementor-76 .elementor-element.elementor-element-c3a1237 .woostify-products-
widget .product-loop-image-wrapper {
background-color: #f5f5f5; /* Background color */
border-radius: 20px; /* Border radius */
}
/* Trending Deal Product Image Background Color */
.elementor-76 .elementor-element.elementor-element-6072a95 .woostify-products-
widget .product-loop-image-wrapper {
background-color: #f5f5f5; /* Background color */
border-radius: 20px; /* Border radius */
}

/* Product Image Background Color (Shop Page) */


.elementor-141 .elementor-element.elementor-element-4a7f903 .woostify-products-
widget .product-loop-image-wrapper {
background-color: #f5f5f5; /* Background color */
border-radius: 20px; /* Border radius */
}

/* Main Navigation Sub-menu Shadow */


.main-navigation .primary-navigation > .menu-item .sub-menu {
box-shadow: 4px 4px 0px 0px #22E6F8; /* Box shadow */
border-radius: 10px; /* Border radius */
}

/* Disable product image zoom */


.product-images {
overflow: hidden; /* Hide overflow */
position: relative; /* Position relative */
pointer-events: none; /* Disable pointer events */
}

.checkout-layout-3:not(.woobuilder-active) form.checkout .col-left .form-


row:not(.field-readonly):not(.no-label) .input-text {

border-radius: 15px;
}

.elementor-widget-woostify-product-add-to-cart .single_add_to_cart_button.button {
width: 70%;
display: block;
margin: 0 auto;
}

/* Media query for phones */


@media only screen and (max-width: 768px) {
.elementor-widget-woostify-product-add-to-
cart .single_add_to_cart_button.button {
width: 90%;
}
}

/*Product page product quantity hidden*/


.cart:not(.elementor-menu-cart__products) .quantity {

display: none;
}

.button, .woocommerce-widget-layered-nav-dropdown__submit, .form-


submit .submit, .elementor-button-wrapper .elementor-button, .has-woostify-contact-
form input[type="submit"], #secondary .widget a.button, .product-loop-meta.no-
transform .button, .product-loop-meta.no-transform .added_to_cart,
[class*="elementor-kit"] .checkout-button {
background-color: #1346af;
color: #ffffff;
border-radius: 20px;
box-shadow: 4px 4px 0px 0px #22E6F8;
border-radius: 10px;
}

.cart-sidebar-content .woocommerce-mini-cart__buttons a:not(.checkout) {

background: #dbdbdb;
}

.site-header-inner .woostify-container {
display: flex;
justify-content: space-between;
height: 30px;

@media (min-width: 783px) {


.logged-in.admin-bar .sticky-add-to-cart-section.from-top {
top: 7px;
}
}

.single-product .woostify-countdown-urgency.default .woostify-countdown-urgency-


message .woostify-countdown-urgency-message-text {
background: linear-gradient(to right, #1D01C7, #8D02C7, #ff0000);
background-size: 200% 100%;
animation: gradientAnimation 3s ease infinite;
color: white;
font-weight: 500;
border-radius: 20px;
box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}

@keyframes gradientAnimation {
0% {
background-position: 0 0; /* Start from the left */
}
50% {
background-position: 100% 0; /* Move to the right */
}
100% {
background-position: 0 0; /* Start from the left again */
}
}

.woostify-countdown-urgency.default {

border-radius: 20px;
}

You might also like