From 8f55069a02140a693486d17e8a5f36133632155c Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Wed, 25 Jan 2023 22:34:38 -0800 Subject: [PATCH] Remove static modals --- components/AboutModal/index.scss | 98 -------------- components/AboutModal/index.tsx | 196 --------------------------- components/ChangelogModal/index.scss | 77 ----------- components/ChangelogModal/index.tsx | 166 ----------------------- components/RoadmapModal/index.scss | 118 ---------------- components/RoadmapModal/index.tsx | 101 -------------- 6 files changed, 756 deletions(-) delete mode 100644 components/AboutModal/index.scss delete mode 100644 components/AboutModal/index.tsx delete mode 100644 components/ChangelogModal/index.scss delete mode 100644 components/ChangelogModal/index.tsx delete mode 100644 components/RoadmapModal/index.scss delete mode 100644 components/RoadmapModal/index.tsx diff --git a/components/AboutModal/index.scss b/components/AboutModal/index.scss deleted file mode 100644 index a1c82a2c..00000000 --- a/components/AboutModal/index.scss +++ /dev/null @@ -1,98 +0,0 @@ -.About.DialogContent { - gap: 0; - padding-bottom: $unit; - - .content { - display: flex; - flex-direction: column; - gap: $unit-2x; - padding: 0 $unit-4x; - } - - .sections { - display: flex; - flex-direction: column; - gap: $unit-2x; - } - - section { - margin-bottom: $unit; - - & > h2 { - font-size: $font-medium; - font-weight: $medium; - margin-bottom: $unit * 3; - } - } - - p { - color: var(--text-secondary); - font-size: $font-regular; - line-height: 1.3; - margin-bottom: $unit; - - &:last-of-type { - margin-bottom: 0; - } - } - - .Links { - display: grid; - gap: $unit; - margin: $unit-2x 0; - } - - div.LinkItem { - margin-top: $unit-2x; - } - - .LinkItem { - $diameter: $unit-6x; - border: 1px solid var(--link-item-bg); - border-radius: $card-corner; - - &:hover { - background-color: var(--link-item-bg); - - svg { - fill: var(--link-item-image-color-hover); - } - } - - a { - display: flex; - padding: $unit-2x; - - &:hover { - text-decoration: none; - } - - .Left { - align-items: center; - display: flex; - gap: $unit-2x; - flex-grow: 1; - - h3 { - font-weight: 600; - max-width: 70%; - line-height: 1.3; - } - } - - svg { - fill: var(--link-item-image-color); - width: $diameter; - height: auto; - - &.ShareIcon { - width: $unit-4x; - } - } - } - - h3 { - font-weight: $bold; - } - } -} diff --git a/components/AboutModal/index.tsx b/components/AboutModal/index.tsx deleted file mode 100644 index 7935befd..00000000 --- a/components/AboutModal/index.tsx +++ /dev/null @@ -1,196 +0,0 @@ -import React from 'react' -import Link from 'next/link' -import { useTranslation } from 'next-i18next' - -import { - Dialog, - DialogClose, - DialogTitle, - DialogTrigger, -} from '~components/Dialog' -import DialogContent from '~components/DialogContent' - -import CrossIcon from '~public/icons/Cross.svg' -import ShareIcon from '~public/icons/Share.svg' -import DiscordIcon from '~public/icons/discord.svg' -import GithubIcon from '~public/icons/github.svg' - -import './index.scss' - -const AboutModal = () => { - const { t } = useTranslation('common') - const headerRef = React.createRef() - - return ( - - -
  • - {t('modals.about.title')} -
  • -
    - event.preventDefault()} - onEscapeKeyDown={() => {}} - > -
    - {t('menu.about')} - - - - - -
    - -
    -
    -

    - Granblue.team is a tool to save and share team comps for{' '} - - Granblue Fantasy - - . -

    -

    - Start adding to a team and a URL will be created for you to share - wherever you like, no account needed. -

    -

    - However, if you do make an account, you can save any teams you - find for future reference and keep all of your teams together in - one place. -

    -
    - -
    -

    Feedback

    -

    - This is an evolving project so feedback and suggestions are - greatly appreciated! -

    -

    - If you have a feature request, would like to report a bug, or are - enjoying the tool and want to say thanks, come hang out in - Discord! -

    - -
    - -
    -

    Credits

    -

    - Granblue.team was built by{' '} - - @jedmund - {' '} - with a lot of help from{' '} - - @lalalalinna - {' '} - and{' '} - - @tarngerine - - . -

    -

    - Many thanks also go to Disinfect, Slipper, Jif, Bless, 9highwind, - and everyone else in{' '} - - Fireplace - {' '} - that helped with bug testing and feature requests. (P.S. - We're recruiting!) And yoey, but he won't join our crew. -

    -
    - -
    -

    Contributing

    -

    - This app is open source and licensed under{' '} - - GNU AGPLv3 - - . Plainly, that means you can download the source, modify it, and - redistribute it if you attribute this project, use the same - license, and keep it open source. You can contribute on Github. -

    - -
    -
    -
    -
    - ) -} - -export default AboutModal diff --git a/components/ChangelogModal/index.scss b/components/ChangelogModal/index.scss deleted file mode 100644 index 5d63d501..00000000 --- a/components/ChangelogModal/index.scss +++ /dev/null @@ -1,77 +0,0 @@ -.Changelog.DialogContent { - gap: 0; - - .updates { - padding: 0 $unit-4x; - } - - .updates { - display: flex; - flex-direction: column; - gap: $unit-4x; - margin-bottom: $unit-4x; - } - - .version { - &.content { - .top h3 { - color: var(--accent-yellow); - } - - .update { - display: flex; - flex-direction: column; - gap: $unit-2x; - } - - .characters, - .weapons, - .summons { - display: grid; - grid-template-rows: 1fr auto; - gap: $unit; - - & > h4 { - font-weight: $medium; - font-size: $font-regular; - } - } - - .items { - display: grid; - grid-template-columns: 1fr 1fr 1fr; - gap: $unit-4x; - } - } - - .top { - align-items: baseline; - display: flex; - gap: $unit-half; - margin-bottom: $unit-2x; - - h3 { - color: var(--accent-blue); - font-weight: $medium; - font-size: $font-large; - } - - time { - color: var(--text-secondary); - font-size: $font-small; - font-weight: $medium; - } - } - } - - .notes { - color: var(--text-primary); - list-style-type: disc; - list-style-position: inside; - - li { - margin-bottom: $unit-half; - font-size: $font-regular; - } - } -} diff --git a/components/ChangelogModal/index.tsx b/components/ChangelogModal/index.tsx deleted file mode 100644 index 5ba0677f..00000000 --- a/components/ChangelogModal/index.tsx +++ /dev/null @@ -1,166 +0,0 @@ -import React from 'react' -import { useTranslation } from 'next-i18next' - -import ChangelogUnit from '~components/ChangelogUnit' -import { - Dialog, - DialogClose, - DialogTitle, - DialogTrigger, -} from '~components/Dialog' -import DialogContent from '~components/DialogContent' - -import CrossIcon from '~public/icons/Cross.svg' - -import './index.scss' - -const ChangelogModal = () => { - const { t } = useTranslation('common') - const headerRef = React.createRef() - - return ( - - -
  • - {t('modals.changelog.title')} -
  • -
    - event.preventDefault()} - onEscapeKeyDown={() => {}} - > -
    - - {t('menu.changelog')} - - - - - - -
    - -
    -
    -
    -

    1.0.1

    - -
    -
      -
    • Extra party fields: Full Auto, Clear Time, and more
    • -
    • Support for Youtube short URLs
    • -
    • Responsive grids and lots of other mobile fixes
    • -
    • Many other bug fixes
    • -
    -
    -
    -
    -

    2022-12 Legend Festival

    - -
    -
    -
    -

    New characters

    -
    - - - -
    -
    -
    -

    New weapons

    -
    - - - -
    -
    -
    -

    New summons

    -
    - -
    -
    -
    -
    -
    -
    -

    2022-12 Flash Gala

    - -
    -
    -
    -

    New characters

    -
    - - -
    -
    -
    -

    New weapons

    -
    - - -
    -
    -
    -
    -
    -
    -

    1.0.0

    - -
    -
      -
    • First release!
    • -
    • You can embed Youtube videos now
    • -
    • Better clicking - right-click and open in a new tab
    • -
    • Manually set dark mode in Account Settings
    • -
    • Lots of bugs squashed
    • -
    -
    -
    -
    -
    - ) -} - -export default ChangelogModal diff --git a/components/RoadmapModal/index.scss b/components/RoadmapModal/index.scss deleted file mode 100644 index ad57a3b0..00000000 --- a/components/RoadmapModal/index.scss +++ /dev/null @@ -1,118 +0,0 @@ -.Roadmap.DialogContent { - gap: 0; - padding-bottom: $unit-2x; - - h3.priority { - font-weight: $medium; - font-size: $font-large; - margin-bottom: $unit-4x; - - &.in_progress { - color: $yellow; - } - - &.high { - color: $red; - } - - &.mid { - color: $orange-10; - } - - &.low { - color: $blue; - } - } - - .content { - display: flex; - flex-direction: column; - gap: $unit-2x; - padding: 0 $unit-4x; - - section.notes { - display: flex; - flex-direction: column; - gap: $unit; - margin-bottom: $unit-2x; - - p { - margin-bottom: $unit; - } - - .LinkItem { - $diameter: $unit-6x; - border: 1px solid var(--link-item-bg); - border-radius: $card-corner; - - &:hover { - background-color: var(--link-item-bg); - - svg { - fill: var(--link-item-image-color-hover); - } - } - - a { - display: flex; - padding: $unit-2x; - - &:hover { - text-decoration: none; - } - - .Left { - align-items: center; - display: flex; - gap: $unit-2x; - flex-grow: 1; - } - - svg { - fill: var(--link-item-image-color); - width: $diameter; - height: auto; - - &.ShareIcon { - width: $unit-4x; - } - } - } - - h3 { - font-weight: $bold; - max-width: 70%; - line-height: 1.3; - } - } - } - - p { - color: var(--text-secondary); - - font-size: $font-regular; - line-height: 1.3; - } - - ul { - color: var(--text-primary); - list-style-type: none; - - li { - display: flex; - flex-direction: column; - gap: $unit; - margin-bottom: $unit-2x; - - h4 { - font-size: $font-medium; - font-weight: $bold; - } - - p { - font-size: $font-regular; - } - } - } - } -} diff --git a/components/RoadmapModal/index.tsx b/components/RoadmapModal/index.tsx deleted file mode 100644 index 0c956bc1..00000000 --- a/components/RoadmapModal/index.tsx +++ /dev/null @@ -1,101 +0,0 @@ -import React from 'react' -import Link from 'next/link' -import { useTranslation } from 'next-i18next' -import { - Dialog, - DialogClose, - DialogTitle, - DialogTrigger, -} from '~components/Dialog' -import DialogContent from '~components/DialogContent' - -import CrossIcon from '~public/icons/Cross.svg' -import ShareIcon from '~public/icons/Share.svg' -import GithubIcon from '~public/icons/github.svg' - -import './index.scss' - -const RoadmapModal = () => { - const { t } = useTranslation('roadmap') - const headerRef = React.createRef() - - return ( - - -
  • - {t('modals.roadmap.title')} -
  • -
    - event.preventDefault()} - onEscapeKeyDown={() => {}} - > -
    - {t('title')} - - - - - -
    - -
    -
    -

    {t('blurb')}

    -

    {t('link.intro')}

    - -
    - -
    -

    {t('subtitle')}

    -
      -
    • -

      {t('roadmap.item1.title')}

      -

      {t('roadmap.item1.description')}

      -
    • -
    • -

      {t('roadmap.item2.title')}

      -

      {t('roadmap.item2.description')}

      -
    • -
    • -

      {t('roadmap.item3.title')}

      -

      {t('roadmap.item3.description')}

      -
    • -
    • -

      {t('roadmap.item4.title')}

      -

      {t('roadmap.item4.description')}

      -
    • -
    • -

      {t('roadmap.item5.title')}

      -

      {t('roadmap.item5.description')}

      -
    • -
    • -

      {t('roadmap.item6.title')}

      -

      {t('roadmap.item6.description')}

      -
    • -
    -
    -
    -
    -
    - ) -} - -export default RoadmapModal