fixed resizing and added css from mon patcher so it looks prettier
This commit is contained in:
@ -137,7 +137,7 @@ const Page = async () => {
|
|||||||
<TabsContent value="HotPlays">
|
<TabsContent value="HotPlays">
|
||||||
<ChunithmHotPlays chuniProfileHotPlays={HotChuniPlays} />
|
<ChunithmHotPlays chuniProfileHotPlays={HotChuniPlays} />
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
<TabsContent value="Patcher">
|
<TabsContent className="" value="Patcher">
|
||||||
<Patcher />
|
<Patcher />
|
||||||
</TabsContent>
|
</TabsContent>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
|
@ -328,3 +328,38 @@ video {
|
|||||||
.avatar_item_l img {
|
.avatar_item_l img {
|
||||||
transform: translate(-100px, 0px);
|
transform: translate(-100px, 0px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.icons {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fit, 180px);
|
||||||
|
grid-auto-flow: dense;
|
||||||
|
align-items: stretch;
|
||||||
|
margin: 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.gameicon,
|
||||||
|
.patchContainer {
|
||||||
|
border-radius: 2px;
|
||||||
|
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||||
|
color: inherit;
|
||||||
|
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.gameicon {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
text-decoration: none;
|
||||||
|
margin: 15px;
|
||||||
|
width: 144px;
|
||||||
|
padding: 10px;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
label.gameicon {
|
||||||
|
cursor: pointer;
|
||||||
|
background: #fffcf0;
|
||||||
|
}
|
||||||
|
@ -11,7 +11,7 @@ const Patcher = () => {
|
|||||||
<link rel="stylesheet" href="/patcher/css/style.css" />
|
<link rel="stylesheet" href="/patcher/css/style.css" />
|
||||||
</Head>
|
</Head>
|
||||||
|
|
||||||
<div className="grid grid-cols-1 place-items-center gap-6 pt-8 md:grid-cols-4">
|
<div className="icons">
|
||||||
<Link href="/patcher/chuni.html" className="gameicon">
|
<Link href="/patcher/chuni.html" className="gameicon">
|
||||||
<Image
|
<Image
|
||||||
src="/patcher/img/chu/ni01.png"
|
src="/patcher/img/chu/ni01.png"
|
||||||
@ -92,13 +92,11 @@ const Patcher = () => {
|
|||||||
height={120}
|
height={120}
|
||||||
/>
|
/>
|
||||||
</Link>
|
</Link>
|
||||||
|
|
||||||
<Link href="/patcher/chuniparadise.html" className="gameicon">
|
<Link href="/patcher/chuniparadise.html" className="gameicon">
|
||||||
<div className="image-wrapper">
|
<div className="image-wrapper">
|
||||||
<Image
|
<Image
|
||||||
src="/patcher/img/chu/ni11paradise.png"
|
src="/patcher/img/chu/ni11paradise.png"
|
||||||
alt="CHUNITHM PARADISE"
|
alt="CHUNITHM PARADISE"
|
||||||
className="image"
|
|
||||||
width={120}
|
width={120}
|
||||||
height={120}
|
height={120}
|
||||||
/>
|
/>
|
||||||
@ -109,7 +107,6 @@ const Patcher = () => {
|
|||||||
<Image
|
<Image
|
||||||
src="/patcher/img/chu/ni11paradiselost.png"
|
src="/patcher/img/chu/ni11paradiselost.png"
|
||||||
alt="CHUNITHM PARADISE LOST"
|
alt="CHUNITHM PARADISE LOST"
|
||||||
className="image-hover"
|
|
||||||
width={120}
|
width={120}
|
||||||
height={120}
|
height={120}
|
||||||
/>
|
/>
|
||||||
|
@ -25,7 +25,8 @@ export const ChunithmHotPlays: FC<ChunithmProfileHotPlays> = ({
|
|||||||
chuniProfileHotPlays,
|
chuniProfileHotPlays,
|
||||||
}) => {
|
}) => {
|
||||||
return (
|
return (
|
||||||
<div className="grid grid-cols-1 gap-2 md:grid-cols-8">
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
|
||||||
|
{" "}
|
||||||
{chuniProfileHotPlays.hotRating.map((playerHotRatingList, index) => {
|
{chuniProfileHotPlays.hotRating.map((playerHotRatingList, index) => {
|
||||||
const jacketPath = playerHotRatingList.jacketPath?.replace(
|
const jacketPath = playerHotRatingList.jacketPath?.replace(
|
||||||
".dds",
|
".dds",
|
||||||
|
@ -30,7 +30,8 @@ export const ChunithmTopPlays: FC<chunithmTopPlays> = ({
|
|||||||
chuniProfileTopPlays,
|
chuniProfileTopPlays,
|
||||||
}) => {
|
}) => {
|
||||||
return (
|
return (
|
||||||
<div className="grid grid-cols-1 gap-2 md:grid-cols-8">
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
|
||||||
|
{" "}
|
||||||
{chuniProfileTopPlays.topPlays.map((chuniProfileTopPlays, index) => {
|
{chuniProfileTopPlays.topPlays.map((chuniProfileTopPlays, index) => {
|
||||||
const jacketPath = chuniProfileTopPlays.jacketPath?.replace(
|
const jacketPath = chuniProfileTopPlays.jacketPath?.replace(
|
||||||
".dds",
|
".dds",
|
||||||
|
Reference in New Issue
Block a user