docs: updated screenshots + feature list

README.md

@@ -31,7 +31,7 @@
 </p>
 
 <div align="center">
-  <a href="https://hoppscotch.io"><img src="https://raw.githubusercontent.com/hoppscotch/hoppscotch/main/static/images/screenshot1.png" alt="Screenshot1" width="100%"></a>
+  <a href="https://hoppscotch.io"><img src="https://raw.githubusercontent.com/hoppscotch/hoppscotch/main/static/images/screenshots/banner_dark.png" alt="Screenshot" width="100%"></a>
 </div>
 
 #### **Contact**
@@ -108,9 +108,12 @@
 
 - Choose theme: System, Light, Dark (default) and Black
 - Choose accent color: Blue, Green (default), Teal, Purple, Orange, Pink, Red, and Yellow
-- Toggle multi-colored headings
 - Toggle auto-scroll to response
 
+<p>
+  <a href="https://hoppscotch.io"><img src="https://raw.githubusercontent.com/hoppscotch/hoppscotch/main/static/images/screenshots/banner_light.png" alt="Screenshot" width="100%"></a>
+</p>
+
 ---
 
 </details>
@@ -553,20 +556,6 @@ Become a financial contributor and help us sustain our community [[Support](#sup
 	alt="Rithish"
 />
 </a>
-<a href="https://github.com/scmmishra" target="_blank" rel="noopener">
-<img
-  width="64"
-	src="https://github.com/scmmishra.png?size=64"
-	alt="Shivam Mishra"
-/>
-</a>
-<a href="https://github.com/pantharshit00" target="_blank" rel="noopener">
-<img
-  width="64"
-	src="https://github.com/pantharshit00.png?size=64"
-	alt="Harshit Pant"
-/>
-</a>
 <a href="https://github.com/ankumar" target="_blank" rel="noopener">
 <img
   width="64"

components/app/Section.vue

@@ -1,5 +1,5 @@
 <template>
-  <fieldset :id="label.toLowerCase()" :class="{ 'no-colored-frames': !frameColorsEnabled }">
+  <fieldset :id="label.toLowerCase()">
     <legend v-if="!noLegend" @click.prevent="collapse">
       <span>{{ label }}</span>
       <i class="ml-2 align-middle material-icons">
@@ -30,51 +30,12 @@ fieldset {
     @apply ease-in-out;
     @apply duration-150;
   }
-
-  &.blue legend {
-    @apply text-blue-400;
-  }
-
-  &.green legend {
-    @apply text-green-400;
-  }
-
-  &.teal legend {
-    @apply text-teal-400;
-  }
-
-  &.purple legend {
-    @apply text-purple-400;
-  }
-
-  &.orange legend {
-    @apply text-orange-400;
-  }
-
-  &.pink legend {
-    @apply text-pink-400;
-  }
-
-  &.red legend {
-    @apply text-red-400;
-  }
-
-  &.yellow legend {
-    @apply text-yellow-400;
-  }
-}
-
-fieldset.no-colored-frames legend {
-  @apply text-fgColor;
 }
 </style>
 
 <script>
 export default {
   computed: {
-    frameColorsEnabled() {
-      return this.$store.state.postwoman.settings.FRAME_COLORS_ENABLED || false
-    },
     sectionString() {
       return `${this.$route.path.replace(/\/+$/, "")}/${this.label}`
     },

lang/bn-BD.json

@@ -80,7 +80,6 @@
   "background": "পটভূমি",
   "color": "রং",
   "labels": "লেবেলসমূহ",
-  "multi_color": "রং বৈচিত্র্য",
   "enabled": "কার্যকর",
   "disabled": "অকার্যকর",
   "proxy": "প্রক্সি",

lang/de-DE.json

@@ -74,7 +74,6 @@
   "background": "Hintergrund",
   "color": "Farbe",
   "labels": "Bezeichner",
-  "multi_color": "Mehrfarbig",
   "enabled": "Aktiviert",
   "disabled": "Deaktiviert",
   "proxy": "Proxy",

lang/en-US.json

@@ -79,7 +79,6 @@
   "background": "Background",
   "color": "Color",
   "labels": "Labels",
-  "multi_color": "Multi-color",
   "enabled": "Enabled",
   "disabled": "Disabled",
   "proxy": "Proxy",

lang/es-ES.json

@@ -72,7 +72,6 @@
   "background": "Fondo",
   "color": "Color",
   "labels": "Etiquetas",
-  "multi_color": "Multicolor",
   "enabled": "Habilitado",
   "disabled": "Deshabilitado",
   "proxy": "Proxy",

lang/fa-IR.json

@@ -74,7 +74,6 @@
   "background": "پس زمینه",
   "color": "رنگ",
   "labels": "برچسب‌ها",
-  "multi_color": "چند رنگی",
   "enabled": "فعال",
   "disabled": "غیر فعال",
   "proxy": "پراکسی",

lang/fr-FR.json

@@ -74,7 +74,6 @@
   "background": "Arrière-plan",
   "color": "Couleur",
   "labels": "Libellés",
-  "multi_color": "Multi-couleurs",
   "enabled": "Activé",
   "disabled": "Désactivé",
   "proxy": "Proxy",

lang/id-ID.json

@@ -79,7 +79,6 @@
   "background": "Latar belakang",
   "color": "Warna",
   "labels": "Label",
-  "multi_color": "Warna beragam",
   "enabled": "Nyala",
   "disabled": "Mati",
   "proxy": "Proksi",

lang/ja-JP.json

@@ -74,7 +74,6 @@
   "background": "背景",
   "color": "色",
   "labels": "ラベル",
-  "multi_color": "マルチカラー",
   "enabled": "有効",
   "disabled": "無効",
   "proxy": "プロキシ",

lang/ko-KR.json

@@ -80,7 +80,6 @@
   "background": "배경",
   "color": "색상",
   "labels": "라벨",
-  "multi_color": "멀티 컬러",
   "enabled": "허용",
   "disabled": "허용안함",
   "proxy": "프록시",

lang/ml-ML.json

@@ -80,7 +80,6 @@
   "background": "പശ്ചാത്തലം",
   "color": "നിറം",
   "labels": "ലേബലുകൾ",
-  "multi_color": "മൾട്ടി-കളർ",
   "enabled": "പ്രവർത്തനക്ഷമമാക്കി",
   "disabled": "അപ്രാപ്‌തമാക്കി",
   "proxy": "പ്രോക്സി",

lang/nl-BE.json

@@ -80,7 +80,6 @@
   "background": "Achtergrond",
   "color": "Kleur",
   "labels": "Labels",
-  "multi_color": "Meerkleurig",
   "enabled": "Ingeschakeld",
   "disabled": "Uitgeschakeld",
   "proxy": "Proxy",

lang/pt-BR.json

@@ -74,7 +74,6 @@
   "background": "Fundo",
   "color": "Cor",
   "labels": "Labels",
-  "multi_color": "Multi cor",
   "enabled": "Ativado",
   "disabled": "Desativado",
   "proxy": "Proxy",

lang/pt-PT.json

@@ -82,7 +82,6 @@
   "background": "Fundo",
   "color": "Cor",
   "labels": "Labels",
-  "multi_color": "Multi cor",
   "enabled": "Ativado",
   "disabled": "Desativado",
   "proxy": "Proxy",

lang/tr-TR.json

@@ -80,7 +80,6 @@
   "background": "Arka Plan",
   "color": "Renk",
   "labels": "Etiketler",
-  "multi_color": "Çoklu renk",
   "enabled": "Aktif",
   "disabled": "Pasif",
   "proxy": "Proxy",

lang/vi-VN.json

@@ -80,7 +80,6 @@
   "background": "Nền",
   "color": "Màu",
   "labels": "Các nhãn",
-  "multi_color": "Nhiều màu",
   "enabled": "Đã bật",
   "disabled": "Đã tắt",
   "proxy": "Proxy",

lang/zh-CN.json

@@ -84,7 +84,6 @@
   "background": "背景",
   "color": "颜色",
   "labels": "标签",
-  "multi_color": "彩色",
   "enabled": "已启用",
   "disabled": "已禁用",
   "proxy": "代理",

lang/zh-TW.json

@@ -80,7 +80,6 @@
   "background": "背景",
   "color": "顏色",
   "labels": "標籤",
-  "multi_color": "多個顏色",
   "enabled": "啟用",
   "disabled": "停用",
   "proxy": "代理伺服器",

pages/settings.vue

@@ -55,15 +55,6 @@
         <label>{{ $t("theme") }}</label>
         <SmartColorModePicker />
         <SmartAccentModePicker />
-        <span>
-          <SmartToggle
-            :on="settings.FRAME_COLORS_ENABLED"
-            @change="toggleSetting('FRAME_COLORS_ENABLED')"
-          >
-            {{ $t("multi_color") }}
-            {{ settings.FRAME_COLORS_ENABLED ? $t("enabled") : $t("disabled") }}
-          </SmartToggle>
-        </span>
         <span>
           <SmartToggle
             :on="settings.SCROLL_INTO_ENABLED"
@@ -203,7 +194,6 @@ export default {
             ? this.$store.state.postwoman.settings.SCROLL_INTO_ENABLED
             : true,
 
-        FRAME_COLORS_ENABLED: this.$store.state.postwoman.settings.FRAME_COLORS_ENABLED || false,
         PROXY_ENABLED: this.$store.state.postwoman.settings.PROXY_ENABLED || false,
         PROXY_URL:
           this.$store.state.postwoman.settings.PROXY_URL ||

store/postwoman.js

@@ -7,13 +7,6 @@ export const SETTINGS_KEYS = [
    */
   "SCROLL_INTO_ENABLED",
 
-  /**
-   * Normally, section frames are multicolored in the UI
-   * to emphasise the different sections.
-   * This setting allows that to be turned off.
-   */
-  "FRAME_COLORS_ENABLED",
-
   /**
    * Whether or not requests should be proxied.
    */
@@ -23,6 +16,7 @@ export const SETTINGS_KEYS = [
    * The URL of the proxy to connect to for requests.
    */
   "PROXY_URL",
+
   /**
    * The security key of the proxy.
    */