diff --git a/assets/css/styles.scss b/assets/css/styles.scss index f16410794..cb4b8e561 100644 --- a/assets/css/styles.scss +++ b/assets/css/styles.scss @@ -10,7 +10,11 @@ $responsiveWidth: 720px; } ::-webkit-scrollbar-thumb { - background-color: #4a4a4a; + background-color: rgba(0, 0, 0, .3); +} + +::-webkit-scrollbar-thumb:hover { + background-color: rgba(0, 0, 0, .5); } * { diff --git a/nuxt.config.js b/nuxt.config.js index 059b1c493..1896c219a 100644 --- a/nuxt.config.js +++ b/nuxt.config.js @@ -1,4 +1,3 @@ - // Some helpful application constants. // TODO: Use these when rendering the pages (rather than just for head/meta tags...) export const meta = { @@ -6,10 +5,8 @@ export const meta = { shortDescription: "API request builder", description: "The Postwoman API request builder helps you create your requests faster, saving you precious time on your development." }; - // Sets the base path for the router. // Important for deploying to GitHub pages. - // -- Travis includes the author in the repo slug, // so if there's a /, we need to get everything after it. let repoName = (process.env.TRAVIS_REPO_SLUG || '').split('/').pop(); @@ -22,94 +19,195 @@ export const routerBase = process.env.DEPLOY_ENV === 'GH_PAGES' ? { base: '/' } }; - export default { mode: 'spa', /* - ** Headers of the page - */ + ** Headers of the page + */ head: { title: `${meta.name} \u2022 ${meta.shortDescription}`, meta: [ - { charset: 'utf-8' }, - { name: 'viewport', content: 'width=device-width, initial-scale=1, minimum-scale=1, shrink-to-fit=no, minimal-ui' }, - { hid: 'description', name: 'description', content: meta.description || '' }, - { name: 'keywords', content: 'postwoman, api, request, testing, tool, rest, websocket'}, - - { name: 'X-UA-Compatible', content: "IE=edge, chrome=1" }, - { itemprop: "name", content: `${meta.name} \u2022 ${meta.shortDescription}` }, - { itemprop: "description", content: meta.description }, - { itemprop: "image", content: `${routerBase.router.base}icons/icon-192x192.png` }, - + { + charset: 'utf-8' + }, + { + name: 'viewport', + content: 'width=device-width, initial-scale=1, minimum-scale=1, shrink-to-fit=no, minimal-ui' + }, + { + hid: 'description', + name: 'description', + content: meta.description || '' + }, + { + name: 'keywords', + content: 'postwoman, api, request, testing, tool, rest, websocket' + }, + { + name: 'X-UA-Compatible', + content: "IE=edge, chrome=1" + }, + { + itemprop: "name", + content: `${meta.name} \u2022 ${meta.shortDescription}` + }, + { + itemprop: "description", + content: meta.description + }, + { + itemprop: "image", + content: `${routerBase.router.base}icons/icon-192x192.png` + }, // Add to homescreen for Chrome on Android. Fallback for PWA (handled by nuxt) - { name: 'application-name', content: meta.name }, - + { + name: 'application-name', + content: meta.name + }, // Add to homescreen for Safari on iOS - { name: 'apple-mobile-web-app-capable', content: 'yes' }, - { name: 'apple-mobile-web-app-status-bar-style', content: 'black-translucent' }, - { name: 'apple-mobile-web-app-title', content: meta.name }, - + { + name: 'apple-mobile-web-app-capable', + content: 'yes' + }, + { + name: 'apple-mobile-web-app-status-bar-style', + content: 'black-translucent' + }, + { + name: 'apple-mobile-web-app-title', + content: meta.name + }, // Windows phone tile icon - { name: 'msapplication-TileImage', content: `${routerBase.router.base}icons/icon-144x144.png` }, - { name: 'msapplication-TileColor', content: '#282a36' }, - { name: 'msapplication-tap-highlight', content: 'no' }, - + { + name: 'msapplication-TileImage', + content: `${routerBase.router.base}icons/icon-144x144.png` + }, + { + name: 'msapplication-TileColor', + content: '#282a36' + }, + { + name: 'msapplication-tap-highlight', + content: 'no' + }, // OpenGraph - { property: 'og:site_name', content: meta.name }, - { property: 'og:url', content: 'https://liyasthomas.github.io/postwoman' }, - { property: 'og:type', content: 'website' }, - { property: 'og:title', content: `${meta.name} \u2022 ${meta.shortDescription}` }, - { property: 'og:description', content: meta.description }, - { property: 'og:image', content: `${routerBase.router.base}icons/icon-144x144.png` }, - + { + property: 'og:site_name', + content: meta.name + }, + { + property: 'og:url', + content: 'https://liyasthomas.github.io/postwoman' + }, + { + property: 'og:type', + content: 'website' + }, + { + property: 'og:title', + content: `${meta.name} \u2022 ${meta.shortDescription}` + }, + { + property: 'og:description', + content: meta.description + }, + { + property: 'og:image', + content: `${routerBase.router.base}icons/icon-144x144.png` + }, // Twitter - { name: 'twitter:card', content: "summary" }, - { name: 'twitter:site', content: "@liyasthomas" }, - { name: 'twitter:creator', content: "@liyasthomas" }, - { name: 'twitter:url', content: "https://liyasthomas.github.io/postwoman" }, - { name: 'twitter:title', content: meta.name }, - { name: 'twitter:description', content: meta.shortDescription }, - { name: 'twitter:image', content: `${routerBase.router.base}icons/icon-144x144.png` }, - + { + name: 'twitter:card', + content: "summary" + }, + { + name: 'twitter:site', + content: "@liyasthomas" + }, + { + name: 'twitter:creator', + content: "@liyasthomas" + }, + { + name: 'twitter:url', + content: "https://liyasthomas.github.io/postwoman" + }, + { + name: 'twitter:title', + content: meta.name + }, + { + name: 'twitter:description', + content: meta.shortDescription + }, + { + name: 'twitter:image', + content: `${routerBase.router.base}icons/icon-144x144.png` + }, ], link: [ - { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }, - + { + rel: 'icon', + type: 'image/x-icon', + href: '/favicon.ico' + }, // Home-screen icons (iOS) - { rel: 'apple-touch-icon', href: `${routerBase.router.base}icons/icon-48x48.png` }, - { rel: 'apple-touch-icon', sizes: '72x72', href: `${routerBase.router.base}icons/icon-72x72.png` }, - { rel: 'apple-touch-icon', sizes: '96x96', href: `${routerBase.router.base}icons/icon-96x96.png` }, - { rel: 'apple-touch-icon', sizes: '144x144', href: `${routerBase.router.base}icons/icon-144x144.png` }, - { rel: 'apple-touch-icon', sizes: '192x192', href: `${routerBase.router.base}icons/icon-192x192.png` }, + { + rel: 'apple-touch-icon', + href: `${routerBase.router.base}icons/icon-48x48.png` + }, + { + rel: 'apple-touch-icon', + sizes: '72x72', + href: `${routerBase.router.base}icons/icon-72x72.png` + }, + { + rel: 'apple-touch-icon', + sizes: '96x96', + href: `${routerBase.router.base}icons/icon-96x96.png` + }, + { + rel: 'apple-touch-icon', + sizes: '144x144', + href: `${routerBase.router.base}icons/icon-144x144.png` + }, + { + rel: 'apple-touch-icon', + sizes: '192x192', + href: `${routerBase.router.base}icons/icon-192x192.png` + }, ] }, /* - ** Customize the progress-bar color - */ - loading: { color: 'var(--ac-color)' }, - + ** Customize the progress-bar color + */ + loading: { + color: 'var(--ac-color)' + }, /* - ** Global CSS - */ + ** Global CSS + */ css: [ '@/assets/css/themes.scss', '@/assets/css/fonts.scss', '@/assets/css/styles.scss' ], /* - ** Plugins to load before mounting the App - */ + ** Plugins to load before mounting the App + */ plugins: [ - { src: '~/plugins/vuex-persist' } + { + src: '~/plugins/vuex-persist' + } ], /* - ** Nuxt.js dev-modules - */ + ** Nuxt.js dev-modules + */ buildModules: [ ], /* - ** Nuxt.js modules - */ + ** Nuxt.js modules + */ modules: [ // See https://goo.gl/OOhYW5 ['@nuxtjs/pwa', { @@ -117,48 +215,40 @@ export default { name: meta.name, short_name: meta.name, description: meta.shortDescription, - display: "standalone", theme_color: "#282a36", background_color: "#282a36", - + start_url: `${routerBase.router.base}`, icons: ((sizes) => { let icons = []; - - for(let size of sizes){ + for (let size of sizes) { icons.push({ "src": `${routerBase.router.base}icons/icon-${size}x${size}.png`, "type": "image/png", "sizes": `${size}x${size}` }); } - return icons; })([48, 72, 96, 144, 192, 512]) } }], - ['@nuxtjs/axios'] ], - /* - ** Build configuration - */ + ** Build configuration + */ build: { /* - ** You can extend webpack config here - */ - extend (config, ctx) { - } + ** You can extend webpack config here + */ + extend(config, ctx) {} }, - /* - ** Generate configuration - */ + ** Generate configuration + */ generate: { fallback: true }, - /* ** Router configuration */ diff --git a/static/favicon.ico b/static/favicon.ico index 31b2be9a1..dd77a09a4 100644 Binary files a/static/favicon.ico and b/static/favicon.ico differ diff --git a/static/icon.png b/static/icon.png index 2fb3201fc..36542df75 100644 Binary files a/static/icon.png and b/static/icon.png differ diff --git a/static/icons/icon-144x144.png b/static/icons/icon-144x144.png index e657ccaca..256f9ee50 100644 Binary files a/static/icons/icon-144x144.png and b/static/icons/icon-144x144.png differ diff --git a/static/icons/icon-192x192.png b/static/icons/icon-192x192.png deleted file mode 100644 index 9561b981e..000000000 Binary files a/static/icons/icon-192x192.png and /dev/null differ diff --git a/static/icons/icon-48x48.png b/static/icons/icon-48x48.png index 5d231b70a..f33f9146b 100644 Binary files a/static/icons/icon-48x48.png and b/static/icons/icon-48x48.png differ diff --git a/static/icons/icon-512x512.png b/static/icons/icon-512x512.png index 2fb3201fc..36542df75 100644 Binary files a/static/icons/icon-512x512.png and b/static/icons/icon-512x512.png differ diff --git a/static/icons/icon-72x72.png b/static/icons/icon-72x72.png index e159000f6..fd5097178 100644 Binary files a/static/icons/icon-72x72.png and b/static/icons/icon-72x72.png differ diff --git a/static/icons/icon-96x96.png b/static/icons/icon-96x96.png index c5f086c59..16c55e021 100644 Binary files a/static/icons/icon-96x96.png and b/static/icons/icon-96x96.png differ