From 15b5df404b02d8fc781d77e42383a11434a46fdb Mon Sep 17 00:00:00 2001 From: Linh Nguyen Date: Tue, 12 Jan 2021 22:45:32 -0800 Subject: [PATCH] Resolve requested changes --- .eslintrc.js | 5 + .gitignore | 2 + .prettierignore | 1 - .storybook/main.js | 5 + jest.config.js | 7 +- package-lock.json | 502 +++++-- package.json | 4 +- public/fonts/Inter-Bold.woff | Bin 128008 -> 0 bytes public/fonts/Inter-Bold.woff2 | Bin 95928 -> 0 bytes public/fonts/Inter-BoldItalic.woff | Bin 134752 -> 0 bytes public/fonts/Inter-BoldItalic.woff2 | Bin 100556 -> 0 bytes public/fonts/Inter-Italic.woff | Bin 128744 -> 0 bytes public/fonts/Inter-Italic.woff2 | Bin 96040 -> 0 bytes public/fonts/Inter-Regular.woff | Bin 119692 -> 0 bytes public/fonts/Inter-Regular.woff2 | Bin 88816 -> 0 bytes public/fonts/Metropolis-Bold.woff | Bin 17960 -> 0 bytes public/fonts/Metropolis-Bold.woff2 | Bin 16728 -> 0 bytes public/fonts/Metropolis-Medium.woff | Bin 17708 -> 0 bytes public/fonts/Metropolis-Medium.woff2 | Bin 16496 -> 0 bytes public/fonts/ZillaSlab-Bold.woff | Bin 108128 -> 0 bytes public/fonts/ZillaSlab-Bold.woff2 | Bin 68260 -> 0 bytes public/fonts/ZillaSlab-BoldItalic.woff | Bin 112492 -> 0 bytes public/fonts/ZillaSlab-BoldItalic.woff2 | Bin 69756 -> 0 bytes public/fonts/ZillaSlab-Regular.woff | Bin 107784 -> 0 bytes public/fonts/ZillaSlab-Regular.woff2 | Bin 68568 -> 0 bytes public/fonts/ZillaSlab-RegularItalic.woff | Bin 111928 -> 0 bytes public/fonts/ZillaSlab-RegularItalic.woff2 | Bin 69520 -> 0 bytes public/glean_logo.png | Bin 0 -> 14503 bytes public/img/logos/glean_logo_bw.png | Bin 14322 -> 0 bytes public/img/logos/mozilla/white.png | Bin 2620 -> 0 bytes public/img/logos/mozilla/white.svg | 1 - public/img/logos/mozilla/white@2x.png | Bin 5738 -> 0 bytes public/img/logos/mozilla/white@3x.png | Bin 9302 -> 0 bytes rollup.config.js | 13 + src/App.svelte | 4 +- src/__snapshots__/storyshots.test.js.snap | 1193 ++++++++++++++++- src/components/Breadcrumb.svelte | 5 +- src/components/Footer.svelte | 2 +- .../{Title.svelte => PageTitle.svelte} | 0 src/components/Pagination.svelte | 2 +- src/components/Pill.svelte | 2 +- src/components/SchemaViewer.svelte | 4 +- src/components/icons/InfoIcon.svelte | 4 +- src/components/tabs/Tab.svelte | 2 +- src/components/tabs/TabContent.svelte | 2 +- src/pages/AppDetail.svelte | 6 +- src/pages/AppList.svelte | 4 +- src/pages/MetricDetail.svelte | 4 +- src/pages/PingDetail.svelte | 4 +- src/pages/TableDetail.svelte | 4 +- stories/Pagination.svelte | 2 +- 51 files changed, 1608 insertions(+), 176 deletions(-) delete mode 100644 public/fonts/Inter-Bold.woff delete mode 100644 public/fonts/Inter-Bold.woff2 delete mode 100644 public/fonts/Inter-BoldItalic.woff delete mode 100644 public/fonts/Inter-BoldItalic.woff2 delete mode 100644 public/fonts/Inter-Italic.woff delete mode 100644 public/fonts/Inter-Italic.woff2 delete mode 100644 public/fonts/Inter-Regular.woff delete mode 100644 public/fonts/Inter-Regular.woff2 delete mode 100644 public/fonts/Metropolis-Bold.woff delete mode 100644 public/fonts/Metropolis-Bold.woff2 delete mode 100644 public/fonts/Metropolis-Medium.woff delete mode 100644 public/fonts/Metropolis-Medium.woff2 delete mode 100644 public/fonts/ZillaSlab-Bold.woff delete mode 100644 public/fonts/ZillaSlab-Bold.woff2 delete mode 100644 public/fonts/ZillaSlab-BoldItalic.woff delete mode 100644 public/fonts/ZillaSlab-BoldItalic.woff2 delete mode 100644 public/fonts/ZillaSlab-Regular.woff delete mode 100644 public/fonts/ZillaSlab-Regular.woff2 delete mode 100644 public/fonts/ZillaSlab-RegularItalic.woff delete mode 100644 public/fonts/ZillaSlab-RegularItalic.woff2 create mode 100644 public/glean_logo.png delete mode 100644 public/img/logos/glean_logo_bw.png delete mode 100644 public/img/logos/mozilla/white.png delete mode 100644 public/img/logos/mozilla/white.svg delete mode 100644 public/img/logos/mozilla/white@2x.png delete mode 100644 public/img/logos/mozilla/white@3x.png rename src/components/{Title.svelte => PageTitle.svelte} (100%) diff --git a/.eslintrc.js b/.eslintrc.js index c013bcf0c..d19656888 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -58,6 +58,11 @@ module.exports = { // https://github.com/sveltejs/eslint-plugin-svelte3/issues/41#issuecomment-572503966 "no-multiple-empty-lines": ["error", { max: 2, maxBOF: 2, maxEOF: 0 }], }, + + // Eslint only allows regular CSS inside
- + <PageTitle text={'Schema'} /> <FilterInput onChangeText={filterTextChanged} filterText={searchText} /> <div class="schema-browser"> diff --git a/src/components/icons/InfoIcon.svelte b/src/components/icons/InfoIcon.svelte index 72fee82c6..fd48337e9 100644 --- a/src/components/icons/InfoIcon.svelte +++ b/src/components/icons/InfoIcon.svelte @@ -1,8 +1,8 @@ <style> svg { display: inline-block; - width: $spacing-md; - color: $color-dark-gray-50; + width: 15px; + color: $color-light-gray-50; } </style> diff --git a/src/components/tabs/Tab.svelte b/src/components/tabs/Tab.svelte index a401ac00a..74517afc1 100644 --- a/src/components/tabs/Tab.svelte +++ b/src/components/tabs/Tab.svelte @@ -11,13 +11,13 @@ <style> .title { + @include text-title-3xs; border-top-width: 0px; border-top-left-radius: 0.5rem; border-top-right-radius: 0.5rem; padding: 1rem; background-color: $color-light-gray-10; display: inline-block; - @include text-title-3xs; &.active { background-color: $color-light-gray-40; } diff --git a/src/components/tabs/TabContent.svelte b/src/components/tabs/TabContent.svelte index a9914077e..deeefc9fb 100644 --- a/src/components/tabs/TabContent.svelte +++ b/src/components/tabs/TabContent.svelte @@ -5,7 +5,7 @@ const activeTab = getContext("activeTab"); </script> -<style lang="scss"> +<style> .box { padding: 2rem; border: 1px solid $color-light-gray-40; diff --git a/src/pages/AppDetail.svelte b/src/pages/AppDetail.svelte index ec2075cdf..72ca0c84b 100644 --- a/src/pages/AppDetail.svelte +++ b/src/pages/AppDetail.svelte @@ -7,7 +7,7 @@ import NotFound from "../components/NotFound.svelte"; import Pill from "../components/Pill.svelte"; import { TabGroup, Tab, TabContent } from "../components/tabs"; - import Title from "../components/Title.svelte"; + import PageTitle from "../components/PageTitle.svelte"; export let params; @@ -29,7 +29,7 @@ </style> {#await appDataPromise then app} - <Title text={params.app} /> + <PageTitle text={params.app} /> {#if app.deprecated} <Pill message="Deprecated" bgColor="#4a5568" /> @@ -37,7 +37,7 @@ <p>{app.description}</p> <table class="mzp-u-data-table"> <tr> - <td>Source Code URL</td> + <td>Source Code</td> <td><a href={app.url}>{app.url}</a></td> </tr> <tr> diff --git a/src/pages/AppList.svelte b/src/pages/AppList.svelte index ba589aade..b0d8d508f 100644 --- a/src/pages/AppList.svelte +++ b/src/pages/AppList.svelte @@ -2,7 +2,7 @@ import { onMount } from "svelte"; import FilterInput from "../components/FilterInput.svelte"; import Pill from "../components/Pill.svelte"; - import Title from "../components/Title.svelte"; + import PageTitle from "../components/PageTitle.svelte"; import { fetchJSON } from "../state/api"; const URL = "data/apps.json"; @@ -36,7 +36,7 @@ } </style> -<Title text="Applications" /> +<PageTitle text="Applications" /> <div class="deprecation-checkbox"> <label> diff --git a/src/pages/MetricDetail.svelte b/src/pages/MetricDetail.svelte index 9721e0032..4ac5f398d 100644 --- a/src/pages/MetricDetail.svelte +++ b/src/pages/MetricDetail.svelte @@ -5,7 +5,7 @@ import NotFound from "../components/NotFound.svelte"; import HelpHoverable from "../components/HelpHoverable.svelte"; import helpText from "../data/help"; - import Title from "../components/Title.svelte"; + import PageTitle from "../components/PageTitle.svelte"; export let params; let metricName = params.metric.replaceAll("-", "."); @@ -66,7 +66,7 @@ </style> {#await metricDataPromise then metric} - <Title text={metric.name} /> + <PageTitle text={metric.name} /> <p> <Markdown text={metric.description} /> </p> diff --git a/src/pages/PingDetail.svelte b/src/pages/PingDetail.svelte index 1ec941265..f02e25cfc 100644 --- a/src/pages/PingDetail.svelte +++ b/src/pages/PingDetail.svelte @@ -5,7 +5,7 @@ import ItemList from "../components/ItemList.svelte"; import NotFound from "../components/NotFound.svelte"; import Markdown from "../components/Markdown.svelte"; - import Title from "../components/Title.svelte"; + import PageTitle from "../components/PageTitle.svelte"; export let params; const pingDataPromise = getPingData(params.app, params.ping); @@ -26,7 +26,7 @@ </style> {#await pingDataPromise then ping} - <Title text={ping.name} /> + <PageTitle text={ping.name} /> <table class="mzp-u-data-table"> <tr> <td>Description</td> diff --git a/src/pages/TableDetail.svelte b/src/pages/TableDetail.svelte index 241b40494..4dcead4f5 100644 --- a/src/pages/TableDetail.svelte +++ b/src/pages/TableDetail.svelte @@ -4,7 +4,7 @@ import { fetchJSON, getTableData } from "../state/api"; import NotFound from "../components/NotFound.svelte"; - import Title from "../components/Title.svelte"; + import PageTitle from "../components/PageTitle.svelte"; export let params; export let queryString; @@ -38,7 +38,7 @@ </style> {#await pingDataPromise then data} - <Title text={`Table <code>${data.table.name}</code> for ${params.app}`} /> + <PageTitle text={`Table <code>${data.table.name}</code> for ${params.app}`} /> <table class="mzp-u-data-table"> <tr> <td>BigQuery Definition</td> diff --git a/stories/Pagination.svelte b/stories/Pagination.svelte index 83a68d4bc..f747bc937 100644 --- a/stories/Pagination.svelte +++ b/stories/Pagination.svelte @@ -65,8 +65,8 @@ display: flex; justify-content: center; .page { - height: 3rem; @include text-body-md; + height: 3rem; font-weight: bold; margin: $spacing-sm; cursor: pointer;