이브위키:연습장/대문: 두 판 사이의 차이

← 이전 편집 다음 편집 →

시각위키텍스트

2023년 6월 3일 (토) 23:13 판

이브위키는 지금...

업데이트 : 2025년 12월 11일 06:41

328전체 가입자

4,228전체 문서 수

@@ 1번째 줄: / 1번째 줄: @@
 <div class="main">
-<div class="WikiInfo padding-30">
+<div class="wiki-info">
+<div class="card-item"><div class="card-item-content"><div class="card-title">이브위키는 지금...</div></div><div class="card-item-append"><span class="text-body-2">업데이트 : {{LOCALYEAR}}년 {{LOCALMONTH1}}월 {{LOCALDAY}}일 {{LOCALTIME}}</span></div></div>
+<div class="card-text" style="padding-top: 0;">
 <div class="flex-row">
-<div class="flex-col-4"><div class="flex">
+<div class="flex-col-2"><div class="flex">
 <div class="avatar text-info" style="width: 42px; height: 42px; margin-inline-end: 12px;"><html>
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="font-size: 24px; height: 24px; width: 24px;">
@@ 9번째 줄: / 11번째 줄: @@
 <div class="flex flex-column"><span class="text-h6 font-weight-500">{{NUMBEROFUSERS}}</span><span class="text-caption">전체 가입자</span></div>
 </div></div>
-<div class="flex-col-4"><div class="flex">
+<div class="flex-col-2"><div class="flex">
 <div class="avatar text-danger" style="width: 42px; height: 42px; margin-inline-end: 12px;"><html>
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="font-size: 24px; height: 24px; width: 24px;">
@@ 19번째 줄: / 21번째 줄: @@
 <div class="flex flex-column"><span class="text-h6 font-weight-500">{{문서수}}</span><span class="text-caption">전체 문서 수</span></div>
 </div></div>
+</div>
 </div>
 </div>
@@ 27번째 줄: / 30번째 줄: @@
      width: 100%;
 }
-.WikiInfo {
+.wiki-info {
      width: 100%;
+    border-radius: 6px;
+    box-shadow: 0 3px 9px 1px rgba(50, 50, 50, .03),0 9px 8px rgba(50, 50, 50, .02),0 1px 6px 4px rgba(50, 50, 50, .01);
 }
-.padding-10 {
+.card-text {
-     padding: 10px;
+    flex: 1 1 auto;
+    font-size: 1rem;
+    font-weight: 400;
+    padding: 24px;
+}
+.card-item {
+    align-items: center;
+    display: grid;
+    flex: none;
+    grid-template-areas: "prepend content append";
+    grid-template-columns: max-content auto max-content;
+    padding: 24px;
+}
+.card-item-content {
+    align-self: center;
+    grid-area: content;
+    overflow: hidden;
+}
+.card-title {
+     padding: 0;
+    line-height: 1.65rem;
+}
+.card-title {
+    display: block;
+    font-size: 1.25rem;
+    font-weight: 500;
+    word-break: normal;
+    word-wrap: break-word;
 }
-.padding-20 {
+.card-item-append {
-     padding: 20px;
+    grid-area: append;
+     padding-inline-start: 1rem;
 }
-.padding-30 {
+.text-body-2 {
-     padding: 30px;
+     font-size: .875rem !important;
+    font-weight: 400;
+    line-height: 1.5;
+    opacity: 0.65;
 }
@@ 64번째 줄: / 100번째 줄: @@
      flex: 0 0 25%;
      max-width: 25%;
+}
+.flex-col-2, .flex-col-3, .flex-col-4 {
+    width: 100%;
+    padding: 12px;
 }