diff --git a/assets/css/styles.scss b/assets/css/styles.scss index 2bb3bba07..8ceacb2b5 100644 --- a/assets/css/styles.scss +++ b/assets/css/styles.scss @@ -22,13 +22,11 @@ $responsiveWidth: 768px; ::-webkit-scrollbar { width: 4px; height: 4px; - border-radius: 4px; - background-color: var(--bg-light-color); + background-color: var(--bg-dark-color); } ::-webkit-scrollbar-thumb { background-color: var(--fg-light-color); - border-radius: 8px; &:hover { background-color: var(--fg-color); @@ -62,7 +60,6 @@ body { scroll-behavior: smooth; } -// Make theme transition smoother. body.afterLoad { transition: background-color 0.2s ease-in-out; } @@ -76,6 +73,10 @@ a { color: inherit; text-decoration: none; transition: all 0.2s ease-in-out; + + &.link { + color: var(--ac-color); + } } header, @@ -146,7 +147,8 @@ footer { z-index: 1; height: 100vh; padding: 0 8px; - background-color: var(--bg-light-color); + background-color: var(--bg-dark-color); + transition: all 0.2s ease-in-out; } .main { @@ -186,7 +188,6 @@ nav.primary-nav { color: var(--fg-light-color); fill: var(--fg-light-color); margin: 8px 0; - transition: all 0.2s ease-in-out; &:hover { color: var(--fg-color); @@ -422,7 +423,6 @@ button { color: var(--act-color); fill: var(--act-color); box-shadow: inset 0 0 0 2px var(--fg-color); - transition: all 0.2s ease-in-out; } &.icon { @@ -437,7 +437,6 @@ button { color: var(--fg-color); fill: var(--fg-color); box-shadow: none; - transition: all 0.2s ease-in-out; } } @@ -472,7 +471,6 @@ button { fieldset { margin: 16px 0; border-radius: 16px; - transition: all 0.2s ease-in-out; background-color: var(--bg-dark-color); } @@ -565,7 +563,6 @@ code { &:not([readonly]):not(.ace_editor):active, &:not([readonly]):not(.ace_editor):focus { box-shadow: inset 0 0 0 2px var(--fg-light-color); - transition: all 0.2s ease-in-out; } } @@ -576,7 +573,6 @@ code { &:active, &:focus { box-shadow: inset 0 0 0 2px var(--fg-light-color); - transition: all 0.2s ease-in-out; } } @@ -884,18 +880,19 @@ input[type="radio"]:checked + label + .tab { padding: 0; width: 100%; background-color: var(--bg-color); - transition: all 0.2s ease-in-out; box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.45); } nav.primary-nav { flex-flow: row nowrap; overflow: auto; - justify-content: space-around; + justify-content: space-between; + background-color: var(--bg-dark-color); a { background-color: transparent; margin: 8px; + flex: 1; &.nuxt-link-exact-active { background-color: transparent; diff --git a/components/settings/swatch.vue b/components/settings/swatch.vue index 0d0dc870b..55373c58d 100644 --- a/components/settings/swatch.vue +++ b/components/settings/swatch.vue @@ -20,6 +20,7 @@ border-radius: 100%; border: 3px solid var(--bg-dark-color); cursor: pointer; + transition: all 0.2s ease-in-out; &.fg { color: var(--act-color); diff --git a/functions/headers.js b/functions/headers.js index 9fbc2938e..ffc6b5d5f 100644 --- a/functions/headers.js +++ b/functions/headers.js @@ -121,4 +121,4 @@ export const commonHeaders = [ "X-Requested-With", "X-Robots-Tag", "X-UA-Compatible" -] +]; diff --git a/functions/network.js b/functions/network.js index 591d8f4d3..22ff13364 100644 --- a/functions/network.js +++ b/functions/network.js @@ -1,16 +1,17 @@ import AxiosStrategy from "./strategies/AxiosStrategy"; import ExtensionStrategy from "./strategies/ExtensionStrategy"; import FirefoxStrategy from "./strategies/FirefoxStrategy"; -import ChromeStrategy, { hasChromeExtensionInstalled } from "./strategies/ChromeStrategy"; +import ChromeStrategy, { + hasChromeExtensionInstalled +} from "./strategies/ChromeStrategy"; -const isExtensionsAllowed = ({ state }) => { - return typeof state.postwoman.settings.EXTENSIONS_ENABLED === 'undefined' - || state.postwoman.settings.EXTENSIONS_ENABLED; -} +const isExtensionsAllowed = ({ state }) => + typeof state.postwoman.settings.EXTENSIONS_ENABLED === "undefined" || + state.postwoman.settings.EXTENSIONS_ENABLED; const runAppropriateStrategy = (req, store) => { if (isExtensionsAllowed(store)) { - if (typeof window.__POSTWOMAN_EXTENSION_HOOK__ !== 'undefined') { + if (typeof window.__POSTWOMAN_EXTENSION_HOOK__ !== "undefined") { return ExtensionStrategy(req, store); } @@ -19,7 +20,7 @@ const runAppropriateStrategy = (req, store) => { // Chrome Provides a chrome object for scripts to access // Check its availability to say whether you are in Google Chrome if (window.chrome && hasChromeExtensionInstalled()) { - return ChromeStrategy(req, store); + return ChromeStrategy(req, store); } // The firefox plugin injects a function to send requests through it // If that is available, then we can use the FirefoxStrategy @@ -29,10 +30,11 @@ const runAppropriateStrategy = (req, store) => { } return AxiosStrategy(req, store); -} +}; const sendNetworkRequest = (req, store) => - runAppropriateStrategy(req, store) - .finally(() => window.$nuxt.$loading.finish()); + runAppropriateStrategy(req, store).finally(() => + window.$nuxt.$loading.finish() + ); export { sendNetworkRequest }; diff --git a/functions/strategies/ChromeStrategy.js b/functions/strategies/ChromeStrategy.js index 03c05ea0c..fe88338cb 100644 --- a/functions/strategies/ChromeStrategy.js +++ b/functions/strategies/ChromeStrategy.js @@ -3,47 +3,54 @@ const EXTENSION_ID = "amknoiejhlmhancpahfcfcfhllgkpbld"; // Check if the Chrome Extension is present // The Chrome extension injects an empty span to help detection. // Also check for the presence of window.chrome object to confirm smooth operations -export const hasChromeExtensionInstalled = () => { - return document.getElementById("chromePWExtensionDetect") !== null; -} +export const hasChromeExtensionInstalled = () => + document.getElementById("chromePWExtensionDetect") !== null; -const chromeWithoutProxy = (req, _store) => new Promise((resolve, reject) => { - chrome.runtime.sendMessage( - EXTENSION_ID, { - messageType: "send-req", - data: { - config: req - } - }, (message) => { - if (message.data.error) { - reject(message.data.error); - } else { - resolve(message.data.response); - } - } - ); -}); - -const chromeWithProxy = (req, { state }) => new Promise((resolve, reject) => { - chrome.runtime.sendMessage( - EXTENSION_ID, { - messageType: "send-req", - data: { - config: { - method: "post", - url: state.postwoman.settings.PROXY_URL || "https://postwoman.apollotv.xyz/", - data: req +const chromeWithoutProxy = (req, _store) => + new Promise((resolve, reject) => { + chrome.runtime.sendMessage( + EXTENSION_ID, + { + messageType: "send-req", + data: { + config: req + } + }, + ({ data }) => { + if (data.error) { + reject(data.error); + } else { + resolve(data.response); } } - }, (message) => { - if (message.data.error) { - reject(error); - } else { - resolve(message.data.response.data); + ); + }); + +const chromeWithProxy = (req, { state }) => + new Promise((resolve, reject) => { + chrome.runtime.sendMessage( + EXTENSION_ID, + { + messageType: "send-req", + data: { + config: { + method: "post", + url: + state.postwoman.settings.PROXY_URL || + "https://postwoman.apollotv.xyz/", + data: req + } + } + }, + ({ data }) => { + if (data.error) { + reject(error); + } else { + resolve(data.response.data); + } } - } - ) -}); + ); + }); const chromeStrategy = (req, store) => { if (store.state.postwoman.settings.PROXY_ENABLED) { @@ -51,6 +58,6 @@ const chromeStrategy = (req, store) => { } else { return chromeWithoutProxy(req, store); } -} +}; export default chromeStrategy; diff --git a/functions/strategies/ExtensionStrategy.js b/functions/strategies/ExtensionStrategy.js index 3305f0b6e..837498a1d 100644 --- a/functions/strategies/ExtensionStrategy.js +++ b/functions/strategies/ExtensionStrategy.js @@ -1,7 +1,8 @@ const extensionWithProxy = async (req, { state }) => { const { data } = await window.__POSTWOMAN_EXTENSION_HOOK__.sendRequest({ method: "post", - url: state.postwoman.settings.PROXY_URL || "https://postwoman.apollotv.xyz/", + url: + state.postwoman.settings.PROXY_URL || "https://postwoman.apollotv.xyz/", data: req }); return data; diff --git a/layouts/default.vue b/layouts/default.vue index 4302a71f8..2308fe971 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -408,7 +408,7 @@
@@ -715,7 +715,7 @@ export default { .then(() => {}) .catch(console.error); } else { - // fallback + // fallback } } }, diff --git a/pages/settings.vue b/pages/settings.vue index 490ca804c..aa780be21 100644 --- a/pages/settings.vue +++ b/pages/settings.vue @@ -206,7 +206,12 @@ {{ $t("postwoman_official_proxy_hosting") }}
{{ $t("read_the") }} - + {{ $t("apollotv_privacy_policy") }} .

diff --git a/store/postwoman.js b/store/postwoman.js index ab79729ef..4b8eb235c 100644 --- a/store/postwoman.js +++ b/store/postwoman.js @@ -57,11 +57,11 @@ export const SETTINGS_KEYS = [ * e.g. 'auth' */ "URL_EXCLUDES", - + /** * A boolean value indicating whether to use the browser extensions * to run the requests - */ + */ "EXTENSIONS_ENABLED" ]; @@ -118,7 +118,9 @@ export const mutations = { addNewCollection({ collections }, collection) { const { name } = collection; - const duplicateCollection = collections.some(item => item.name.toLowerCase() === name.toLowerCase()); + const duplicateCollection = collections.some( + item => item.name.toLowerCase() === name.toLowerCase() + ); if (duplicateCollection) { this.$toast.info("Duplicate collection"); return; @@ -137,9 +139,10 @@ export const mutations = { }, editCollection({ collections }, payload) { - const { collection, collectionIndex } = payload; - const { name } = collection; - const duplicateCollection = collections.some(item => item.name.toLowerCase() === name.toLowerCase()); + const { collection: { name }, collectionIndex } = payload; + const duplicateCollection = collections.some( + item => item.name.toLowerCase() === name.toLowerCase() + ); if (duplicateCollection) { this.$toast.info("Duplicate collection"); return;