diff --git a/src/components/atoms/SecondaryLabel.tsx b/src/components/atoms/SecondaryLabel.tsx new file mode 100644 index 00000000..9206214a --- /dev/null +++ b/src/components/atoms/SecondaryLabel.tsx @@ -0,0 +1,25 @@ +/** @jsxImportSource theme-ui */ +import { Text } from '@theme-ui/components' +import React from 'react' + +interface SeconadryLabelProps { + children: React.ReactNode +} + +const SecondaryLabel = ({ children }: SeconadryLabelProps) => { + return ( + + {children} + + ) +} + +export default SecondaryLabel diff --git a/src/components/pages/SingleStigmataPage.tsx b/src/components/pages/SingleStigmataPage.tsx index 39588c3c..9a4b58b5 100644 --- a/src/components/pages/SingleStigmataPage.tsx +++ b/src/components/pages/SingleStigmataPage.tsx @@ -1,12 +1,13 @@ /** @jsxImportSource theme-ui */ import { StigmataData, StigmataSet } from '../../lib/honkai3rd/stigmata' import Image from 'next/image' -import { Box, Heading, Text, Paragraph, Card, Flex } from '@theme-ui/components' +import { Box, Heading, Paragraph, Card, Flex } from '@theme-ui/components' import PageLink from '../../components/atoms/PageLink' import StigmataCard from '../../components/molecules/StigmataCard' import Breadcrumb from '../../components/organisms/Breadcrumb' import Honkai3rdNavigator from '../../components/organisms/Honkai3rdNavigator' import { capitalize } from '../../lib/string' +import SecondaryLabel from '../atoms/SecondaryLabel' export interface SingleStigmataPageProps { type: 'single' @@ -72,15 +73,15 @@ const SingleStigmataPage = ({ {stigmataSet != null && ( - - - {stigmataSet.name} - -
- - Set - -
+ + + + {stigmataSet.name} + + + Set + + { return ( - - - {stigmataSetItem.name} - - -
- + + + + {stigmataSetItem.name} + + + {capitalize(stigmataSetItem.type)} - -
+ + HP : {stigmataSetItem.hp} / ATK : {stigmataSetItem.atk} / DEF : {stigmataSetItem.def} / CRT : {stigmataSetItem.crt} diff --git a/src/pages/honkai3rd/battlesuits/[battlesuitId].tsx b/src/pages/honkai3rd/battlesuits/[battlesuitId].tsx index 8578c05b..74d7c89f 100644 --- a/src/pages/honkai3rd/battlesuits/[battlesuitId].tsx +++ b/src/pages/honkai3rd/battlesuits/[battlesuitId].tsx @@ -6,6 +6,7 @@ import React from 'react' import BattlesuitFeatureLabel from '../../../components/atoms/BattlesuitFeatureLabel' import BattlesuitRankIcon from '../../../components/atoms/BattlesuitRankIcon' import PageLink from '../../../components/atoms/PageLink' +import SecondaryLabel from '../../../components/atoms/SecondaryLabel' import TypeLabel from '../../../components/atoms/TypeLabel' import ValkyrieLabel from '../../../components/atoms/ValkyrieLabel' import Breadcrumb from '../../../components/organisms/Breadcrumb' @@ -179,18 +180,17 @@ const BattlesuitSkillGroupCard = ({ }: BattlesuitSkillGroupCardProps) => { return ( - - {skillGroup.core.name} -
- - {heading} - -
+ + {skillGroup.core.name} + + {heading} +
{skillGroup.core.description} diff --git a/src/pages/honkai3rd/elfs/[elfId].tsx b/src/pages/honkai3rd/elfs/[elfId].tsx index 001ead4f..c91b00bf 100644 --- a/src/pages/honkai3rd/elfs/[elfId].tsx +++ b/src/pages/honkai3rd/elfs/[elfId].tsx @@ -1,9 +1,10 @@ /** @jsxImportSource theme-ui */ -import { Box, Card, Flex, Heading, Paragraph, Text } from '@theme-ui/components' +import { Box, Card, Flex, Heading, Paragraph } from '@theme-ui/components' import { NextPageContext } from 'next' import Image from 'next/image' import React from 'react' import BattlesuitFeatureLabel from '../../../components/atoms/BattlesuitFeatureLabel' +import SecondaryLabel from '../../../components/atoms/SecondaryLabel' import Breadcrumb from '../../../components/organisms/Breadcrumb' import Honkai3rdNavigator from '../../../components/organisms/Honkai3rdNavigator' import { ElfData } from '../../../lib/honkai3rd/elfs' @@ -78,17 +79,7 @@ const ElfShowPage = ({ elf }: ElfShowPageProps) => { > {item.name} - - {capitalize(item.type)} - + {capitalize(item.type)}