btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

chore: dependency updates, minor UI updates, better color schemes

Browse Source
This commit is contained in:
Liyas Thomas
2020-09-25 06:39:21 +05:30
parent a3574acabd
commit e707fcda05
4 changed files with 56 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
assets/scss/styles.scss
View File

@@ -7,8 +7,8 @@ $responsiveWidth: 768px;
} }
:root { :root {
font-variant-ligatures: common-ligatures;
@apply antialiased; @apply antialiased;
font-variant-ligatures: common-ligatures;
} }
::selection { ::selection {
@@ -18,7 +18,7 @@ $responsiveWidth: 768px;
::-webkit-scrollbar { ::-webkit-scrollbar {
@apply h-1; @apply h-1;
@apply w-1; @apply w-2;
@apply rounded-lg; @apply rounded-lg;
&:hover { &:hover {
@@ -175,12 +175,7 @@ hr {
} }
.tooltip { .tooltip {
$bgcolor: var(--tt-color);
$fgcolor: var(--fg-color);
@apply z-50; @apply z-50;
@apply transition;
@apply ease-in-out;
@apply duration-200;
.tooltip-inner { .tooltip-inner {
@apply rounded-lg; @apply rounded-lg;
@@ -189,8 +184,11 @@ hr {
@apply text-xs; @apply text-xs;
@apply font-medium; @apply font-medium;
@apply shadow-lg; @apply shadow-lg;
background: $bgcolor; @apply transition;
color: $fgcolor; @apply ease-in-out;
@apply duration-200;
@apply bg-ttColor;
@apply text-fgColor;
} }
.tooltip-arrow { .tooltip-arrow {
@@ -201,20 +199,23 @@ hr {
@apply m-2; @apply m-2;
@apply border-ttColor; @apply border-ttColor;
@apply z-30; @apply z-30;
@apply transition;
@apply ease-in-out;
@apply duration-200;
} }
&[x-placement^="top"] { &[x-placement^="top"] {
@apply mb-0; @apply mb-0;
.tooltip-arrow { .tooltip-arrow {
@apply mt-0;
@apply mb-0;
border-width: 5px 5px 0 5px; border-width: 5px 5px 0 5px;
border-left-color: transparent !important; border-left-color: transparent !important;
border-right-color: transparent !important; border-right-color: transparent !important;
border-bottom-color: transparent !important; border-bottom-color: transparent !important;
bottom: -5px; bottom: -5px;
left: calc(50% - 5px); left: calc(50% - 5px);
@apply mt-0;
@apply mb-0;
} }
} }
@@ -222,14 +223,14 @@ hr {
@apply mt-0; @apply mt-0;
.tooltip-arrow { .tooltip-arrow {
@apply mt-0;
@apply mb-0;
border-width: 0 5px 5px 5px; border-width: 0 5px 5px 5px;
border-left-color: transparent !important; border-left-color: transparent !important;
border-right-color: transparent !important; border-right-color: transparent !important;
border-top-color: transparent !important; border-top-color: transparent !important;
top: -5px; top: -5px;
left: calc(50% - 5px); left: calc(50% - 5px);
@apply mt-0;
@apply mb-0;
} }
} }
@@ -237,14 +238,14 @@ hr {
@apply ml-0; @apply ml-0;
.tooltip-arrow { .tooltip-arrow {
@apply ml-0;
@apply mr-0;
border-width: 5px 5px 5px 0; border-width: 5px 5px 5px 0;
border-left-color: transparent !important; border-left-color: transparent !important;
border-top-color: transparent !important; border-top-color: transparent !important;
border-bottom-color: transparent !important; border-bottom-color: transparent !important;
left: -5px; left: -5px;
top: calc(50% - 5px); top: calc(50% - 5px);
@apply ml-0;
@apply mr-0;
} }
} }
@@ -252,14 +253,14 @@ hr {
@apply mr-0; @apply mr-0;
.tooltip-arrow { .tooltip-arrow {
@apply ml-0;
@apply mr-0;
border-width: 5px 0 5px 5px; border-width: 5px 0 5px 5px;
border-top-color: transparent !important; border-top-color: transparent !important;
border-right-color: transparent !important; border-right-color: transparent !important;
border-bottom-color: transparent !important; border-bottom-color: transparent !important;
right: -5px; right: -5px;
top: calc(50% - 5px); top: calc(50% - 5px);
@apply ml-0;
@apply mr-0;
} }
} }
@@ -269,14 +270,14 @@ hr {
} }
.popover-inner { .popover-inner {
background: $bgcolor; @apply bg-ttColor;
color: $fgcolor; @apply text-fgColor;
max-height: 256px;
@apply text-base; @apply text-base;
@apply p-2; @apply p-2;
@apply rounded-lg; @apply rounded-lg;
@apply overflow-auto; @apply overflow-auto;
@apply shadow-lg; @apply shadow-lg;
max-height: 256px;
button { button {
@apply flex-1; @apply flex-1;
@@ -295,7 +296,7 @@ hr {
} }
.popover-arrow { .popover-arrow {
border-color: $bgcolor; @apply border-ttColor;
} }
} }
@@ -441,6 +442,10 @@ section:target {
} }
} }
input {
@apply truncate;
}
input[type="file"], input[type="file"],
input[type="radio"], input[type="radio"],
#installPWA { #installPWA {
@@ -525,17 +530,17 @@ pre {
@apply inline-block; @apply inline-block;
@apply absolute; @apply absolute;
@apply pointer-events-none; @apply pointer-events-none;
content: "\e313";
@apply font-icon; @apply font-icon;
content: "\e313";
top: 16px; top: 16px;
right: 16px; right: 16px;
} }
} }
select { select {
height: 40px;
@apply cursor-pointer; @apply cursor-pointer;
@apply appearance-none; @apply appearance-none;
height: 40px;
&::-ms-expand { &::-ms-expand {
@apply hidden; @apply hidden;
@@ -555,7 +560,6 @@ input[type="checkbox"] {
@apply cursor-pointer; @apply cursor-pointer;
&:before { &:before {
content: "\2714";
@apply border; @apply border;
@apply border-fgColor; @apply border-fgColor;
@apply rounded-lg; @apply rounded-lg;
@@ -566,6 +570,7 @@ input[type="checkbox"] {
@apply transition; @apply transition;
@apply ease-in-out; @apply ease-in-out;
@apply duration-200; @apply duration-200;
content: "\2714";
height: 16px; height: 16px;
width: 16px; width: 16px;
margin: 8px 8px 8px 0; margin: 8px 8px 8px 0;
@@ -793,22 +798,22 @@ section {
.toasted-ad { .toasted-ad {
@apply bg-gray-50; @apply bg-gray-50;
@apply text-gray-900; @apply text-gray-900;
padding: 16px !important;
@apply font-bold; @apply font-bold;
@apply text-sm; @apply text-sm;
@apply rounded-lg; @apply rounded-lg;
@apply shadow-lg; @apply shadow-lg;
padding: 16px !important;
.action { .action {
@apply bg-gray-50;
@apply text-gray-900;
@apply rounded-lg;
text-transform: none !important; text-transform: none !important;
padding: 12px 16px !important; padding: 12px 16px !important;
font-weight: 500 !important; font-weight: 500 !important;
font-size: 16px !important; font-size: 16px !important;
margin: 0 !important; margin: 0 !important;
margin-left: 8px !important; margin-left: 8px !important;
@apply bg-gray-50;
@apply text-gray-900;
@apply rounded-lg;
} }
} }
@@ -817,8 +822,8 @@ section {
} }
.github-sponsor { .github-sponsor {
@apply rounded-full;
@apply mr-4; @apply mr-4;
max-width: 64px; max-width: 64px;
max-height: 64px; max-height: 64px;
@apply rounded-full;
} }

6
assets/scss/themes.scss
View File

@@ -20,7 +20,7 @@
// Error color // Error color
--err-color: rgba(255, 255, 255, 0.05); --err-color: rgba(255, 255, 255, 0.05);
// Tooltip color // Tooltip color
--tt-color: rgba(53, 53, 53, 1); --tt-color: rgba(48, 48, 48, 1);
// Editor theme // Editor theme
--editor-theme: "twilight"; --editor-theme: "twilight";
// Active text color // Active text color
@@ -43,7 +43,7 @@
// Error color // Error color
--err-color: rgba(0, 0, 0, 0.1); --err-color: rgba(0, 0, 0, 0.1);
// Tooltip color // Tooltip color
--tt-color: rgba(220, 220, 220, 1); --tt-color: rgba(255, 255, 255, 1);
// Editor theme // Editor theme
--editor-theme: "iplastic"; --editor-theme: "iplastic";
// Active text color // Active text color
@@ -66,7 +66,7 @@
// Error color // Error color
--err-color: rgba(255, 255, 255, 0.05); --err-color: rgba(255, 255, 255, 0.05);
// Tooltip color // Tooltip color
--tt-color: rgba(18, 18, 18, 1); --tt-color: rgba(32, 32, 32, 1);
// Editor theme // Editor theme
--editor-theme: "vibrant_ink"; --editor-theme: "vibrant_ink";
// Active text color // Active text color

36
package-lock.json generated
View File

@@ -1325,9 +1325,9 @@
} }
}, },
"@firebase/firestore": { "@firebase/firestore": {
"version": "1.17.0", "version": "1.17.1",
"resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-1.17.0.tgz", "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-1.17.1.tgz",
"integrity": "sha512-ZELQC7nC0Ueexxy/K9zk0lqFuGs7LatEK9Ybr2BwH6KbkvNUovToTiaRUhSOv5IDxjrEu2k6sY1xwnxE4qpqMA==", "integrity": "sha512-FJlNmFIBr9wrkA5g9JBPJWPmxYIzUhBDfsJGHNTUCxMbwm12pz/1Y6CW56kvZOgl6l+iPNlF911iduUDFzNUqw==",
"requires": { "requires": {
"@firebase/component": "0.1.19", "@firebase/component": "0.1.19",
"@firebase/firestore-types": "1.13.0", "@firebase/firestore-types": "1.13.0",
@@ -3633,11 +3633,11 @@
}, },
"dependencies": { "dependencies": {
"debug": { "debug": {
"version": "4.1.1", "version": "4.2.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz",
"integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==",
"requires": { "requires": {
"ms": "^2.1.1" "ms": "2.1.2"
} }
}, },
"ms": { "ms": {
@@ -7442,16 +7442,16 @@
} }
}, },
"firebase": { "firebase": {
"version": "7.21.0", "version": "7.21.1",
"resolved": "https://registry.npmjs.org/firebase/-/firebase-7.21.0.tgz", "resolved": "https://registry.npmjs.org/firebase/-/firebase-7.21.1.tgz",
"integrity": "sha512-aERVRK3oxll+lzcDUzOFjww39G1h1dRlEdCqZEl5NL/3CC4GcVhX64At1RdDKcNoW/5jAtHaIvKFaNgC2B91EA==", "integrity": "sha512-ogqWUXIP2/1BTee112QJiAjgch/Ig7pzlAw2mfWOhl9E0IUX46OKv0hypLX62MBgaAKwPHfICIwsWOCxlQ9dZQ==",
"requires": { "requires": {
"@firebase/analytics": "0.5.0", "@firebase/analytics": "0.5.0",
"@firebase/app": "0.6.11", "@firebase/app": "0.6.11",
"@firebase/app-types": "0.6.1", "@firebase/app-types": "0.6.1",
"@firebase/auth": "0.14.9", "@firebase/auth": "0.14.9",
"@firebase/database": "0.6.13", "@firebase/database": "0.6.13",
"@firebase/firestore": "1.17.0", "@firebase/firestore": "1.17.1",
"@firebase/functions": "0.4.51", "@firebase/functions": "0.4.51",
"@firebase/installations": "0.4.17", "@firebase/installations": "0.4.17",
"@firebase/messaging": "0.7.1", "@firebase/messaging": "0.7.1",
@@ -7930,9 +7930,9 @@
} }
}, },
"google-auth-library": { "google-auth-library": {
"version": "6.0.6", "version": "6.1.0",
"resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-6.0.6.tgz", "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-6.1.0.tgz",
"integrity": "sha512-fWYdRdg55HSJoRq9k568jJA1lrhg9i2xgfhVIMJbskUmbDpJGHsbv9l41DGhCDXM21F9Kn4kUwdysgxSYBYJUw==", "integrity": "sha512-GbalszIADE1YPWhUyfFMrkLhFHnlAgoRcqGVW+MsLDPsuaOB5MRPk7NNafPDv9SherNE4EKzcYuxMJjaxzXMOw==",
"requires": { "requires": {
"arrify": "^2.0.0", "arrify": "^2.0.0",
"base64-js": "^1.3.0", "base64-js": "^1.3.0",
@@ -8533,11 +8533,11 @@
}, },
"dependencies": { "dependencies": {
"debug": { "debug": {
"version": "4.1.1", "version": "4.2.0",
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz",
"integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==",
"requires": { "requires": {
"ms": "^2.1.1" "ms": "2.1.2"
} }
}, },
"ms": { "ms": {

2
package.json
View File

@@ -34,7 +34,7 @@
"@nuxtjs/toast": "^3.3.1", "@nuxtjs/toast": "^3.3.1",
"ace-builds": "^1.4.12", "ace-builds": "^1.4.12",
"esprima": "^4.0.1", "esprima": "^4.0.1",
"firebase": "^7.21.0", "firebase": "^7.21.1",
"graphql": "^15.3.0", "graphql": "^15.3.0",
"graphql-language-service-interface": "^2.4.2", "graphql-language-service-interface": "^2.4.2",
"nuxt": "^2.14.6", "nuxt": "^2.14.6",