Chúng tôi giới thiệu khái niệm @mediatruy vấn trong CSS.
Rất nhiều những gì sử dụng Sass trong dự án này cho phép chúng tôi làm là luôn KHÔ (đừng lặp lại chính mình). Chúng tôi đã thiết lập các biến màu và kích thước. Chúng tôi đã làm điều đó với ngăn xếp phông chữ của chúng tôi. Bây giờ chúng tôi đang làm điều đó một lần nữa với các truy vấn phương tiện. Bất cứ lúc nào chúng tôi cần truy vấn phương tiện, chúng tôi hiện có @mixin để có thể sử dụng. Bằng cách đó, nếu chúng ta cần điều chỉnh chúng, chúng ta có thể thay đổi chúng chỉ ở một nơi.
Thay vì đặt tên cho các truy vấn phương tiện của chúng tôi như “iPad” hoặc bất kỳ thứ gì quá cụ thể như vậy, chúng tôi sẽ chỉ sử dụng một số tên tùy ý nhưng dễ hiểu như “Gấu con” và “Gấu Papa”.
Chúng tôi bắt đầu với một màn hình rộng, sau đó thu hẹp nó cho đến khi điều hướng có vẻ tệ và đó là ngắt truy vấn phương tiện đầu tiên của chúng tôi. Tại thời điểm đó, chúng tôi chia điều hướng thành hai hàng bốn thay vì một hàng tám. Chúng ta phải điều chỉnh bóng đổ để nó trông đúng.
Chúng tôi cũng điều chỉnh độ rộng của cuộn trang ở một số truy vấn phương tiện nhất định, có nghĩa là chúng tôi cũng cần điều chỉnh cách biểu trưng hoạt động.
