•  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
더 보기

스니펫:스텔라이브.css(비교)

r7 vs r8
1
/* [[분류:스니펫]] */
1
[[분류:스니펫]]
22
33
/* 스텔라이브의 r152 판에서 가져옴. UUID 60b48bbc-21a2-4269-9c6b-ed549790b04b */
44
/* 이전 역사 보러 가기 [[https://theseed.io/history/스텔라이브]] */
......
8484
*/
8585
8686
.m-badge:hover { transform: translateY(-1px); box-shadow: 0 0 20px rgba(255,255,255,0.4); filter: brightness(1.2); }
87
88
/* 1. 전체 테이블 레이아웃 */
89
table.chrome-wide-ui {
90
width: min(600px, 100%); background: transparent;
91
margin: 20px auto; border-collapse: collapse;
92
}
93
94
/* 2. 크롬 스타일 광폭 탭 바 */
95
table.chrome-wide-ui > thead > tr {
96
display: flex; gap: 2px; padding: 5px 5px 0 5px;
97
background: #dee1e6; /* 크롬 배경색 */
98
border-radius: 12px 12px 0 0;
99
}
100
table.chrome-wide-ui > thead > tr > th {
101
/* 가로 길이를 늘리기 위해 flex 설정 변경 */
102
flex: 0 1 160px; /* 최대 160px까지 가로로 길어짐 */
103
height: 34px; padding: 0 15px !important;
104
display: flex; align-items: center; justify-content: center;
105
cursor: pointer; transition: 0.2s;
106
font-size: 13px; color: #5f6368 !important; font-weight: 500;
107
border: none !important;
108
background: #bdc1c6; /* 비활성 탭은 조금 더 진한 색 */
109
border-radius: 8px 8px 0 0;
110
margin-right: 1px;
111
}
112
113
/* 마우스 호버 및 활성 느낌 (흰색으로 강조) */
114
table.chrome-wide-ui > thead > tr > th:hover {
115
background: #ffffff !important;
116
color: #1a73e8 !important; /* 크롬 강조 파란색 느낌 */
117
font-weight: bold;
118
}
119
120
/* 정렬 화살표 제거 */
121
table.chrome-wide-ui > thead > tr > th::before,
122
table.chrome-wide-ui > thead > tr > th::after { display: none !important; }
123
124
/* 3. 본문 영역 - 빈 공간 완벽 차단 */
125
table.chrome-wide-ui > tbody > tr { display: none; }
126
table.chrome-wide-ui > tbody > tr:first-child { display: table-row; }
127
128
table.chrome-wide-ui > tbody > tr > td {
129
border: none !important;
130
background: #fff; padding: 0 !important;
131
line-height: 0 !important;
132
position: relative;
133
}
134
135
/* 정렬 숫자 완전 격리 */
136
.sort-key {
137
position: absolute; font-size: 0; opacity: 0; pointer-events: none;
138
}
139
140
/* 4. 내부 컨텐츠 박스 */
141
.content-wrapper {
142
display: block !important;
143
font-size: 14px !important; line-height: 1.6 !important;
144
color: #333 !important; padding: 30px 20px; text-align: center;
145
background: #fff;
146
border: 1px solid #dee1e6; border-top: none;
147
border-radius: 0 0 15px 15px;
148
box-shadow: 0 4px 15px rgba(0,0,0,0.05);
149
}
150
151
/* 뱃지 스타일 */
152
.m-badge {
153
display: inline-block; padding: 3px 12px; margin: 4px 2px; border-radius: 20px;
154
font-size: 12px; font-weight: bold; color: #fff !important;
155
}