From e707fcda05d46b4c74d3ce16b1d92206c1609dd9 Mon Sep 17 00:00:00 2001 From: Liyas Thomas Date: Fri, 25 Sep 2020 06:39:21 +0530 Subject: [PATCH] chore: dependency updates, minor UI updates, better color schemes --- assets/scss/styles.scss | 63 ++++++++++++++++++++++------------------- assets/scss/themes.scss | 6 ++-- package-lock.json | 36 +++++++++++------------ package.json | 2 +- 4 files changed, 56 insertions(+), 51 deletions(-) diff --git a/assets/scss/styles.scss b/assets/scss/styles.scss index bc2ebcb9f..8268bb009 100644 --- a/assets/scss/styles.scss +++ b/assets/scss/styles.scss @@ -7,8 +7,8 @@ $responsiveWidth: 768px; } :root { - font-variant-ligatures: common-ligatures; @apply antialiased; + font-variant-ligatures: common-ligatures; } ::selection { @@ -18,7 +18,7 @@ $responsiveWidth: 768px; ::-webkit-scrollbar { @apply h-1; - @apply w-1; + @apply w-2; @apply rounded-lg; &:hover { @@ -175,12 +175,7 @@ hr { } .tooltip { - $bgcolor: var(--tt-color); - $fgcolor: var(--fg-color); @apply z-50; - @apply transition; - @apply ease-in-out; - @apply duration-200; .tooltip-inner { @apply rounded-lg; @@ -189,8 +184,11 @@ hr { @apply text-xs; @apply font-medium; @apply shadow-lg; - background: $bgcolor; - color: $fgcolor; + @apply transition; + @apply ease-in-out; + @apply duration-200; + @apply bg-ttColor; + @apply text-fgColor; } .tooltip-arrow { @@ -201,20 +199,23 @@ hr { @apply m-2; @apply border-ttColor; @apply z-30; + @apply transition; + @apply ease-in-out; + @apply duration-200; } &[x-placement^="top"] { @apply mb-0; .tooltip-arrow { + @apply mt-0; + @apply mb-0; border-width: 5px 5px 0 5px; border-left-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; bottom: -5px; left: calc(50% - 5px); - @apply mt-0; - @apply mb-0; } } @@ -222,14 +223,14 @@ hr { @apply mt-0; .tooltip-arrow { + @apply mt-0; + @apply mb-0; border-width: 0 5px 5px 5px; border-left-color: transparent !important; border-right-color: transparent !important; border-top-color: transparent !important; top: -5px; left: calc(50% - 5px); - @apply mt-0; - @apply mb-0; } } @@ -237,14 +238,14 @@ hr { @apply ml-0; .tooltip-arrow { + @apply ml-0; + @apply mr-0; border-width: 5px 5px 5px 0; border-left-color: transparent !important; border-top-color: transparent !important; border-bottom-color: transparent !important; left: -5px; top: calc(50% - 5px); - @apply ml-0; - @apply mr-0; } } @@ -252,14 +253,14 @@ hr { @apply mr-0; .tooltip-arrow { + @apply ml-0; + @apply mr-0; border-width: 5px 0 5px 5px; border-top-color: transparent !important; border-right-color: transparent !important; border-bottom-color: transparent !important; right: -5px; top: calc(50% - 5px); - @apply ml-0; - @apply mr-0; } } @@ -269,14 +270,14 @@ hr { } .popover-inner { - background: $bgcolor; - color: $fgcolor; - max-height: 256px; + @apply bg-ttColor; + @apply text-fgColor; @apply text-base; @apply p-2; @apply rounded-lg; @apply overflow-auto; @apply shadow-lg; + max-height: 256px; button { @apply flex-1; @@ -295,7 +296,7 @@ hr { } .popover-arrow { - border-color: $bgcolor; + @apply border-ttColor; } } @@ -441,6 +442,10 @@ section:target { } } +input { + @apply truncate; +} + input[type="file"], input[type="radio"], #installPWA { @@ -525,17 +530,17 @@ pre { @apply inline-block; @apply absolute; @apply pointer-events-none; - content: "\e313"; @apply font-icon; + content: "\e313"; top: 16px; right: 16px; } } select { - height: 40px; @apply cursor-pointer; @apply appearance-none; + height: 40px; &::-ms-expand { @apply hidden; @@ -555,7 +560,6 @@ input[type="checkbox"] { @apply cursor-pointer; &:before { - content: "\2714"; @apply border; @apply border-fgColor; @apply rounded-lg; @@ -566,6 +570,7 @@ input[type="checkbox"] { @apply transition; @apply ease-in-out; @apply duration-200; + content: "\2714"; height: 16px; width: 16px; margin: 8px 8px 8px 0; @@ -793,22 +798,22 @@ section { .toasted-ad { @apply bg-gray-50; @apply text-gray-900; - padding: 16px !important; @apply font-bold; @apply text-sm; @apply rounded-lg; @apply shadow-lg; + padding: 16px !important; .action { + @apply bg-gray-50; + @apply text-gray-900; + @apply rounded-lg; text-transform: none !important; padding: 12px 16px !important; font-weight: 500 !important; font-size: 16px !important; margin: 0 !important; margin-left: 8px !important; - @apply bg-gray-50; - @apply text-gray-900; - @apply rounded-lg; } } @@ -817,8 +822,8 @@ section { } .github-sponsor { + @apply rounded-full; @apply mr-4; max-width: 64px; max-height: 64px; - @apply rounded-full; } diff --git a/assets/scss/themes.scss b/assets/scss/themes.scss index 98a316412..1782d1d92 100644 --- a/assets/scss/themes.scss +++ b/assets/scss/themes.scss @@ -20,7 +20,7 @@ // Error color --err-color: rgba(255, 255, 255, 0.05); // Tooltip color - --tt-color: rgba(53, 53, 53, 1); + --tt-color: rgba(48, 48, 48, 1); // Editor theme --editor-theme: "twilight"; // Active text color @@ -43,7 +43,7 @@ // Error color --err-color: rgba(0, 0, 0, 0.1); // Tooltip color - --tt-color: rgba(220, 220, 220, 1); + --tt-color: rgba(255, 255, 255, 1); // Editor theme --editor-theme: "iplastic"; // Active text color @@ -66,7 +66,7 @@ // Error color --err-color: rgba(255, 255, 255, 0.05); // Tooltip color - --tt-color: rgba(18, 18, 18, 1); + --tt-color: rgba(32, 32, 32, 1); // Editor theme --editor-theme: "vibrant_ink"; // Active text color diff --git a/package-lock.json b/package-lock.json index 4ab12efe6..5df73ae78 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1325,9 +1325,9 @@ } }, "@firebase/firestore": { - "version": "1.17.0", - "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-1.17.0.tgz", - "integrity": "sha512-ZELQC7nC0Ueexxy/K9zk0lqFuGs7LatEK9Ybr2BwH6KbkvNUovToTiaRUhSOv5IDxjrEu2k6sY1xwnxE4qpqMA==", + "version": "1.17.1", + "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-1.17.1.tgz", + "integrity": "sha512-FJlNmFIBr9wrkA5g9JBPJWPmxYIzUhBDfsJGHNTUCxMbwm12pz/1Y6CW56kvZOgl6l+iPNlF911iduUDFzNUqw==", "requires": { "@firebase/component": "0.1.19", "@firebase/firestore-types": "1.13.0", @@ -3633,11 +3633,11 @@ }, "dependencies": { "debug": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", - "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz", + "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==", "requires": { - "ms": "^2.1.1" + "ms": "2.1.2" } }, "ms": { @@ -7442,16 +7442,16 @@ } }, "firebase": { - "version": "7.21.0", - "resolved": "https://registry.npmjs.org/firebase/-/firebase-7.21.0.tgz", - "integrity": "sha512-aERVRK3oxll+lzcDUzOFjww39G1h1dRlEdCqZEl5NL/3CC4GcVhX64At1RdDKcNoW/5jAtHaIvKFaNgC2B91EA==", + "version": "7.21.1", + "resolved": "https://registry.npmjs.org/firebase/-/firebase-7.21.1.tgz", + "integrity": "sha512-ogqWUXIP2/1BTee112QJiAjgch/Ig7pzlAw2mfWOhl9E0IUX46OKv0hypLX62MBgaAKwPHfICIwsWOCxlQ9dZQ==", "requires": { "@firebase/analytics": "0.5.0", "@firebase/app": "0.6.11", "@firebase/app-types": "0.6.1", "@firebase/auth": "0.14.9", "@firebase/database": "0.6.13", - "@firebase/firestore": "1.17.0", + "@firebase/firestore": "1.17.1", "@firebase/functions": "0.4.51", "@firebase/installations": "0.4.17", "@firebase/messaging": "0.7.1", @@ -7930,9 +7930,9 @@ } }, "google-auth-library": { - "version": "6.0.6", - "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-6.0.6.tgz", - "integrity": "sha512-fWYdRdg55HSJoRq9k568jJA1lrhg9i2xgfhVIMJbskUmbDpJGHsbv9l41DGhCDXM21F9Kn4kUwdysgxSYBYJUw==", + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/google-auth-library/-/google-auth-library-6.1.0.tgz", + "integrity": "sha512-GbalszIADE1YPWhUyfFMrkLhFHnlAgoRcqGVW+MsLDPsuaOB5MRPk7NNafPDv9SherNE4EKzcYuxMJjaxzXMOw==", "requires": { "arrify": "^2.0.0", "base64-js": "^1.3.0", @@ -8533,11 +8533,11 @@ }, "dependencies": { "debug": { - "version": "4.1.1", - "resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz", - "integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==", + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.2.0.tgz", + "integrity": "sha512-IX2ncY78vDTjZMFUdmsvIRFY2Cf4FnD0wRs+nQwJU8Lu99/tPFdb0VybiiMTPe3I6rQmwsqQqRBvxU+bZ/I8sg==", "requires": { - "ms": "^2.1.1" + "ms": "2.1.2" } }, "ms": { diff --git a/package.json b/package.json index 3c27dd16e..9d6808d68 100644 --- a/package.json +++ b/package.json @@ -34,7 +34,7 @@ "@nuxtjs/toast": "^3.3.1", "ace-builds": "^1.4.12", "esprima": "^4.0.1", - "firebase": "^7.21.0", + "firebase": "^7.21.1", "graphql": "^15.3.0", "graphql-language-service-interface": "^2.4.2", "nuxt": "^2.14.6",