사용자:BANIP/낙서장: 두 판 사이의 차이

@@ 1번째 줄: / 1번째 줄: @@
-*<!--파일:123test.png-->
+{{#css:
-*<!--파일:456test.png|200px|left-->
+    .gamebody{
-*[[파일:Generic Camera Icon.svg|link=]]
+        background:hsl(200, 100%, 90%);
-*[[파일:1000번양아치.png]]
+        container: gamemain / inline-size;
-*파일:1000번양아치.png
+        --color-skyblue: hsl(200, 100%, 80%);
-*{{틀|파일:456test.png|200px|left}}
+        --color-skyblue-light: hsl(200, 100%, 90%);
-*파일:789test.png
+        --color-rose: hsl(330, 100%, 80%);
+    }
+    .game{
+        height: 100%;
+    }
+    .game.lobby, .game.result{
+        display:flex; flex-direction:column; justify-content:center; align-items:center;
+        justify-content: space-around;
+    }
+    .game .title{
+        -webkit-text-stroke:4px white;
+        font-size: 18cqw;
+        font-weight: bold;
+    }
+    .game .title .skyblue{
+        color: var(--color-skyblue);
+    }
+    .game .title .rose{
+        color: var(--color-rose);
+    }
+    .game .btn{
+        font-size: 4cqw;
+        color: #fff;
+        font-weight: bold;
+        border: 4px solid #fff;
+        padding: 8px 16px;
+        border-radius: 8px;
+        background: var(--color-skyblue);
+        transition: 0.2s all;
+        cursor: pointer;
+    }
+    .game.play .bg{
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background-color: rgba(0,0,0, 0.5);
+        background-size: cover;
+        background-position: center;
+        display:flex;
+        justify-content:center;
+        align-items:center;
+    }
+    .game.play{
+        display:grid;
+        grid-template-rows: 30px 1fr;
+    }
+    .game .timer{
+        text-align:center;
+    }
+    .game .btn:hover{
+        background: var(--color-skyblue-light);
+        transform: scale(1.1);
+    }
+    .game .btn-wrapper{
+        display:flex; flex-direction:row; justify-content:center; align-items:center; gap: 16px;
+    }
+}}
+{{플러그인X|/스크립트}}

2023년 8월 12일 (토) 03:13 판