diff --git a/components/AccountModal/index.tsx b/components/AccountModal/index.tsx index d3e1b615..c5da21ef 100644 --- a/components/AccountModal/index.tsx +++ b/components/AccountModal/index.tsx @@ -80,6 +80,10 @@ const AccountModal = (props: Props) => { // const [privateProfile, setPrivateProfile] = useState(false) // Setup + const [pictureOpen, setPictureOpen] = useState(false) + const [genderOpen, setGenderOpen] = useState(false) + const [languageOpen, setLanguageOpen] = useState(false) + const [themeOpen, setThemeOpen] = useState(false) // UI management function openChange(open: boolean) { @@ -87,16 +91,10 @@ const AccountModal = (props: Props) => { } function openSelect(name: 'picture' | 'gender' | 'language' | 'theme') { - const stateVars = selectOpenState - Object.keys(stateVars).forEach((key) => { - if (key === name) { - stateVars[name] = true - } else { - stateVars[key] = false - } - }) - - setSelectOpenState(stateVars) + setPictureOpen(name === 'picture' ? !pictureOpen : false) + setGenderOpen(name === 'gender' ? !genderOpen : false) + setLanguageOpen(name === 'language' ? !languageOpen : false) + setThemeOpen(name === 'theme' ? !themeOpen : false) } // Event handlers @@ -117,6 +115,14 @@ const AccountModal = (props: Props) => { setAppTheme(value) } + function onEscapeKeyDown(event: KeyboardEvent) { + if (pictureOpen || genderOpen || languageOpen || themeOpen) { + return event.preventDefault() + } else { + setOpen(false) + } + } + // API calls function update(event: React.FormEvent) { event.preventDefault() @@ -189,9 +195,10 @@ const AccountModal = (props: Props) => { description={t('modals.settings.descriptions.picture')} className="Image" label={t('modals.settings.labels.picture')} - open={selectOpenState.picture} - onClick={() => openSelect('picture')} + open={pictureOpen} + onOpenChange={() => openSelect('picture')} onChange={handlePictureChange} + onClose={() => setPictureOpen(false)} imageAlt={t('modals.settings.labels.image_alt')} imageClass={pictureData.find((i) => i.filename === picture)?.element} imageSrc={[`/profile/${picture}.png`, `/profile/${picture}@2x.png 2x`]} @@ -206,9 +213,10 @@ const AccountModal = (props: Props) => { name="gender" description={t('modals.settings.descriptions.gender')} label={t('modals.settings.labels.gender')} - open={selectOpenState.gender} - onClick={() => openSelect('gender')} + open={genderOpen} + onOpenChange={() => openSelect('gender')} onChange={handleGenderChange} + onClose={() => setGenderOpen(false)} value={`${gender}`} > @@ -224,9 +232,10 @@ const AccountModal = (props: Props) => { openSelect('language')} + open={languageOpen} + onOpenChange={() => openSelect('language')} onChange={handleLanguageChange} + onClose={() => setLanguageOpen(false)} value={language} > @@ -242,9 +251,10 @@ const AccountModal = (props: Props) => { openSelect('theme')} + open={themeOpen} + onOpenChange={() => openSelect('theme')} onChange={handleThemeChange} + onClose={() => setThemeOpen(false)} value={theme} > @@ -274,7 +284,11 @@ const AccountModal = (props: Props) => { {t('menu.settings')} - + {}} + onEscapeKeyDown={onEscapeKeyDown} + >
diff --git a/components/AwakeningSelect/index.tsx b/components/AwakeningSelect/index.tsx index ed01ccfb..eb6158bb 100644 --- a/components/AwakeningSelect/index.tsx +++ b/components/AwakeningSelect/index.tsx @@ -17,6 +17,7 @@ interface Props { object: 'character' | 'weapon' awakeningType?: number awakeningLevel?: number + onOpenChange: (open: boolean) => void sendValidity: (isValid: boolean) => void sendValues: (type: number, level: number) => void } @@ -81,6 +82,11 @@ const AwakeningSelect = (props: Props) => { // Classes function changeOpen() { setOpen(!open) + props.onOpenChange(!open) + } + + function onClose() { + props.onOpenChange(false) } function generateOptions(object: 'character' | 'weapon') { @@ -165,7 +171,8 @@ const AwakeningSelect = (props: Props) => { value={`${awakeningType}`} open={open} onValueChange={handleSelectChange} - onClick={() => changeOpen()} + onOpenChange={() => changeOpen()} + onClose={onClose} triggerClass="modal" > {generateOptions(props.object)} diff --git a/components/AxSelect/index.tsx b/components/AxSelect/index.tsx index 5c33def7..01c9c17e 100644 --- a/components/AxSelect/index.tsx +++ b/components/AxSelect/index.tsx @@ -20,6 +20,7 @@ interface ErrorMap { interface Props { axType: number currentSkills?: SimpleAxSkill[] + onOpenChange: (index: 1 | 2, open: boolean) => void sendValidity: (isValid: boolean) => void sendValues: ( primaryAxModifier: number, @@ -193,9 +194,22 @@ const AXSelect = (props: Props) => { : undefined } - function openSelect(ref: ForwardedRef) { - if (ref === primaryAxModifierSelect) setOpenAX1(!openAX1) - if (ref === secondaryAxModifierSelect) setOpenAX2(!openAX2) + function openSelect(index: 1 | 2) { + if (index === 1) { + setOpenAX1(!openAX1) + setOpenAX2(false) + props.onOpenChange(1, !openAX1) + props.onOpenChange(2, false) + } else if (index === 2) { + setOpenAX2(!openAX2) + setOpenAX1(false) + props.onOpenChange(2, !openAX2) + props.onOpenChange(1, false) + } + } + + function onClose(index: 1 | 2) { + props.onOpenChange(index, false) } function generateOptions(modifierSet: number) { @@ -392,8 +406,9 @@ const AXSelect = (props: Props) => { key="ax1" value={`${primaryAxModifier}`} open={openAX1} + onClose={() => onClose(1)} + onOpenChange={() => openSelect(1)} onValueChange={handleAX1SelectChange} - onClick={() => openSelect(primaryAxModifierSelect)} triggerClass="modal" > {generateOptions(0)} @@ -419,8 +434,9 @@ const AXSelect = (props: Props) => { key="ax2" value={`${secondaryAxModifier}`} open={openAX2} + onClose={() => onClose(2)} + onOpenChange={() => openSelect(2)} onValueChange={handleAX2SelectChange} - onClick={() => openSelect(secondaryAxModifierSelect)} triggerClass="modal" ref={secondaryAxModifierSelect} > diff --git a/components/CharLimitedFieldset/index.scss b/components/CharLimitedFieldset/index.scss index b1bd3c6e..f465a160 100644 --- a/components/CharLimitedFieldset/index.scss +++ b/components/CharLimitedFieldset/index.scss @@ -17,6 +17,10 @@ // box-shadow: 0 2px rgba(255, 255, 255, 1); } + .Input { + padding: $unit * 1.5 $unit-2x; + } + .Counter { color: $grey-55; font-weight: $bold; diff --git a/components/Dialog/index.tsx b/components/Dialog/index.tsx index fb58acd8..54a0be03 100644 --- a/components/Dialog/index.tsx +++ b/components/Dialog/index.tsx @@ -8,7 +8,10 @@ interface Props extends React.DetailedHTMLProps< React.DialogHTMLAttributes, HTMLDivElement - > {} + > { + onEscapeKeyDown: (event: KeyboardEvent) => void + onOpenAutoFocus: (event: Event) => void +} export const DialogContent = React.forwardRef( function dialog({ children, ...props }, forwardedRef) { @@ -25,6 +28,8 @@ export const DialogContent = React.forwardRef( {children} diff --git a/components/FilterBar/index.tsx b/components/FilterBar/index.tsx index dfaec65b..e145b12c 100644 --- a/components/FilterBar/index.tsx +++ b/components/FilterBar/index.tsx @@ -60,12 +60,18 @@ const FilterBar = (props: Props) => { props.onFilter({ raidSlug: slug }) } + function onSelectChange(name: 'element' | 'recency') { + setElementOpen(name === 'element' ? !elementOpen : false) + setRecencyOpen(name === 'recency' ? !recencyOpen : false) + } + return (
{props.children} void + onOpenChange?: () => void onValueChange?: (value: string) => void + onClose?: () => void triggerClass?: string } @@ -24,8 +25,13 @@ const Select = React.forwardRef(function Select( props: Props, forwardedRef ) { + const [open, setOpen] = useState(false) const [value, setValue] = useState('') + useEffect(() => { + setOpen(props.open) + }, [props.open]) + useEffect(() => { if (props.value && props.value !== '') setValue(`${props.value}`) else setValue('') @@ -36,10 +42,27 @@ const Select = React.forwardRef(function Select( if (props.onValueChange) props.onValueChange(newValue) } + function onCloseAutoFocus() { + setOpen(false) + if (props.onClose) props.onClose() + } + + function onEscapeKeyDown() { + setOpen(false) + if (props.onClose) props.onClose() + } + + function onPointerDownOutside() { + setOpen(false) + if (props.onClose) props.onClose() + } + return ( (function Select( - + diff --git a/components/SelectTableField/index.tsx b/components/SelectTableField/index.tsx index 6ee80dd9..cea99ce7 100644 --- a/components/SelectTableField/index.tsx +++ b/components/SelectTableField/index.tsx @@ -15,8 +15,9 @@ interface Props { imageClass?: string imageSrc?: string[] children: React.ReactNode - onClick: () => void + onOpenChange: () => void onChange: (value: string) => void + onClose: () => void } const SelectTableField = (props: Props) => { @@ -53,8 +54,9 @@ const SelectTableField = (props: Props) => { diff --git a/components/WeaponModal/index.tsx b/components/WeaponModal/index.tsx index 796de3d4..8fb178ae 100644 --- a/components/WeaponModal/index.tsx +++ b/components/WeaponModal/index.tsx @@ -4,7 +4,13 @@ import { useRouter } from 'next/router' import { useTranslation } from 'next-i18next' import { AxiosResponse } from 'axios' -import * as Dialog from '@radix-ui/react-dialog' +import { + Dialog, + DialogClose, + DialogContent, + DialogTitle, + DialogTrigger, +} from '~components/Dialog' import AXSelect from '~components/AxSelect' import AwakeningSelect from '~components/AwakeningSelect' @@ -74,6 +80,14 @@ const WeaponModal = (props: Props) => { const [weaponKey2Id, setWeaponKey2Id] = useState('') const [weaponKey3Id, setWeaponKey3Id] = useState('') + const [weaponKey1Open, setWeaponKey1Open] = useState(false) + const [weaponKey2Open, setWeaponKey2Open] = useState(false) + const [weaponKey3Open, setWeaponKey3Open] = useState(false) + const [weaponKey4Open, setWeaponKey4Open] = useState(false) + const [ax1Open, setAx1Open] = useState(false) + const [ax2Open, setAx2Open] = useState(false) + const [awakeningOpen, setAwakeningOpen] = useState(false) + useEffect(() => { setElement(props.gridWeapon.element) @@ -188,16 +202,35 @@ const WeaponModal = (props: Props) => { ) } + function openSelect(index: 1 | 2 | 3 | 4) { + setWeaponKey1Open(index === 1 ? !weaponKey1Open : false) + setWeaponKey2Open(index === 2 ? !weaponKey2Open : false) + setWeaponKey3Open(index === 3 ? !weaponKey3Open : false) + setWeaponKey4Open(index === 4 ? !weaponKey4Open : false) + } + + function receiveAxOpen(index: 1 | 2, isOpen: boolean) { + if (index === 1) setAx1Open(isOpen) + if (index === 2) setAx2Open(isOpen) + } + + function receiveAwakeningOpen(isOpen: boolean) { + setAwakeningOpen(isOpen) + } + const keySelect = () => { return (

{t('modals.weapon.subtitles.weapon_keys')}

{[2, 3, 17, 22].includes(props.gridWeapon.object.series) ? ( openSelect(1)} onChange={receiveWeaponKey} + onClose={() => setWeaponKey1Open(false)} /> ) : ( '' @@ -205,10 +238,13 @@ const WeaponModal = (props: Props) => { {[2, 3, 17].includes(props.gridWeapon.object.series) ? ( openSelect(2)} onChange={receiveWeaponKey} + onClose={() => setWeaponKey2Open(false)} /> ) : ( '' @@ -216,10 +252,13 @@ const WeaponModal = (props: Props) => { {props.gridWeapon.object.series == 17 ? ( openSelect(3)} onChange={receiveWeaponKey} + onClose={() => setWeaponKey3Open(false)} /> ) : ( '' @@ -228,10 +267,13 @@ const WeaponModal = (props: Props) => { {props.gridWeapon.object.series == 24 && props.gridWeapon.object.uncap.ulb ? ( openSelect(4)} onChange={receiveWeaponKey} + onClose={() => setWeaponKey4Open(false)} /> ) : ( '' @@ -247,6 +289,7 @@ const WeaponModal = (props: Props) => { @@ -262,6 +305,7 @@ const WeaponModal = (props: Props) => { object="weapon" awakeningType={props.gridWeapon.awakening?.type} awakeningLevel={props.gridWeapon.awakening?.level} + onOpenChange={receiveAwakeningOpen} sendValidity={receiveValidity} sendValues={receiveAwakeningValues} /> @@ -278,49 +322,64 @@ const WeaponModal = (props: Props) => { setOpen(open) } + const anySelectOpen = + weaponKey1Open || + weaponKey2Open || + weaponKey3Open || + weaponKey4Open || + ax1Open || + ax2Open || + awakeningOpen + + function onEscapeKeyDown(event: KeyboardEvent) { + if (anySelectOpen) { + return event.preventDefault() + } else { + setOpen(false) + } + } + return ( // TODO: Refactor into Dialog component - - {props.children} - - event.preventDefault()} - > -
-
- - {t('modals.weapon.title')} - - - {props.gridWeapon.object.name[locale]} - -
- - - - - + + {props.children} + event.preventDefault()} + onEscapeKeyDown={onEscapeKeyDown} + > +
+
+ + {t('modals.weapon.title')} + + + {props.gridWeapon.object.name[locale]} +
+ + + + + +
-
- {props.gridWeapon.object.element == 0 ? elementSelect() : ''} - {[2, 3, 17, 24].includes(props.gridWeapon.object.series) - ? keySelect() - : ''} - {props.gridWeapon.object.ax > 0 ? axSelect() : ''} - {props.gridWeapon.awakening ? awakeningSelect() : ''} -
- - - - +
+ {props.gridWeapon.object.element == 0 ? elementSelect() : ''} + {[2, 3, 17, 24].includes(props.gridWeapon.object.series) + ? keySelect() + : ''} + {props.gridWeapon.object.ax > 0 ? axSelect() : ''} + {props.gridWeapon.awakening ? awakeningSelect() : ''} +
+ + ) } diff --git a/components/WeaponResult/index.tsx b/components/WeaponResult/index.tsx index 3ea17f6c..28fc780b 100644 --- a/components/WeaponResult/index.tsx +++ b/components/WeaponResult/index.tsx @@ -25,33 +25,6 @@ const Proficiency = [ 'gun', 'katana', ] -const Series = [ - 'seraphic', - 'grand', - 'opus', - 'draconic', - 'revenant', - 'primal', - 'beast', - 'regalia', - 'omega', - 'olden_primal', - 'hollowsky', - 'xeno', - 'astral', - 'rose', - 'ultima', - 'bahamut', - 'epic', - 'ennead', - 'cosmos', - 'ancestral', - 'superlative', - 'vintage', - 'class_champion', - 'sephira', - 'new_world_foundation', -] const WeaponResult = (props: Props) => { const router = useRouter() diff --git a/components/WeaponSearchFilterBar/index.tsx b/components/WeaponSearchFilterBar/index.tsx index e75f6ec4..09047988 100644 --- a/components/WeaponSearchFilterBar/index.tsx +++ b/components/WeaponSearchFilterBar/index.tsx @@ -15,12 +15,8 @@ import { emptyRarityState, emptyWeaponSeriesState, } from '~utils/emptyStates' -import { - elements, - proficiencies, - rarities, - weaponSeries, -} from '~utils/stateValues' +import { elements, proficiencies, rarities } from '~utils/stateValues' +import { weaponSeries } from '~utils/weaponSeries' interface Props { sendFilters: (filters: { [key: string]: number[] }) => void @@ -128,6 +124,45 @@ const WeaponSearchFilterBar = (props: Props) => { props.sendFilters(filters) } + const renderWeaponSeries = () => { + const numColumns = 3 + return ( + + {Array.from({ length: numColumns }, () => 0).map((x, i) => { + return renderWeaponSeriesGroup(i) + })} + + ) + } + + const renderWeaponSeriesGroup = (index: number) => { + return ( + + {weaponSeries + .slice( + index * Math.ceil(weaponSeries.length / 3), + (index + 1) * Math.ceil(weaponSeries.length / 3) + ) + .map((x, i) => { + return renderSingleWeaponSeries(x.id, x.slug) + })} + + ) + } + + const renderSingleWeaponSeries = (id: number, slug: string) => { + return ( + + {t(`series.${slug}`)} + + ) + } + useEffect(() => { sendFilters() }, [rarityState, elementState, proficiencyState, seriesState]) @@ -254,58 +289,7 @@ const WeaponSearchFilterBar = (props: Props) => { {t('filters.labels.series')} -
- - {Array.from(Array(weaponSeries.length / 3)).map((x, i) => { - return ( - - {t(`series.${weaponSeries[i]}`)} - - ) - })} - - - {Array.from(Array(weaponSeries.length / 3)).map((x, i) => { - return ( - - {t(`series.${weaponSeries[i + weaponSeries.length / 3]}`)} - - ) - })} - - - {Array.from(Array(weaponSeries.length / 3)).map((x, i) => { - return ( - - {t( - `series.${weaponSeries[i + 2 * (weaponSeries.length / 3)]}` - )} - - ) - })} - -
+
{renderWeaponSeries()}
) diff --git a/components/WeaponUnit/index.tsx b/components/WeaponUnit/index.tsx index 2baba499..5a59c138 100644 --- a/components/WeaponUnit/index.tsx +++ b/components/WeaponUnit/index.tsx @@ -11,7 +11,6 @@ import Button from '~components/Button' import type { SearchableObject } from '~types' -import { appState } from '~utils/appState' import { axData } from '~utils/axData' import { weaponAwakening } from '~utils/awakening' @@ -341,9 +340,9 @@ const WeaponUnit = (props: Props) => { } else return } - function passUncapData(uncap: number) { + function passUncapData(index: number) { if (props.gridWeapon) - props.updateUncap(props.gridWeapon.id, props.position, uncap) + props.updateUncap(props.gridWeapon.id, props.position, index) } function canBeModified(gridWeapon: GridWeapon) { diff --git a/pages/[username].tsx b/pages/[username].tsx index 0767c736..215a201c 100644 --- a/pages/[username].tsx +++ b/pages/[username].tsx @@ -246,15 +246,27 @@ const ProfileRoute: React.FC = (props: Props) => { return (
- @{props.user?.username}'s Teams + {/* HTML */} + + {t('page.titles.profile', { username: props.user?.username })} + + + {/* OpenGraph */} = (props: Props) => { /> + {/* Twitter */} = (props: Props) => { + // Import translations + const { t } = useTranslation('common') + + // Set up router + const router = useRouter() + const locale = + router.locale && ['en', 'ja'].includes(router.locale) ? router.locale : 'en' + useEffect(() => { persistStaticData() }, [persistStaticData]) @@ -34,7 +47,65 @@ const PartyRoute: React.FC = (props: Props) => { appState.weaponKeys = props.weaponKeys } - return + function generateTitle() { + const teamName = + props.party && props.party.name ? props.party.name : t('no_title') + const username = props.party + ? `@${props.party.user.username}` + : t('no_user') + + const title = t('page.titles.team', { + username: username, + teamName: teamName, + emoji: props.meta.element, + }) + + return title + } + + return ( + + + + {/* HTML */} + {generateTitle()} + + + {/* OpenGraph */} + + + + + + {/* Twitter */} + + + + + + + ) } export const getServerSidePaths = async () => { @@ -80,6 +151,31 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex console.log('No party code') } + function getElement() { + if (party) { + const mainhand = party.weapons.find((weapon) => weapon.mainhand) + if (mainhand && mainhand.object.element === 0) { + return mainhand.element + } else { + return mainhand?.object.element + } + } else { + return 0 + } + } + + function elementEmoji() { + const element = getElement() + + if (element === 0) return '⚪' + if (element === 1) return '🟢' + if (element === 2) return '🔴' + if (element === 3) return '🔵' + if (element === 4) return '🟤' + if (element === 5) return '🟣' + if (element === 6) return '🟡' + } + return { props: { party: party, @@ -88,6 +184,9 @@ export const getServerSideProps = async ({ req, res, locale, query }: { req: Nex raids: raids, sortedRaids: sortedRaids, weaponKeys: weaponKeys, + meta: { + element: elementEmoji() + }, ...(await serverSideTranslations(locale, ['common'])), // Will be passed to the page component as props }, diff --git a/pages/saved.tsx b/pages/saved.tsx index 90fdc6ff..2d5609d2 100644 --- a/pages/saved.tsx +++ b/pages/saved.tsx @@ -288,15 +288,15 @@ const SavedRoute: React.FC = (props: Props) => { return (
- {t('saved.title')} + {t('page.titles.saved')} - + - + = (props: Props) => { return (
- {t('teams.title')} + {/* HTML */} + {t('page.titles.discover')} + - + {/* OpenGraph */} + + {/* Twitter */} - + diff --git a/public/locales/en/common.json b/public/locales/en/common.json index 483638e1..3343da00 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -100,7 +100,7 @@ "bahamut": "Bahamut", "epic": "Epic", "ennead": "Ennead", - "cosmos": "Cosmos", + "cosmic": "Cosmic", "ancestral": "Ancestral", "superlative": "Superlative", "vintage": "Vintage", @@ -109,7 +109,8 @@ "new_world": "New World Foundation", "revenant": "Revenant", "proving": "Proving Grounds", - "disaster": "Disaster" + "disaster": "Disaster", + "illustrious": "Illustrious" }, "recency": { "all_time": "All time", @@ -277,6 +278,19 @@ "loading": "Loading teams...", "not_found": "No teams found" }, + "page": { + "titles": { + "discover": "Discover teams", + "profile": "@{{username}}'s Teams / granblue.team", + "team": "{{emoji}} {{teamName}} by {{username}} / granblue.team", + "saved": "Your saved teams" + }, + "descriptions": { + "discover": "Save and discover teams to use in Granblue Fantasy and search by raid, element or recency", + "profile": "Browse @{{username}}'s Teams and filter by raid, element or recency", + "team": "Browse this team for {{raidName}} by {{username}} and others on granblue.team" + } + }, "job_skills": { "all": "All skills", "buffing": "Buffing", @@ -294,5 +308,6 @@ "coming_soon": "Coming Soon", "no_title": "Untitled", "no_raid": "No raid", - "no_user": "Anonymous" + "no_user": "Anonymous", + "no_job": "No class" } diff --git a/public/locales/ja/common.json b/public/locales/ja/common.json index 3a5813b5..5f4a1e8d 100644 --- a/public/locales/ja/common.json +++ b/public/locales/ja/common.json @@ -100,7 +100,7 @@ "bahamut": "バハムートウェポン", "epic": "エピックウェポン", "ennead": "エニアドシリーズ", - "cosmos": "コスモスシリーズ", + "cosmic": "コスモスシリーズ", "ancestral": "アンセスタルシリーズ", "superlative": "スペリオシリーズ", "vintage": "ヴィンテージシリーズ", @@ -109,7 +109,8 @@ "new_world": "新世界の礎", "revenant": "天星器", "proving": "ブレイブグラウンド", - "disaster": "災害シリーズ" + "disaster": "災害シリーズ", + "luminous": "ルミナス" }, "recency": { "all_time": "全ての期間", @@ -278,6 +279,19 @@ "loading": "ロード中...", "not_found": "編成は見つかりませんでした" }, + "page": { + "titles": { + "discover": "編成を見出す", + "profile": "@{{username}}さんの作った編成", + "team": "{{emoji}} {{teamName}}、{{username}}さんから / granblue.team", + "saved": "保存した編成" + }, + "descriptions": { + "discover": "グランブルーファンタジーの編成をマルチ、属性、作った時間などで探したり保存したりできる", + "profile": "@{{username}}の編成を調査し、マルチ、属性、または作った時間でフィルターする", + "team": "granblue.teamで{{username}}さんが作った{{raidName}}の編成を調査できる" + } + }, "job_skills": { "all": "全てのアビリティ", "buffing": "強化アビリティ", @@ -291,9 +305,10 @@ "no_skill": "設定されていません" } }, - "extra_weapons": "Additional
Weapons", + "extra_weapons": "Additional Weapons", "coming_soon": "開発中", "no_title": "無題", "no_raid": "マルチなし", - "no_user": "無名" + "no_user": "無名", + "no_job": "ジョブなし" } diff --git a/styles/globals.scss b/styles/globals.scss index 7de3fc7f..1d9a0a7e 100644 --- a/styles/globals.scss +++ b/styles/globals.scss @@ -33,27 +33,27 @@ a { text-decoration: none; &.wind { - color: $wind-text-10; + color: var(--wind-bg); } &.fire { - color: $fire-text-10; + color: var(--fire-bg); } &.water { - color: $water-text-10; + color: var(--water-bg); } &.earth { - color: $earth-text-10; + color: var(--earth-bg); } &.dark { - color: $dark-text-10; + color: var(--dark-bg); } &.light { - color: $light-text-10; + color: var(--light-bg); } } @@ -69,7 +69,7 @@ h1, h2, h3, p { - color: $grey-15; + color: var(--text-primary); } h1 { diff --git a/styles/themes.scss b/styles/themes.scss index 4871bb75..acc5dfd8 100644 --- a/styles/themes.scss +++ b/styles/themes.scss @@ -7,6 +7,8 @@ --card-bg: #{$grey-100}; --bar-bg: #{$grey-100}; + --link-text-hover: #{$text--link--hover--light}; + // Light - Menus --dialog-bg: #{$dialog--bg--light}; @@ -120,6 +122,8 @@ --card-bg: #{$page--element--bg--dark}; --bar-bg: #{$grey-10}; + --link-text-hover: #{$text--link--hover--dark}; + // Dark - Dialogs --dialog-bg: #{$dialog--bg--dark}; diff --git a/styles/variables.scss b/styles/variables.scss index f0bec0fe..17ba813a 100644 --- a/styles/variables.scss +++ b/styles/variables.scss @@ -55,6 +55,7 @@ $orange-10: #6b401b; $orange-30: #825b39; $orange-40: #925a2a; $orange-50: #a8703f; +$orange-70: #d08f57; $orange-80: #facea7; $orange-90: #ffebd9; @@ -213,7 +214,7 @@ $subaura--orange--bg--dark: $orange-10; $subaura--orange--card--bg--dark: $orange-30; $subaura--orange--primary--dark: $orange-00; $subaura--orange--secondary--dark: $orange-10; -$subaura--orange--text--dark: $orange-00; +$subaura--orange--text--dark: $orange-70; // Color Definitions: Element Toggle $toggle--bg--light: $grey-90; @@ -235,6 +236,9 @@ $text--tertiary--color--dark: $grey-50; $text--tertiary--hover--light: $grey-40; $text--tertiary--hover--dark: $grey-70; +$text--link--hover--light: $grey-40; +$text--link--hover--dark: $grey-100; + // Color Definitions: Icon $icon--secondary--color--light: $grey-70; $icon--secondary--color--dark: $grey-50; diff --git a/types/WeaponSeries.d.ts b/types/WeaponSeries.d.ts index a9b8581e..d5fba384 100644 --- a/types/WeaponSeries.d.ts +++ b/types/WeaponSeries.d.ts @@ -17,7 +17,7 @@ interface WeaponSeriesState { astral: CheckedState epic: CheckedState ennead: CheckedState - cosmos: CheckedState + cosmic: CheckedState ancestral: CheckedState superlative: CheckedState vintage: CheckedState diff --git a/utils/appState.tsx b/utils/appState.tsx index 58ffaf70..c898c0de 100644 --- a/utils/appState.tsx +++ b/utils/appState.tsx @@ -80,8 +80,8 @@ export const initialAppState: AppState = { extra: false, user: undefined, favorited: false, - created_at: new Date().toISOString(), - updated_at: new Date().toISOString(), + created_at: '', + updated_at: '', }, grid: { weapons: { diff --git a/utils/emptyStates.tsx b/utils/emptyStates.tsx index ae134f44..f0e3270e 100644 --- a/utils/emptyStates.tsx +++ b/utils/emptyStates.tsx @@ -100,12 +100,16 @@ export const emptyWeaponSeriesState: WeaponSeriesState = { id: 3, checked: false, }, - ultima: { - id: 17, + revenant: { + id: 4, checked: false, }, - bahamut: { - id: 16, + primal: { + id: 6, + checked: false, + }, + beast: { + id: 7, checked: false, }, regalia: { @@ -116,10 +120,6 @@ export const emptyWeaponSeriesState: WeaponSeriesState = { id: 9, checked: false, }, - primal: { - id: 6, - checked: false, - }, olden_primal: { id: 10, checked: false, @@ -128,26 +128,30 @@ export const emptyWeaponSeriesState: WeaponSeriesState = { id: 11, checked: false, }, - beast: { - id: 7, - checked: false, - }, - rose: { - id: 15, + hollowsky: { + id: 12, checked: false, }, xeno: { id: 13, checked: false, }, - hollowsky: { - id: 12, - checked: false, - }, astral: { id: 14, checked: false, }, + rose: { + id: 15, + checked: false, + }, + bahamut: { + id: 16, + checked: false, + }, + ultima: { + id: 17, + checked: false, + }, epic: { id: 18, checked: false, @@ -156,7 +160,7 @@ export const emptyWeaponSeriesState: WeaponSeriesState = { id: 19, checked: false, }, - cosmos: { + cosmic: { id: 20, checked: false, }, @@ -176,6 +180,10 @@ export const emptyWeaponSeriesState: WeaponSeriesState = { id: 24, checked: false, }, + proving: { + id: 25, + checked: false, + }, sephira: { id: 28, checked: false, @@ -184,6 +192,14 @@ export const emptyWeaponSeriesState: WeaponSeriesState = { id: 29, checked: false, }, + disaster: { + id: 30, + checked: false, + }, + illustrious: { + id: 31, + checked: false, + }, } export const emptyPaginationObject = { diff --git a/utils/weaponSeries.tsx b/utils/weaponSeries.tsx index 5c53e65c..84b7b9f8 100644 --- a/utils/weaponSeries.tsx +++ b/utils/weaponSeries.tsx @@ -116,4 +116,8 @@ export const weaponSeries: WeaponSeries[] = [ id: 30, slug: 'disaster', }, + { + id: 31, + slug: 'illustrious', + }, ]