Merge pull request #2608 from ClearlyClaire/glitch-soc/refactor/monol…

…ithic-components-css Merge SCSS in a single `components.scss` file
glitch-soc · Feb 12, 2024 · 084d051 · 084d051
2 parents 8c76a20 + c249c10
commit 084d051
Show file tree

Hide file tree

Showing 35 changed files with 9,979 additions and 10,440 deletions.
diff --git a/app/javascript/flavours/glitch/features/compose/components/autosuggest_account.jsx b/app/javascript/flavours/glitch/features/compose/components/autosuggest_account.jsx
@@ -15,7 +15,7 @@ export default class AutosuggestAccount extends ImmutablePureComponent {
 
     return (
       <div className='autosuggest-account' title={account.get('acct')}>
-        <div className='autosuggest-account-icon'><Avatar account={account} size={24} /></div>
+        <div className='autosuggest-account-icon'><Avatar account={account} size={18} /></div>
         <DisplayName account={account} inline />
       </div>
     );

diff --git a/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx b/app/javascript/flavours/glitch/features/compose/components/compose_form.jsx
@@ -70,7 +70,6 @@ class ComposeForm extends ImmutablePureComponent {
     singleColumn: PropTypes.bool,
     lang: PropTypes.string,
     advancedOptions: ImmutablePropTypes.map,
-    layout: PropTypes.string,
     media: ImmutablePropTypes.list,
     sideArm: PropTypes.string,
     sensitive: PropTypes.bool,
@@ -259,7 +258,6 @@ class ComposeForm extends ImmutablePureComponent {
       intl,
       advancedOptions,
       isSubmitting,
-      layout,
       onChangeSpoilerness,
       onPaste,
       privacy,
@@ -313,7 +311,7 @@ class ComposeForm extends ImmutablePureComponent {
             onSuggestionsClearRequested={this.onSuggestionsClearRequested}
             onSuggestionSelected={this.onSuggestionSelected}
             onPaste={onPaste}
-            autoFocus={!showSearch && !isMobile(window.innerWidth, layout)}
+            autoFocus={!showSearch && !isMobile(window.innerWidth)}
             lang={this.props.lang}
           >
             <TextareaIcons advancedOptions={advancedOptions} />

diff --git a/app/javascript/flavours/glitch/features/compose/components/navigation_bar.jsx b/app/javascript/flavours/glitch/features/compose/components/navigation_bar.jsx
@@ -38,8 +38,8 @@ export default class NavigationBar extends ImmutablePureComponent {
 
           { profileLink !== undefined && (
             <a
-              className='edit'
               href={profileLink}
+              className='navigation-bar__profile-edit'
             ><FormattedMessage id='navigation_bar.edit_profile' defaultMessage='Edit profile' /></a>
           )}
         </div>

diff --git a/app/javascript/flavours/glitch/features/compose/components/search_results.jsx b/app/javascript/flavours/glitch/features/compose/components/search_results.jsx
@@ -76,7 +76,7 @@ class SearchResults extends ImmutablePureComponent {
 
 
     return (
-      <div className='drawer--results'>
+      <div className='search-results'>
         <header className='search-results__header'>
           <Icon id='search' icon={SearchIcon} />
           <FormattedMessage id='explore.search_results' defaultMessage='Search results' />

diff --git a/app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js b/app/javascript/flavours/glitch/features/compose/containers/compose_form_container.js
@@ -71,7 +71,6 @@ const mapStateToProps = state => ({
   isInReply: state.getIn(['compose', 'in_reply_to']) !== null,
   lang: state.getIn(['compose', 'language']),
   advancedOptions: state.getIn(['compose', 'advanced_options']),
-  layout: state.getIn(['local_settings', 'layout']),
   media: state.getIn(['compose', 'media_attachments']),
   sideArm: sideArmPrivacy(state),
   sensitive: state.getIn(['compose', 'sensitive']),

diff --git a/app/javascript/flavours/glitch/features/ui/index.jsx b/app/javascript/flavours/glitch/features/ui/index.jsx
@@ -602,18 +602,7 @@ class UI extends PureComponent {
     const { draggingOver } = this.state;
     const { children, isWide, location, dropdownMenuIsOpen, layout, moved } = this.props;
 
-    const columnsClass = layout => {
-      switch (layout) {
-      case 'single':
-        return 'single-column';
-      case 'multiple':
-        return 'multi-columns';
-      default:
-        return 'auto-columns';
-      }
-    };
-
-    const className = classNames('ui', columnsClass(layout), {
+    const className = classNames('ui', {
       'wide': isWide,
       'system-font': this.props.systemFontUi,
       'hicolor-privacy-icons': this.props.hicolorPrivacyIcons,

diff --git a/app/javascript/flavours/glitch/reducers/meta.js b/app/javascript/flavours/glitch/reducers/meta.js
@@ -14,9 +14,7 @@ const initialState = ImmutableMap({
 export default function meta(state = initialState, action) {
   switch(action.type) {
   case STORE_HYDRATE:
-    return state.merge(action.state.get('meta'))
-      .set('permissions', action.state.getIn(['role', 'permissions']))
-      .set('layout', layoutFromWindow(action.state.getIn(['local_settings', 'layout'])));
+    return state.merge(action.state.get('meta')).set('permissions', action.state.getIn(['role', 'permissions']));
   case changeLayout.type:
     return state.set('layout', action.payload.layout);
   default:

diff --git a/app/javascript/flavours/glitch/styles/_mixins.scss b/app/javascript/flavours/glitch/styles/_mixins.scss
@@ -10,37 +10,6 @@
   background-size: $size $size;
 }
 
-@mixin single-column($media, $parent: '&') {
-  .auto-columns #{$parent} {
-    @media #{$media} {
-      @content;
-    }
-  }
-  .single-column #{$parent} {
-    @content;
-  }
-}
-
-@mixin limited-single-column($media, $parent: '&') {
-  .auto-columns #{$parent},
-  .single-column #{$parent} {
-    @media #{$media} {
-      @content;
-    }
-  }
-}
-
-@mixin multi-columns($media, $parent: '&') {
-  .auto-columns #{$parent} {
-    @media #{$media} {
-      @content;
-    }
-  }
-  .multi-columns #{$parent} {
-    @content;
-  }
-}
-
 @mixin fullwidth-gallery {
   &.full-width {
     margin-left: -14px;