revert "Add toggle to switch between "Classic" post mode and "Chostlike" post mode (#1) "

src/components/conversation/conversation.js

@@ -82,9 +82,6 @@ const conversation = {
     streamingEnabled () {
       return this.mergedConfig.useStreamingApi && this.mastoUserSocketStatus === WSConnectionStatus.JOINED
     },
-    timelineStyle () {
-      return this.$store.getters.mergedConfig.timelineStyle
-    },
     displayStyle () {
       return this.$store.getters.mergedConfig.conversationDisplay
     },

src/components/conversation/conversation.vue

@@ -69,7 +69,6 @@
               :in-profile="inProfile"
               :profile-user-id="profileUserId"
               class="conversation-status status-fadein panel-body"
-              :class="timelineStyle"
 
               :simple-tree="treeViewIsSimple"
               :toggle-thread-display="toggleThreadDisplay"
@@ -174,7 +173,6 @@
           :in-profile="inProfile"
           :profile-user-id="profileUserId"
           class="conversation-status status-fadein panel-body"
-          :class="timelineStyle"
 
           :toggle-thread-display="toggleThreadDisplay"
           :thread-display-status="threadDisplayStatus"
@@ -245,7 +243,7 @@
     padding: var(--status-margin, $status-margin);
   }
 
-  .conversation-status.classic {
+  .conversation-status {
     border-bottom-width: 1px;
     border-bottom-style: solid;
     border-bottom-color: var(--border, $fallback--border);

src/components/emoji_reactions/emoji_reactions.js

@@ -39,9 +39,6 @@ const EmojiReactions = {
         return acc
       }, {})
     },
-    timelineStyle () {
-      return this.$store.getters.mergedConfig.timelineStyle
-    },
     loggedIn () {
       return !!this.$store.state.users.currentUser
     },

src/components/emoji_reactions/emoji_reactions.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="emoji-reactions" :class="timelineStyle">
+  <div class="emoji-reactions">
     <UserListPopover
       v-for="(reaction) in filteredReactions"
       :key="reaction.url || reaction.name"
@@ -47,19 +47,8 @@
 @import '../../_variables.scss';
 
 .emoji-reactions {
-  &.classic {
-    margin-top: 0.25em;
-  }
-
-  &.chostlike {
-    padding-left: 10px;
-    padding-right: 10px;
-    padding-bottom: .5em;
-    background: var(--bg);
-    border-bottom: 1px solid var(--faint);
-  }
-
   display: flex;
+  margin-top: 0.25em;
   flex-wrap: wrap;
   container-type: inline-size;
 }
@@ -111,7 +100,6 @@
   border: 1px solid var(--accent, $fallback--link);
   margin-left: -1px; // offset the border, can't use inset shadows either
   margin-right: calc(0.5em - 1px);
-  box-shadow: 0 0 4px 4px rgba(255,255,255,.5) inset;
 }
 
 </style>

src/components/notification/notification.js

@@ -150,9 +150,6 @@ const Notification = {
     user () {
       return this.$store.getters.findUser(this.notification.from_profile.id)
     },
-    timelineStyle () {
-      return this.$store.getters.mergedConfig.timelineStyle
-    },
     userProfileLink () {
       return this.generateUserProfileLink(this.user)
     },

src/components/notification/notification.vue

@@ -2,7 +2,6 @@
   <Status
     v-if="notification.type === 'mention'"
     class="Notification"
-    :class="timelineStyle"
     :compact="true"
     :statusoid="notification.status"
   />

src/components/popover/popover.vue

@@ -40,7 +40,6 @@
   z-index: 500;
   position: absolute;
   min-width: 0;
-  filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.6));
 }
 
 .popover-default {
@@ -54,6 +53,8 @@
     left: 0;
     right: 0;
     z-index: 3;
+    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6);
+    box-shadow: var(--panelShadow);
     pointer-events: none;
   }
 

src/components/quote_card/quote_card.js

@@ -14,10 +14,7 @@ const QuoteCard = {
   computed: {
     ...mapGetters([
       'mergedConfig'
-    ]),
+    ])
-    timelineStyle () {
-      return this.$store.getters.mergedConfig.timelineStyle
-    },
   },
   components: {
     QuoteCardContent

src/components/quote_card/quote_card.vue

@@ -2,7 +2,6 @@
   <div>
     <router-link
       class="quote-card"
-      :class="timelineStyle"
       :to="{ name: 'conversation', params: { id: status.id } }"
     >
       <QuoteCardContent
@@ -24,10 +23,6 @@
   overflow: hidden;
   margin-top: 0.5em;
 
-  &.chostian .right-side {
-    background: linear-gradient(180deg, var(--selectedPost, $fallback--lightBg) 0%, var(--selectedPost, $fallback--lightBg) 75%, var(--bg) 75%, var(--bg) 100%) !important;
-  }
-
   .card-image {
     flex-shrink: 0;
     width: 120px;
@@ -69,14 +64,11 @@
 
   color: $fallback--text;
   color: var(--text, $fallback--text);
-
+  border-style: solid;
-  &.classic {
+  border-width: 1px;
-    border-style: solid;
+  border-radius: $fallback--attachmentRadius;
-    border-width: 1px;
+  border-radius: var(--attachmentRadius, $fallback--attachmentRadius);
-    border-radius: $fallback--attachmentRadius;
+  border-color: $fallback--border;
-    border-radius: var(--attachmentRadius, $fallback--attachmentRadius);
+  border-color: var(--border, $fallback--border);
-    border-color: $fallback--border;
-    border-color: var(--border, $fallback--border);
-  }
 }
 </style>

src/components/settings_modal/tabs/general_tab.js

@@ -55,11 +55,6 @@ const GeneralTab = {
         value: tab,
         label: this.$t(`user_card.${tab}`)
       })),
