더시드위키
최근 변경최근 토론
특수 기능

Aidenk/test(비교)

보기RAWBlame되돌리기비교
r15 vs r16
11
{{{#!style
2
.stel-tab-container {
3
margin: 20px auto; max-width: 540px;
4
border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 35px; overflow: hidden;
5
background-color: #ff9a8b !important;
6
background-image:
7
radial-gradient(rgba(255, 255, 255, 0.15) 1px, transparent 1px),
8
linear-gradient(45deg in oklch, rgba(255,255,255,0.03) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.03) 75%, rgba(255,255,255,0.03)),
9
linear-gradient(160deg in oklch, #ffd3b6 0%, #ffaaa5 40%, #d4a5ff 80%, #a29bfe 100%) !important;
10
background-size: 15px 15px, 30px 30px, 100% 100%;
11
box-shadow: 0 25px 50px rgba(255, 154, 139, 0.4);
12
}
13
.stel-tab-nav {
14
display: flex; justify-content: center; background: rgba(0,0,0,0.1); backdrop-filter: blur(5px);
15
}
16
.stel-tab-btn {
17
padding: 12px 20px; font-weight: bold; font-size: 14px; color: #fff !important;
18
}
19
.stel-content-box {
20
padding: 10px; text-align: center; background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(5px);
21
}
22
.m-badge-slim {
23
display: inline-block; padding: 2px 10px; margin: 3px 1.5px; border-radius: 3px;
24
font-size: 12px; font-weight: 800; color: #5a4fcf !important;
25
background: linear-gradient(to bottom in oklch, #fff, #f5f5ff);
26
border: 1px solid rgba(255, 255, 255, 0.8);
27
box-shadow: 0 3px 6px rgba(0,0,0,0.05);
28
}
29
}}}
30
31
{{{#!wiki class="stel-tab-container"
32
{{{#!wiki class="stel-tab-nav"
33
[[#tab1|{{{#!wiki class="stel-tab-btn" style="border-bottom: 3px solid #fff;"
34
1기생}}}]] [[#tab2|{{{#!wiki class="stel-tab-btn" style="opacity: 0.6;"
35
2기생}}}]] [[#tab3|{{{#!wiki class="stel-tab-btn" style="opacity: 0.6;"
36
3기생}}}]]}}}
37
{{{#!wiki class="stel-content-box"
38
{{{#!wiki style="display: block;" id="tab1"
39
[[파일:스텔 1기.png|width=100%]]
40
{{{#!wiki style="margin-top: 15px; line-height: 0.1;"
41
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8182b8;"
42
[[아이리 칸나|칸나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #A2D0EF;"
43
[[아야츠노 유니|유니]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #60497f;"
44
[[사키하네 후야|후야]]}}}
45
}}}
46
}}}
47
{{{#!wiki style="display: none;" id="tab2"
48
[[파일:스텔 2기.png|width=100%]]
49
{{{#!wiki style="margin-top: 15px; line-height: 0.1;"
50
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #9EB5EE;"
51
[[아라하시 타비|타비]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #610A09;"
52
[[아카네 리제|리제]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #ff9680;"
53
[[시라유키 히나|히나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #65686a;"
54
[[네네코 마시로|시로]]}}}
55
}}}
56
}}}
57
{{{#!wiki style="display: none;" id="tab3"
58
[[파일:스텔 3기.png|width=100%]]
59
{{{#!wiki style="margin-top: 15px; line-height: 0.1;"
60
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
61
[[텐코 시부키|부키]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #BAC0E6;"
62
[[아오쿠모 린|린]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8fe0b0;"
63
[[유즈하 리코|리코]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
64
[[하나코 나나|나나]]}}}
65
}}}
66
}}}
67
}}}
68
}}}
69
70
[목차]
71
[clearfix]
72
== 망작1 gemini 작품 ==
73
{{{#!style
74
table.stel-tab-perfect {
75
width: 420px; max-width: 100%; margin: 20px auto;
2
table.stel-tab-slim {
3
width: 320px; max-width: 100%; margin: 0 auto;
764
border-collapse: collapse; table-layout: fixed;
775
}
78
79
/* 상단 버튼 영역: 420px 전체를 3등분 */
80
table.stel-tab-perfect > thead {
6
table.stel-tab-slim > thead {
817
display: table; width: 100%;
828
}
83
table.stel-tab-perfect > thead > tr {
9
table.stel-tab-slim > thead > tr {
8410
display: table-row;
8511
}
86
table.stel-tab-perfect > thead > tr > th {
87
display: table-cell; width: 33.33%; /* 3개 버튼이 정확히 가로를 꽉 채움 */
88
padding: 20px 0 !important; /* 위아래로 더 크게 */
12
table.stel-tab-slim > thead > tr > th {
13
display: table-cell; width: 33.33%;
14
padding: 10px 0 !important;
8915
border: 2px solid #9A95BA; border-bottom: none;
90
background: #fff; color: #9A95BA; font-size: 17px; /* 글자도 더 크게 */
16
background: #fff; color: #9A95BA; font-size: 13px;
9117
font-weight: bold; cursor: pointer; text-align: center;
9218
box-sizing: border-box;
9319
}
94
95
/* 모서리 둥글게 */
96
table.stel-tab-perfect > thead > tr > th:first-child { border-radius: 12px 0 0 0; }
97
table.stel-tab-perfect > thead > tr > th:last-child { border-radius: 0 12px 0 0; }
98
99
/* 선택된 버튼 활성화 */
100
table.stel-tab-perfect > thead > tr > th.header-sort-up,
101
table.stel-tab-perfect > thead > tr > th.header-sort-down,
102
table.stel-tab-perfect > thead > tr > th[aria-sort] {
20
table.stel-tab-slim > thead > tr > th:first-child { border-radius: 6px 0 0 0; }
21
table.stel-tab-slim > thead > tr > th:last-child { border-radius: 0 6px 0 0; }
22
table.stel-tab-slim > thead > tr > th.header-sort-up,
23
table.stel-tab-slim > thead > tr > th.header-sort-down,
24
table.stel-tab-slim > thead > tr > th[aria-sort] {
10325
background: #9A95BA !important; color: #fff !important;
10426
}
105
106
/* 하단 본문 박스 */
107
table.stel-tab-perfect > tbody {
108
display: block; width: 420px;
27
table.stel-tab-slim > tbody {
28
display: block; width: 320px; margin: 0; padding: 0;
10929
}
110
table.stel-tab-perfect > tbody > tr:nth-of-type(n+2) { display: none; }
111
table.stel-tab-perfect > tbody > tr > td { display: none; padding: 0; border: none !important; }
112
table.stel-tab-perfect > tbody > tr > td.content {
113
display: block !important; width: 420px; min-height: 400px;
114
border: 2px solid #9A95BA !important; border-radius: 0 0 15px 15px;
30
table.stel-tab-slim > tbody > tr:nth-of-type(n+2) { display: none; }
31
table.stel-tab-slim > tbody > tr > td { display: none; padding: 0; border: none !important; }
32
table.stel-tab-slim > tbody > tr > td.content {
33
display: block !important; width: 320px; min-height: 200px;
34
border: 2px solid #9A95BA !important; border-radius: 0 0 6px 6px;
11535
background: linear-gradient(160deg in oklch, #ffd3b6 0%, #ffaaa5 40%, #d4a5ff 80%, #a29bfe 100%) !important;
116
box-sizing: border-box;
36
box-sizing: border-box; margin: 0;
11737
}
118
119
.inner-box { padding: 25px 15px; text-align: center; }
38
.inner-box { padding: 10px 5px; text-align: center; }
12039
.m-badge-slim {
121
display: inline-block; padding: 4px 12px; margin: 4px 2px; border-radius: 5px;
122
font-size: 13px; font-weight: 800; color: #5a4fcf !important; background: #fff;
40
display: inline-block; padding: 1px 6px; margin: 2px 1px; border-radius: 3px;
41
font-size: 10px; font-weight: 800; color: #5a4fcf !important; background: #fff;
12342
border: 1px solid #9A95BA;
12443
}
12544
}}}
126
||<thead><sortable><tableclass=stel-tab-perfect> 1기생 ||<sortable> 2기생 ||<sortable> 3기생 ||
45
||<thead><sortable><tableclass=stel-tab-slim> 1기생 ||<sortable> 2기생 ||<sortable> 3기생 ||
12746
||<class=content> 0{{{#!wiki class="inner-box"
12847
[[파일:스텔 1기.png|width=100%]]
129
{{{#!wiki style="margin-top: 20px;"
130
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8182b8;"
131
[[아이리 칸나|칸나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #A2D0EF;"
132
[[아야츠노 유니|유니]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #60497f;"
48
{{{#!wiki style="margin-top: 8px;"
49
{{{#!wiki class="m-badge-slim" style="border-left: 3px solid #8182b8;"
50
[[아이리 칸나|칸나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #A2D0EF;"
51
[[아야츠노 유니|유니]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #60497f;"
13352
[[사키하네 후야|후야]]}}}
13453
}}}
13554
}}} || 1 || 1 ||
13655
|| 1 ||<class=content> 0{{{#!wiki class="inner-box"
13756
[[파일:스텔 2기.png|width=100%]]
138
{{{#!wiki style="margin-top: 20px;"
139
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #9EB5EE;"
140
[[아라하시 타비|타비]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #610A09;"
141
[[아카네 리제|리제]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #ff9680;"
142
[[시라유키 히나|히나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #65686a;"
57
{{{#!wiki style="margin-top: 8px;"
58
{{{#!wiki class="m-badge-slim" style="border-left: 3px solid #9EB5EE;"
59
[[아라하시 타비|타비]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #610A09;"
60
[[아카네 리제|리제]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #ff9680;"
61
[[시라유키 히나|히나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #65686a;"
14362
[[네네코 마시로|시로]]}}}
14463
}}}
14564
}}} || 1 ||
14665
|| 1 || 1 ||<class=content> 0{{{#!wiki class="inner-box"
14766
[[파일:스텔 3기.png|width=100%]]
148
{{{#!wiki style="margin-top: 20px;"
149
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
150
[[텐코 시부키|부키]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #BAC0E6;"
151
[[아오쿠모 린|린]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8fe0b0;"
152
[[유즈하 리코|리코]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
67
{{{#!wiki style="margin-top: 8px;"
68
{{{#!wiki class="m-badge-slim" style="border-left: 3px solid #B8A9CA;"
69
[[텐코 시부키|부키]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #BAC0E6;"
70
[[아오쿠모 린|린]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #8fe0b0;"
71
[[유즈하 리코|리코]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 3px solid #B8A9CA;"
15372
[[하나코 나나|나나]]}}}
15473
}}}
15574
}}} ||
15675
157
158
159
== 망작 2 gpt 작품 ==
160
{{{#!style
161
.stel-wrap{
162
display:flex;
163
justify-content:center;
164
margin:10px auto;
165
max-width:420px;
166
}
167
168
table.stel-side-slim{
169
width:420px;
170
border:2px solid #9A95BA;
171
border-collapse:collapse;
172
table-layout:fixed;
173
background:#fff;
174
}
175
176
/* 버튼 세로 */
177
table.stel-side-slim>thead{
178
float:left;
179
width:80px;
180
}
181
table.stel-side-slim>thead>tr{
182
display:flex;
183
flex-direction:column;
184
}
185
table.stel-side-slim>thead>tr>th{
186
padding:25px 0!important;
187
border:none;
188
border-bottom:1px solid #9A95BA;
189
background:#f0efff;
190
color:#9A95BA;
191
font-size:13px;
192
cursor:pointer;
193
}
194
195
/* 활성 버튼 */
196
table.stel-side-slim>thead>tr>th[aria-sort]{
197
background:#9A95BA!important;
198
color:#fff!important;
199
}
200
201
/* 본문 오른쪽 */
202
table.stel-side-slim>tbody{
203
display:block;
204
margin-left:80px;
205
}
206
table.stel-side-slim>tbody>tr:nth-of-type(n+2){display:none;}
207
table.stel-side-slim>tbody>tr>td{display:none;padding:0;border:none;}
208
table.stel-side-slim>tbody>tr>td.content{
209
display:block!important;
210
min-height:300px;
211
background:linear-gradient(160deg,#ffd3b6,#ffaaa5,#d4a5ff,#a29bfe);
212
}
213
214
/* 내부 */
215
.inner-box{padding:15px;text-align:center;}
216
.m-badge-slim{
217
display:inline-block;
218
padding:2px 8px;
219
margin:2px 1px;
220
border-radius:3px;
221
font-size:11px;
222
font-weight:800;
223
color:#5a4fcf!important;
224
background:#fff;
225
border:1px solid #9A95BA;
226
}
227
}}}
228
229
{{{#!wiki class="stel-wrap"
230
||<tableclass=stel-side-slim><thead><sortable> 1기생 || 2기생 || 3기생 ||
231
||<class=content>
232
{{{#!wiki class="inner-box"
233
[[파일:스텔 1기.png|width=100%]]
234
235
[[아이리 칸나|칸나]] · [[아야츠노 유니|유니]] · [[사키하네 후야|후야]]
236
}}}
237
||
238
||1||<class=content>
239
{{{#!wiki class="inner-box"
240
[[파일:스텔 2기.png|width=100%]]
241
242
[[아라하시 타비|타비]] · [[아카네 리제|리제]] · [[시라유키 히나|히나]] · [[네네코 마시로|시로]]
243
}}}
244
||
245
||1||1||<class=content>
246
{{{#!wiki class="inner-box"
247
[[파일:스텔 3기.png|width=100%]]
248
249
[[텐코 시부키|부키]] · [[아오쿠모 린|린]] · [[유즈하 리코|리코]] · [[하나코 나나|나나]]
250
}}}
251
||
252
}}}