Search Results

.rps-skeleton-container {

عرض: شبكة;

نصف قطر الحدود: 3px;

عرض أقصى: 1200px;

فجوة الشبكة: 30px;

هامش: 0 تلقائياً;

.rps-skeleton-results-page-header-wrapper {

عرض: شبكة;

ارتفاع: 73px;

خلفية: أبيض;

نموذج أعمدة الشبكة: 1fr محتوى أقصى;

فجوة الشبكة: 20px;

محاذاة العناصر: المركز;

نصف قطر الحدود: 3px;

حد: 1px صلب #e6e6e6;

padding: 10px 20px;

.rps-skeleton-filter-menu-container {

overflow: مخفي;

padding: 20px;

عرض: شبكة;

خلفية: أبيض;

فجوة الشبكة: 20px;

حد: 1px صلب #e8e8e8;

نصف قطر الحدود: 3px;

ارتفاع: محتوى أقصى;

.rps-skeleton-result-page-body-container {

عرض: شبكة;

فجوة الشبكة: 30px;

محاذاة العناصر: بداية مرنة;

نموذج أعمدة الشبكة: minmax(200px, 250px) 1fr;

.rps-skeleton-main-content-container {

عرض: شبكة;

فجوة الشبكة: 1px;

حد: 1px صلب #e6e6e6;

نصف قطر الحدود: 3px;

لون الخلفية: #e6e6e6;

نموذج أعمدة الشبكة: تكرار(3, 1fr);

.rps-skeleton-product-container {

خلفية: أبيض;

عرض: شبكة;

فجوة الشبكة: 10px;

ارتفاع: محتوى أقصى;

padding: 20px;

.rps-skeleton-product-container .rps-skeleton-product-image {

ارتفاع: 200px;

عرض: 100%;

هامش: 0 تلقائياً 10px;

نصف قطر الحدود: 5px;

لون الخلفية: #ccc;

صورة الخلفية: تدرج خطي(

90 درجة,

#F4F4F4 0px,

rgba(229, 229, 229, 0.8) 40px,

#F4F4F4 80px

حجم الخلفية: 600px;

تأثير: shine-rps-skeleton-product-image 2s لا نهائي ease-out;

.rps-skeleton-results-page-header-wrapper .rps-skeleton-line {

عرض أقصى: 200px;

.rps-skeleton-results-page-header-wrapper .rps-skeleton-line ~ .rps-skeleton-line {

عرض: 200px;

.rps-skeleton-line {

ارتفاع: 16px;

نصف قطر الحدود: 7px;

صورة الخلفية: تدرج خطي(

90 درجة,

#F4F4F4 0px,

rgba(229, 229, 229, 0.8) 40px,

#F4F4F4 80px

حجم الخلفية: 600px;

تأثير: shine-lines 2s لا نهائي ease-out;

.rps-skeleton-product-container .rps-skeleton-line ~ .rps-skeleton-line {

عرض: 100px;

@keyframes shine-lines {

موضع الخلفية: -100px;

موضع الخلفية: 140px;

@keyframes shine-rps-skeleton-product-image {

موضع الخلفية: -32px;

موضع الخلفية: 208px;

@media all and (max-width: 992px) {

.rps-skeleton-filter-menu-container {

عرض: لا شيء;

.rps-skeleton-result-page-body-container {

نموذج أعمدة الشبكة: 1fr;

@media all and (max-width: 768px) {

.rps-skeleton-main-content-container {

نموذج أعمدة الشبكة: تكرار(3, minmax(100px, 1fr));

@media all and (max-width: 576px) {

.rps-skeleton-main-content-container {

نموذج أعمدة الشبكة: تكرار(2, minmax(100px, 1fr));

@media all and (max-width: 400px) {

.rps-skeleton-main-content-container {

نموذج أعمدة الشبكة: 1fr;