From 38744a4e51fd4f4dea1eb627e20d3d4a6d0f2070 Mon Sep 17 00:00:00 2001 From: Claire Date: Mon, 23 Sep 2024 14:53:35 +0200 Subject: [PATCH] [Glitch] Change mobile breakpoint back to old version and allow main column to shrink Port b5bdc69f7ba75852e6de651d2cd16e1e8897823f to glitch-soc Signed-off-by: Claire --- .../flavours/glitch/features/ui/components/columns_area.jsx | 2 +- app/javascript/flavours/glitch/styles/components.scss | 2 +- app/javascript/flavours/glitch/styles/variables.scss | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx index 9471104b97..c70c8183b9 100644 --- a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx @@ -63,7 +63,7 @@ export default class ColumnsArea extends ImmutablePureComponent { }; // Corresponds to (max-width: $no-gap-breakpoint - 1px) in SCSS - mediaQuery = 'matchMedia' in window && window.matchMedia('(max-width: 1206px)'); + mediaQuery = 'matchMedia' in window && window.matchMedia('(max-width: 1174px)'); state = { renderComposePanel: !(this.mediaQuery && this.mediaQuery.matches), diff --git a/app/javascript/flavours/glitch/styles/components.scss b/app/javascript/flavours/glitch/styles/components.scss index 6ee86f5ee0..6eefa81661 100644 --- a/app/javascript/flavours/glitch/styles/components.scss +++ b/app/javascript/flavours/glitch/styles/components.scss @@ -2889,7 +2889,7 @@ a.account__display-name { &__main { box-sizing: border-box; width: 100%; - flex: 0 0 auto; + flex: 0 1 auto; display: flex; flex-direction: column; diff --git a/app/javascript/flavours/glitch/styles/variables.scss b/app/javascript/flavours/glitch/styles/variables.scss index 111034fc62..8dd2cd0cda 100644 --- a/app/javascript/flavours/glitch/styles/variables.scss +++ b/app/javascript/flavours/glitch/styles/variables.scss @@ -87,7 +87,7 @@ $media-modal-media-max-width: 100%; // put margins on top and bottom of image to avoid the screen covered by image. $media-modal-media-max-height: 80%; -$no-gap-breakpoint: 1207px; +$no-gap-breakpoint: 1175px; $mobile-breakpoint: 630px; $font-sans-serif: 'mastodon-font-sans-serif' !default;