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

Aidenk/test(비교)

보기RAWBlame되돌리기비교
r11 vs r12
......
7171
[clearfix]
7272
== 망작1 gemini 작품 ==
7373
{{{#!style
74
/* 전체 테이블: 주신 예시처럼 테두리가 딱딱 끊어지는 네모 형태 */
75
table.stel-table {
76
width: 500px; max-width: 100%; table-layout: fixed;
77
margin: 20px auto; border: 2px solid #9A95BA;
78
border-collapse: collapse; background: #fff;
74
/* 전체 컨테이너: 너비 420px */
75
table.stel-vtab {
76
width: 420px; max-width: 100%; margin: 20px auto;
77
background: transparent; border: none; border-collapse: separate; border-spacing: 0;
7978
}
80
/* 탭 버튼 영역 */
81
table.stel-table > thead > tr > th {
82
padding: 10px !important; border: 1px solid #9A95BA;
83
background: #f8f8ff; color: #9A95BA; font-weight: bold; cursor: pointer;
79
80
/* 왼쪽 세로 버튼 (Thead 영역) */
81
table.stel-vtab > thead > tr {
82
display: flex; flex-direction: column; width: 100px; float: left;
83
margin-top: 10px; /* 본문보다 약간 아래에서 시작하게 조정 가능 */
8484
}
85
/* 클릭해서 활성화된 탭 */
86
table.stel-table > thead > tr > th.header-sort-up,
87
table.stel-table > thead > tr > th.header-sort-down,
88
table.stel-table > thead > tr > th[aria-sort] {
85
86
table.stel-vtab > thead > tr > th {
87
padding: 15px 0 !important; margin-bottom: 5px;
88
border: 2px solid #9A95BA; border-right: none;
89
border-radius: 15px 0 0 15px; /* 왼쪽만 둥글게 해서 본문에 붙은 느낌 */
90
background: #fff; color: #9A95BA; font-weight: bold; cursor: pointer;
91
}
92
93
/* 활성화된 탭 디자인 (자시안 예시의 색상 강조) */
94
table.stel-vtab > thead > tr > th.header-sort-up,
95
table.stel-vtab > thead > tr > th.header-sort-down,
96
table.stel-vtab > thead > tr > th[aria-sort] {
8997
background: #9A95BA !important; color: #fff !important;
9098
}
91
/* 내용 영역 */
92
table.stel-table > tbody > tr:nth-of-type(n+2) { display: none; }
93
table.stel-table > tbody > tr > td { display: none; padding: 0; border: none !important; }
94
table.stel-table > tbody > tr > td.content {
95
display: block !important; width: 100%; border: 1px solid #9A95BA !important;
99
100
/* 오른쪽 본문 내용 영역 */
101
table.stel-vtab > tbody {
102
display: block; width: 320px; float: left;
96103
}
104
table.stel-vtab > tbody > tr:nth-of-type(n+2) { display: none; }
105
table.stel-vtab > tbody > tr > td { display: none; padding: 0; border: none !important; }
97106
98
/* 내부 디자인: 노을 그라데이션만 살짝 적용 */
99
.stel-inner {
100
padding: 15px; text-align: center;
101
background: linear-gradient(160deg in oklch, #ffd3b6 0%, #ffaaa5 40%, #d4a5ff 80%, #a29bfe 100%);
107
table.stel-vtab > tbody > tr > td.content {
108
display: block !important; width: 100%; min-height: 400px;
109
border: 2px solid #9A95BA !important; border-radius: 0 20px 20px 20px;
110
overflow: hidden;
111
background: linear-gradient(160deg in oklch, #ffd3b6 0%, #ffaaa5 40%, #d4a5ff 80%, #a29bfe 100%) !important;
102112
}
113
114
.inner-content { padding: 15px; text-align: center; }
103115
.m-badge-slim {
104116
display: inline-block; padding: 2px 10px; margin: 3px 1.5px; border-radius: 3px;
105
font-size: 12px; font-weight: 800; color: #5a4fcf !important; background: #fff;
117
font-size: 11px; font-weight: 800; color: #5a4fcf !important; background: #fff;
106118
border: 1px solid #9A95BA;
107119
}
108120
}}}
109121
110
||<thead><sortable><tableclass=stel-table> 1기생 ||<sortable> 2기생 ||<sortable> 3기생 ||
111
||<class=content> 0{{{#!wiki class="stel-inner"
122
||<thead><sortable><tableclass=stel-vtab> 1기생 ||<sortable> 2기생 ||<sortable> 3기생 ||
123
||<class=content> 0{{{#!wiki class="inner-content"
112124
[[파일:스텔 1기.png|width=100%]]
113
[br]{{{#!wiki style="margin-top: 10px;"
125
{{{#!wiki style="margin-top: 15px;"
114126
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8182b8;"
115127
[[아이리 칸나|칸나]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #A2D0EF;"
116128
[[아야츠노 유니|유니]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #60497f;"
117129
[[사키하네 후야|후야]]}}}
118130
}}}
119131
}}} || 1 || 1 ||
120
|| 1 ||<class=content> 0{{{#!wiki class="stel-inner"
132
|| 1 ||<class=content> 0{{{#!wiki class="inner-content"
121133
[[파일:스텔 2기.png|width=100%]]
122
[br]{{{#!wiki style="margin-top: 10px;"
134
{{{#!wiki style="margin-top: 15px;"
123135
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #9EB5EE;"
124136
[[아라하시 타비|타비]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #610A09;"
125137
[[아카네 리제|리제]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #ff9680;"
......
127139
[[네네코 마시로|시로]]}}}
128140
}}}
129141
}}} || 1 ||
130
|| 1 || 1 ||<class=content> 0{{{#!wiki class="stel-inner"
142
|| 1 || 1 ||<class=content> 0{{{#!wiki class="inner-content"
131143
[[파일:스텔 3기.png|width=100%]]
132
[br]{{{#!wiki style="margin-top: 10px;"
144
{{{#!wiki style="margin-top: 15px;"
133145
{{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
134146
[[텐코 시부키|부키]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #BAC0E6;"
135
[[아오쿠모 린|린]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #8fe0b0;"
136
[[유즈하 리코|리코]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 5px solid #B8A9CA;"
147
[[아오쿠모 린|린]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 4px solid #8fe0b0;"
148
[[유즈하 리코|리코]]}}} {{{#!wiki class="m-badge-slim" style="border-left: 4px solid #B8A9CA;"
137149
[[하나코 나나|나나]]}}}
138150
}}}
139151
}}} ||
......