Skip to content

Commit

Permalink
Update Hobby.tsx
Browse files Browse the repository at this point in the history
  • Loading branch information
@aoiacai
aoiacai authored Jun 9, 2024
1 parent 6801284 commit 4a42202
Showing 1 changed file with 22 additions and 17 deletions.
39 changes: 22 additions & 17 deletions app/components/Hobby.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,33 +6,38 @@ import { Avatar, Link, Typography } from '@mui/material';
const Hobby: React.FC = () => {
return (
<div className='profile' id='hobby' style={{ paddingTop: '20px' }}>
<Typography style={{ fontSize: '7vh', padding: '5vh' }}>Hobby</Typography>
<Typography style={{ fontSize: '12vmin', padding: '4vmin' }}>Hobby</Typography>
<div className='text-area'>
<div className='text_and_icon'>
<div style={{ display: 'block' }}>
<Typography style={{ fontSize: '2vh', color: 'cyan' }}>GAME</Typography>
<div className='centerClass'>
<Typography style={{ fontSize: '3vmin', color: 'cyan' }}>GAME</Typography>
</div>
<div style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'space-evenly' }}>
<Typography style={{ fontSize: '3vh' }}>stardew valley</Typography>
<Typography style={{ fontSize: '3vh' }}>AtCoder</Typography>
<Typography style={{ fontSize: '4vmin' }}>stardew valley</Typography>
<Typography style={{ fontSize: '4vmin' }}>AtCoder</Typography>
</div>

<Typography style={{ fontSize: '2vh', color: 'cyan' }}>COMIC</Typography>
<div style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'space-evenly' }}>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>結界師</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>サマータイムレンダ</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>チ。</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>呪術廻戦</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>エヴァンゲリオン</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>不滅のあなたへ</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>ダンジョン飯</Typography>
<Typography style={{ fontSize: '3vh', paddingLeft: '1vh', paddingRight: '1vh' }}>etc.</Typography>
<div className='centerClass'>
<Typography style={{ fontSize: '3vmin', color: 'cyan' }}>COMIC</Typography>
</div>
<div style={{ display: 'flex', flexWrap: 'wrap', justifyContent: 'space-evenly', gap: '3vmin' }}>
<div style={{ fontSize: '4vmin' }}>結界師</div>
<div style={{ fontSize: '4vmin' }}>サマータイムレンダ</div>
<div style={{ fontSize: '4vmin' }}>チ。</div>
<div style={{ fontSize: '4vmin' }}>呪術廻戦</div>
<div style={{ fontSize: '4vmin' }}>エヴァンゲリオン</div>
<div style={{ fontSize: '4vmin' }}>不滅のあなたへ</div>
<div style={{ fontSize: '4vmin' }}>ダンジョン飯</div>
<div style={{ fontSize: '4vmin' }}>etc.</div>
</div>


<Typography style={{ fontSize: '2vh', color: 'cyan' }}>Music</Typography>
<div className='centerClass'>
<Typography style={{ fontSize: '3vmin', color: 'cyan' }}>Music</Typography>
</div>
<div style={{ display: 'flex', justifyContent: 'space-around', flexWrap: 'wrap' }}>

<iframe style={{ borderRadius: '12px' }} src="https://open.spotify.com/embed/track/6UHwmfYfRm445uyyM9HO3o?utm_source=generator" width="100%" height="352" frameBorder="0" allowFullScreen={true} allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
<iframe style={{ borderRadius: '12px', maxWidth: "90%", height: '30vh' }} src="https://open.spotify.com/embed/track/6UHwmfYfRm445uyyM9HO3o?utm_source=generator" width="100%" height="352" frameBorder="0" allowFullScreen={true} allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"></iframe>
</div>
</div>
</div>
Expand Down

0 comments on commit 4a42202

Please sign in to comment.