feat: vertical and horizontal layout support

2021-09-20 10:17:31 +05:30
parent 49741875bd
commit dcbb17b164
13 changed files with 72 additions and 14 deletions
--- a/packages/hoppscotch-app/pages/graphql.vue
+++ b/packages/hoppscotch-app/pages/graphql.vue
@@ -5,7 +5,11 @@
    :horizontal="!(windowInnerWidth.x.value >= 768)"
  >
    <Pane class="hide-scrollbar !overflow-auto">
-      <Splitpanes class="smart-splitter" :dbl-click-splitter="false" horizontal>
+      <Splitpanes
+        class="smart-splitter"
+        :dbl-click-splitter="false"
+        :horizontal="COLUMN_LAYOUT"
+      >
        <Pane class="hide-scrollbar !overflow-auto">
          <GraphqlRequest :conn="gqlConn" />
          <GraphqlRequestOptions :conn="gqlConn" />
@@ -59,6 +63,7 @@ export default defineComponent({
    return {
      windowInnerWidth: useWindowSize(),
      RIGHT_SIDEBAR: useSetting("RIGHT_SIDEBAR"),
+      COLUMN_LAYOUT: useSetting("COLUMN_LAYOUT"),
      gqlConn,
    }
  },