diff --git a/assets/css/styles.scss b/assets/css/styles.scss index 614e89475..4a890ddbc 100644 --- a/assets/css/styles.scss +++ b/assets/css/styles.scss @@ -231,31 +231,6 @@ nav.secondary-nav { flex-direction: column; } -$responsiveWidth: 720px; - -@media (max-width: $responsiveWidth) { - .columns { - flex-flow: column; - } - - .nav-first { - width: 100%; - background-color: var(--bg-color); - } - - nav.primary-nav { - flex-flow: row; - } - - nav.secondary-nav { - display: none; - } - - .main { - padding: 0 8px; - } -} - h1, h2, h3 { @@ -625,31 +600,6 @@ ol li { display: none; } -@media (max-width: $responsiveWidth) { - - ul, - ol { - flex-direction: column; - } - - ul li, - ol li { - display: flex; - } - - .hide-on-small-screen { - display: none; - } - - .hide-on-large-screen { - display: inline-flex; - } - - .show-on-small-screen { - display: inline-flex; - } -} - #installPWA { display: none; } @@ -800,3 +750,45 @@ input[type="radio"]:checked+label+div.tab { .toasted.bubble .action { color: inherit !important; } + +@media (max-width: $responsiveWidth) { + .columns { + flex-flow: column; + } + + .nav-first { + width: 100%; + background-color: var(--bg-color); + } + + nav.primary-nav { + flex-flow: row; + } + + nav.secondary-nav { + display: none; + } + + .main { + padding: 0 8px; + } + + ul, + ol { + flex-direction: column; + } + + ul li, + ol li { + display: flex; + } + + .hide-on-small-screen { + display: none; + } + + .hide-on-large-screen, + .show-on-small-screen { + display: inline-flex; + } +} diff --git a/components/collections/saveRequestAs.vue b/components/collections/saveRequestAs.vue index bb96c5b8b..0d51b83ae 100644 --- a/components/collections/saveRequestAs.vue +++ b/components/collections/saveRequestAs.vue @@ -24,7 +24,14 @@ v-model="requestData.name" v-bind:placeholder="defaultRequestName" @keyup.enter="saveRequestAs" + list="preCollectionLabels" /> + + + + + + Collection - Duration + Duration (ms) diff --git a/layouts/default.vue b/layouts/default.vue index 081dc460b..898cc9d25 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -236,23 +236,27 @@ - - - - Save to Collections - CtrlS - - - - - - - Copy Sharable Link - CtrlK - - - + + Send Request + Ctrl G + + + + Save to Collections + Ctrl S + + + + Copy Request Link + Ctrl K + + + + Reset Request + Ctrl L + + diff --git a/pages/index.vue b/pages/index.vue index 5c67b6516..145987868 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -27,7 +27,6 @@ @keydown="formatRawParams" rows="8" v-model="preRequestScript" - v-textarea-auto-height="preRequestScript" spellcheck="false" placeholder="pw.env.set('variable', 'value');" > @@ -78,7 +77,14 @@ type="text" v-model="label" placeholder="(optional)" + list="preLabels" /> + + + + + + @@ -219,7 +225,6 @@ @keydown="formatRawParams" rows="8" v-model="rawParams" - v-textarea-auto-height="rawParams" > @@ -291,6 +296,7 @@ class="icon" @click="clearContent('', $event)" v-tooltip.bottom="'Clear All'" + ref="clearAll" > clear_all @@ -1943,14 +1949,22 @@ export default { mounted() { this.observeRequestButton(); this._keyListener = function(e) { - if (e.key === "s" && (e.ctrlKey || e.metaKey)) { + if (e.key === "g" && (e.ctrlKey || e.metaKey)) { + e.preventDefault(); + this.sendRequest(); + } + else if (e.key === "s" && (e.ctrlKey || e.metaKey)) { e.preventDefault(); this.saveRequest(); } - if (e.key === "k" && (e.ctrlKey || e.metaKey)) { + else if (e.key === "k" && (e.ctrlKey || e.metaKey)) { e.preventDefault(); this.copyRequest(); } + else if (e.key === "l" && (e.ctrlKey || e.metaKey)) { + e.preventDefault(); + this.$refs.clearAll.click(); + } }; document.addEventListener("keydown", this._keyListener.bind(this)); },