From 4fad0b33eb9d9b31cffa373fe6f284985bbce605 Mon Sep 17 00:00:00 2001
From: carson chang <37538241+carsick@users.noreply.github.com>
Date: Fri, 10 May 2024 00:16:24 +0800
Subject: [PATCH] UX: Use breakpoint CSS variable instead of arbitrary 570px
 (#26945)

* Update header.scss

* Update discourse.scss
---
 app/assets/stylesheets/desktop/discourse.scss | 2 +-
 app/assets/stylesheets/desktop/header.scss    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/assets/stylesheets/desktop/discourse.scss b/app/assets/stylesheets/desktop/discourse.scss
index c6498ffd4a9..3d6e860d5d1 100644
--- a/app/assets/stylesheets/desktop/discourse.scss
+++ b/app/assets/stylesheets/desktop/discourse.scss
@@ -142,7 +142,7 @@ select {
 }
 
 // Media Queries
-@media all and (max-width: 570px) {
+@include breakpoint(mobile-extra-large) {
   body {
     min-width: 0;
   }
diff --git a/app/assets/stylesheets/desktop/header.scss b/app/assets/stylesheets/desktop/header.scss
index a9754ed3cd5..3a6baa2cf04 100644
--- a/app/assets/stylesheets/desktop/header.scss
+++ b/app/assets/stylesheets/desktop/header.scss
@@ -16,7 +16,7 @@
   }
 }
 
-@media all and (max-width: 570px) {
+@include breakpoint(mobile-extra-large) {
   .extra-info-wrapper {
     display: none;
   }