-      timelineStyleOptions: ['classic', 'chostlike'].map(mode => ({
-        key: mode,
-        value: mode,
-        label: this.$t(`settings.timeline_${mode}`)
-      })),
       profilesExpanded: false,
       newProfileName: '',
       loopSilentAvailable:

src/components/settings_modal/tabs/general_tab.vue

@@ -104,15 +104,6 @@
     <div class="setting-item">
       <h2>{{ $t('settings.interface') }}</h2>
       <ul class="setting-list">
-        <li>
-          <ChoiceSetting
-            id="timelineStyle"
-            path="timelineStyle"
-            :options="timelineStyleOptions"
-          >
-            {{ $t('settings.timeline_style_choice') }}
-          </ChoiceSetting>
-        </li>
         <li v-if="instanceSpecificPanelPresent">
           <BooleanSetting path="hideISP">
             {{ $t('settings.hide_isp') }}

src/components/status/status.scss

@@ -38,72 +38,9 @@
     }
   }
 
-  &.classic .status-container {
-    padding: var(--status-margin, $status-margin);
-  }
-  
-  &.classic .status-heading {
-      margin-bottom: 0.5em;
-  }
-
-  &.classic .replies {
-      margin-top: 0.25em;
-  }
-
-  &.chostlike .status-container {
-    padding: calc(10px + var(--status-margin, 0.75em)) var(--status-margin, 0.75em);
-
-    .content {
-      padding-bottom: .5em;
-      padding-top: 1em;
-      padding-left: 10px;
-      padding-right: 10px;
-      background: var(--bg);
-    }
-
-    .right-side {
-      background-color: var(--selectedPost);
-      border-radius: 10px;
-      padding: 10px 0 10px 0;
-      box-shadow: #000c 0px 0px 10px;
-    }
-
-    .status-heading {
-      border-bottom: 1px solid var(--faint);
-      padding: .3em 1em .7em 1em;
-    }
-
-    .replies {
-      padding-top: 0.25em;
-      padding-left: 10px;
-      padding-right: 10px;
-      background: var(--bg);
-    }
-
-    &.repeat-info {
-      padding-top: calc(10px + var(--status-margin, 0.75em));
-      padding-bottom: 0px;
-  
-      .right-side {
-        border-radius: 10px 10px 0 0;
-        padding-left: 10px;
-        padding-right: 10px;
-        border-bottom: 1px solid #0003;
-      }
-    }
-
-    &.repeat-info + .status-container .right-side {
-      border-radius: 0px 0px 10px 10px;
-    }
-
-    .status-actions {
-      padding-left: 10px;
-      padding-right: 10px;
-    }
-  }
-
   .status-container {
     display: flex;
+    padding: var(--status-margin, $status-margin);
 
     .content {
       overflow: hidden;
@@ -167,7 +104,7 @@
   }
 
   .status-heading {
-    
+    margin-bottom: 0.5em;
 
     .emoji {
       --emoji-size: 16px;
@@ -307,6 +244,7 @@
   }
 
   .replies {
+    margin-top: 0.25em;
     line-height: 1.3;
     font-size: 0.85em;
     display: flex;

src/components/thread_tree/thread_tree.js

@@ -58,9 +58,6 @@ const ThreadTree = {
         return table
       }, {})
     },
-    timelineStyle () {
-      return this.$store.getters.mergedConfig.timelineStyle
-    },
     currentReplies () {
       return this.getReplies(this.status.id).map(({ id }) => this.statusById(id))
     },

src/components/thread_tree/thread_tree.vue

@@ -14,7 +14,6 @@
       :in-profile="inProfile"
       :profile-user-id="profileUserId"
       class="conversation-status conversation-status-treeview status-fadein panel-body"
-      :class="timelineStyle"
 
       :simple-tree="simple"
       :controlled-thread-display-status="threadDisplayStatus[status.id]"

src/i18n/en.json

@@ -957,9 +957,6 @@
         "third_column_mode_none": "Don't show third column at all",
         "third_column_mode_notifications": "Notifications column",
         "third_column_mode_postform": "Main post form and navigation",
-        "timeline_classic": "Classic",
-        "timeline_chostlike": "Chostlike",
-        "timeline_style_choice": "Timeline post style",
         "token": "Token",
         "tooltipRadius": "Tooltips/alerts",
         "translation_language": "Automatic Translation Language",

src/modules/config.js

@@ -142,7 +142,6 @@ export const defaultState = {
   postLanguage: undefined, // instance default,
   supportedTranslationLanguages: {}, // instance default
   userProfileDefaultTab: 'statuses',
-  timelineStyle: 'classic',
   useBlurhash: true,
 }