diff --git a/scripts/client/public/css/pages/detailProduct.css b/scripts/client/public/css/pages/detailProduct.css index 8b0bb44216730805622246cb44ba1fffe59ecb51..b9009470761d25f7738c72ec0663b6d313f814d1 100644 --- a/scripts/client/public/css/pages/detailProduct.css +++ b/scripts/client/public/css/pages/detailProduct.css @@ -11,6 +11,47 @@ column-gap: 4%; } +@media only screen and (max-width: 920px) { + .detailContainer { + display: flex; + width: 100%; + flex-direction: column; + column-gap: 4%; + } + + .detailImage { + width: 90% !important; + margin-bottom: 2rem; + } + + #productImage { + width: 100% !important; + } + + .productInfo { + width: 100% !important; + margin-bottom: 2rem; + } +} + +@media only screen and (max-width: 480px) { + #productName { + font-size: 3rem !important; + margin-bottom: 0.1rem; + } +} + +@media only screen and (max-width: 400px) { + #productName { + font-size: 2.5rem !important; + margin-bottom: 0.1rem; + } + + #productPrice { + font-size: 1.25rem !important; + } +} + .detailImage { width: 38%; border-radius: 2rem;