cart: styles enhancements on different screen sizes
This commit is contained in:
@@ -66,12 +66,11 @@
|
||||
/* Tablet styles (769px - 1024px) */
|
||||
@media (min-width: 769px) and (max-width: 1024px) {
|
||||
.summaryRow {
|
||||
padding: 6px 0;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.summaryDivider {
|
||||
margin: 20px 0 !important;
|
||||
margin: 10px 0 !important;
|
||||
}
|
||||
|
||||
.totalRow {
|
||||
@@ -82,12 +81,11 @@
|
||||
/* Desktop styles (1025px+) */
|
||||
@media (min-width: 1025px) {
|
||||
.summaryRow {
|
||||
padding: 4px 0;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.summaryDivider {
|
||||
margin: 0 !important;
|
||||
margin: 10px 0 !important;
|
||||
}
|
||||
|
||||
.totalRow {
|
||||
@@ -101,29 +99,3 @@
|
||||
outline-offset: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Reduced motion preferences */
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
.orderSummary {
|
||||
animation: fadeInUp 0.8s ease-out;
|
||||
}
|
||||
}
|
||||
|
||||
/* Hover effects for devices that support hover */
|
||||
@media (hover: hover) {
|
||||
.orderSummary:hover {
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.menuItemImage:hover {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
|
||||
/* Print styles */
|
||||
@media print {
|
||||
.orderSummary {
|
||||
box-shadow: none !important;
|
||||
border: 1px solid #ccc !important;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user