From de296b633ff6b1c994880adb2c06bb02de6a406d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Marek=20=C4=BDach?= Date: Mon, 8 Apr 2019 22:48:15 +0200 Subject: [PATCH] Standard smallest screen is 600px (#520) For devices that have a screen size so small they have to use the `max-width` property in CSS, the standard of a screen-size that has to be used here is `phones 600px and smaller`, not `900px`, which would have to use the `min-width` property instead, that would mean a widescreen size, because `min-width` means `a screen size of 900px, or more`, including desktops. --- static/css/_header.scss | 2 +- static/css/main.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/static/css/_header.scss b/static/css/_header.scss index 35368e88..60c760ce 100644 --- a/static/css/_header.scss +++ b/static/css/_header.scss @@ -88,7 +88,7 @@ header { } // Only enable label animations on normal screens -@media screen and (min-width: 900px) { +@media screen and (min-width: 600px) { header nav a { i { transition: all 0.2s ease; diff --git a/static/css/main.scss b/static/css/main.scss index d2b0de4f..d5aece65 100644 --- a/static/css/main.scss +++ b/static/css/main.scss @@ -18,7 +18,7 @@ html { @import 'forms'; /// Small screens -@media screen and (max-width: 900px) { +@media screen and (max-width: 600px) { @keyframes menuOpening { from { transform: scaleX(0);