تجاوز إلى المحتوى
سجل الدردشة




أنت قلت:
body {background: white !important;}.top-navbar {background: #7a5e17 !important;}header.store-header {background: #c0bcb3 !important;}.topnav-link-item {display: none;}.top-navbar .s-search-input {background: #d6cdb7 !important;}.main-nav-container {background: #c0bcb3;color: #515151;box-shadow: none;}i.header-btn__icon {border: 1px solid #515151;color: #515151;}.main-nav-container.fixed-header .inner {background: #c0bcb3;border-bottom: 2px solid #7a5e17;}section.s-block.s-block--fixed-banner .container {max-width: 100%;padding: 0;margin: 0;}section.s-block.s-block--fixed-banner:nth-of-type(1) .container {margin-top: -34px;}.s-slider-block__title-right,.s-slider-block__title h2 {padding-left: 0 !important;margin: auto;font-size: 15px;}.s-product-card-entry {box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;overflow: visible;}.s-products-slider-card.swiper-slide {padding-bottom: 30px;}.s-product-card-content-title a {text-align: center !important;color: #040404 !important;}h4.s-product-card-price {margin: auto;color: #cd2929;}.s-product-card-content-sub {justify-content: center;}.s-product-card-content-footer {width: 65%;margin: auto;margin-bottom: -35px;}button.s-button-element.s-button-btn.s-button-outline.s-button-wide {background: #7a5e17 !important;color: white;font-size: 14px;}.store-footer__inner .container > div {border-radius: 20px;display: flex;flex-direction: column;align-items: center;text-align: center;padding-left: 0;padding-bottom: 20px;}.store-footer__inner .container {grid-template-columns: repeat(4, minmax(0, 1fr));}.store-footer__inner {background: #c2c0b4 !important}.banner--fixed img {background: transparent !important;}footer.store-footer {border-top: 2px solid #dadada;}.store-footer__inner + div {background: #7a5e17;max-width: 100%;justify-content: space-around;}.store-footer__inner + div * {color: white;}.s-product-card-sale-price span,.store-footer h3,.store-footer *,.item-price,.item-price + p {color: #7a5e17;border-width: 0 !important;}nav.breadcrumbs * {font-size: 17px;}.s-products-list-vertical-cards {row-gap: 3.5rem;}a.banner-entry.square-photos {height: 603px;background: transparent;}.store-footer__inner::after {right: 41px;content: "";background-image: url("https://cdn.salla.sa/NKDjVV/BniW1o5Yw5Wb3M5XWsv1GT57WN9HKHp0p0h6zQvV.jpg");background-size: 122px;background-repeat: no-repeat;position: absolute;display: block;width: 188px;height: 190px;top: 60px;}.s-user-menu-trigger {padding-bottom: 6px;background: transparent;}@media(max-width:600px) {section.s-block.s-block--fixed-banner:nth-of-type(1) .container {margin-top: -29px;}.s-cart-summary-total,.store-footer__inner::after {display: none !important;}section.sticky-product-bar {display: flex;flex-direction: column;gap: 5px;}.s-product-card-content-footer {margin-bottom: -28px;}.product-single footer.store-footer {padding-bottom: 40px;}.store-footer__inner .container {display: flex;flex-direction: column;}.s-search-container.s-search-inline {padding-left: 10px;}a.banner-entry.square-photos {height: 93vw !important;}button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center {padding: 3px 5px;font-size: 11px;}button.s-button-element.s-button-btn.s-button-outline .sicon-shopping-bag:before {display: none;}}
  نسقها وفصلها
قال ChatGPT:
تمام… رتّبت لك الأكواد قسمتها ونظّفتها وخليتها واضحة وسهلة التعديل.
جاهزة تنسخها مباشرة بدون لخبطه.

✅ CSS منسّق + مقسوم إلى أقسام واضحة
/* ================================
   ⚪ 1) الخلفية والألوان العامة
================================ */
body {
    background: white !important;
}

/* ================================
   🟤 2) التوب بار + البحث + الأيقونات
================================ */
.top-navbar {
    background: #7a5e17 !important;
}

.topnav-link-item {
    display: none;
}

.top-navbar .s-search-input {
    background: #d6cdb7 !important;
}

i.header-btn__icon {
    border: 1px solid #515151;
    color: #515151;
}

/* ================================
   🟡 3) الهيدر الرئيسي
================================ */
header.store-header,
.main-nav-container {
    background: #c0bcb3 !important;
    color: #515151;
    box-shadow: none;
}

.main-nav-container.fixed-header .inner {
    background: #c0bcb3;
    border-bottom: 2px solid #7a5e17;
}

/* ================================
   🟢 4) البنرات
================================ */
section.s-block.s-block--fixed-banner .container {
    max-width: 100%;
    padding: 0;
    margin: 0;
}

section.s-block.s-block--fixed-banner:nth-of-type(1) .container {
    margin-top: -34px;
}

.banner--fixed img {
    background: transparent !important;
}

/* ================================
   🔵 5) عناوين السلايدر
================================ */
.s-slider-block__title-right,
.s-slider-block__title h2 {
    padding-left: 0 !important;
    margin: auto;
    font-size: 15px;
}

/* ================================
   🟣 6) كروت المنتجات
================================ */
.s-product-card-entry {
    box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px;
    overflow: visible;
}

.s-products-slider-card.swiper-slide {
    padding-bottom: 30px;
}

.s-product-card-content-title a {
    text-align: center !important;
    color: #040404 !important;
}

h4.s-product-card-price {
    margin: auto;
    color: #cd2929;
}

.s-product-card-content-sub {
    justify-content: center;
}

.s-product-card-content-footer {
    width: 65%;
    margin: auto;
    margin-bottom: -35px;
}

button.s-button-element.s-button-btn.s-button-outline.s-button-wide {
    background: #7a5e17 !important;
    color: white;
    font-size: 14px;
}

/* ================================
   🟤 7) الفوتر
================================ */
.store-footer__inner {
    background: #c2c0b4 !important;
    position: relative;
}

.store-footer__inner .container > div {
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding-left: 0;
    padding-bottom: 20px;
}

.store-footer__inner .container {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

footer.store-footer {
    border-top: 2px solid #dadada;
}

.store-footer__inner + div {
    background: #7a5e17;
    max-width: 100%;
    justify-content: space-around;
}

.store-footer__inner + div * {
    color: white;
}

/* أيقونة العلامة في الفوتر */
.store-footer__inner::after {
    right: 41px;
    content: "";
    background-image: url("https://cdn.salla.sa/NKDjVV/BniW1o5Yw5Wb3M5XWsv1GT57WN9HKHp0p0h6zQvV.jpg");
    background-size: 122px;
    background-repeat: no-repeat;
    position: absolute;
    display: block;
    width: 188px;
    height: 190px;
    top: 60px;
}

/* ================================
   🟠 8) تفاصيل إضافية
================================ */
.s-product-card-sale-price span,
.store-footer h3,
.store-footer *,
.item-price,
.item-price + p {
    color: #7a5e17;
    border-width: 0 !important;
}

nav.breadcrumbs * {
    font-size: 17px;
}

.s-products-list-vertical-cards {
    row-gap: 3.5rem;
}

a.banner-entry.square-photos {
    height: 603px;
    background: transparent;
}

.s-user-menu-trigger {
    padding-bottom: 6px;
    background: transparent;
}

/* ================================
   📱 9) الموبايل
================================ */
@media (max-width: 600px) {

    section.s-block.s-block--fixed-banner:nth-of-type(1) .container {
        margin-top: -29px;
    }

    .s-cart-summary-total,
    .store-footer__inner::after {
        display: none !important;
    }

    section.sticky-product-bar {
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    .s-product-card-content-footer {
        margin-bottom: -28px;
    }

    .product-single footer.store-footer {
        padding-bottom: 40px;
    }

    .store-footer__inner .container {
        display: flex;
        flex-direction: column;
    }

    .s-search-container.s-search-inline {
        padding-left: 10px;
    }

    a.banner-entry.square-photos {
        height: 93vw !important;
    }

    button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center {
        padding: 3px 5px;
        font-size: 11px;
    }

    button.s-button-element.s-button-btn.s-button-outline .sicon-shopping-bag:before {
        display: none;
    }
}
تريد أرتّب لك نسخة أخف + أسرع؟
أقدر أضغط الأكواد، أختصرها، أو أعدل الألوان والستايل حسب الهوية الي تبيها.

بس قلّي:
وش اسم المتجر + الهوية اللونية الأساسية؟



ّلم يتمّ اختيار أيّ ملفّّلم يتمّ اختيار أيّ ملفّ
يمكن أن تصدر عن ChatGPT بعض الأخطاء. لذلك يجب التحقق من المعلومات المهمة.