add Header for cart page

This commit is contained in:
2025-10-06 01:45:23 +03:00
parent b385d40913
commit 7dd0857ea3
9 changed files with 162 additions and 337 deletions

View File

@@ -54,7 +54,7 @@
}
@media (min-width: 1025px) {
.menuSections{
.menuSections {
padding: 0;
}
@@ -630,28 +630,6 @@
}
}
/* Skeleton Loading Styles */
.skeletonContainer {
animation: skeletonPulse 1.5s ease-in-out infinite;
}
.skeletonContainer .ant-skeleton {
transition: all 0.3s ease;
}
.skeletonContainer .ant-skeleton-image {
border-radius: 8px;
overflow: hidden;
}
.skeletonContainer .ant-skeleton-input {
border-radius: 6px;
}
.skeletonContainer .ant-skeleton-button {
border-radius: 20px;
}
@keyframes skeletonPulse {
0% {
opacity: 1;
@@ -673,72 +651,6 @@
}
}
.skeletonContainer .ant-skeleton-active .ant-skeleton-input,
.skeletonContainer .ant-skeleton-active .ant-skeleton-image,
.skeletonContainer .ant-skeleton-active .ant-skeleton-button {
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200px 100%;
animation: skeletonShimmer 1.5s infinite;
}
/* Mobile-specific skeleton styles */
@media (max-width: 768px) {
.skeletonContainer .ant-skeleton {
margin-bottom: 12px;
}
.skeletonContainer .ant-skeleton-image {
border-radius: 4px;
}
.skeletonContainer .ant-skeleton-input {
border-radius: 4px;
}
.skeletonContainer .ant-skeleton-button {
border-radius: 16px;
}
}
/* Dark theme skeleton styles */
:global(.darkApp) .skeletonContainer .ant-skeleton-active .ant-skeleton-input,
:global(.darkApp) .skeletonContainer .ant-skeleton-active .ant-skeleton-image,
:global(.darkApp) .skeletonContainer .ant-skeleton-active .ant-skeleton-button {
background: linear-gradient(90deg, #181818 25%, #363636 50%, #181818 75%);
background-size: 200px 100%;
animation: skeletonShimmer 1.5s infinite;
}
:global(.darkApp) .skeletonContainer .ant-skeleton-input,
:global(.darkApp) .skeletonContainer .ant-skeleton-image,
:global(.darkApp) .skeletonContainer .ant-skeleton-button {
background-color: #181818;
border-color: #363636;
}
/* Tablet-specific skeleton styles */
@media (min-width: 769px) and (max-width: 1024px) {
.skeletonContainer {
padding: 24px;
}
.skeletonContainer .ant-skeleton {
margin-bottom: 16px;
}
.skeletonContainer .ant-skeleton-image {
border-radius: 6px;
}
.skeletonContainer .ant-skeleton-input {
border-radius: 5px;
}
.skeletonContainer .ant-skeleton-button {
border-radius: 18px;
}
}
.menuItemsGridSticky {
height: 60;
}