편집 요약 없음 태그: 되돌려진 기여 |
편집 요약 없음 태그: 수동 되돌리기 |
||
(같은 사용자의 중간 판 71개는 보이지 않습니다) | |||
3번째 줄: | 3번째 줄: | ||
/* 모바일 분류 박스 */ | /* 모바일 분류 박스 */ | ||
.namucat-main-box { | .namucat-main-box { | ||
margin-bottom: . | margin-bottom: .6rem; | ||
border: 1px solid # | border: 1px solid #5b5955; | ||
border-radius: 4px; | border-radius: 4px; | ||
padding: 3px 3px 3px 5px; | padding: 3px 3px 3px 5px; | ||
10번째 줄: | 10번째 줄: | ||
/* 모바일 미분류 박스 */ | /* 모바일 미분류 박스 */ | ||
.namucat-no-box { | .namucat-no-box { | ||
margin-bottom: . | margin-bottom: .6rem; | ||
border: 1px solid #bcdff1; | border: 1px solid #bcdff1; | ||
padding: 10px; | padding: 10px; | ||
16번째 줄: | 16번째 줄: | ||
border-radius: 5px; | border-radius: 5px; | ||
color: #31708f; | color: #31708f; | ||
} | } | ||
/* 링크 클릭 시 파란 박스 */ | /* 링크 클릭 시 파란 박스 */ | ||
37번째 줄: | 26번째 줄: | ||
} | } | ||
/* 순환 링크 애니메이션 제외 */ | /* 순환 링크 애니메이션 제외 */ | ||
a.selflink:active { | a.selflink:active:before { | ||
animation: none; | animation: none; | ||
} | } | ||
} | } | ||
48번째 줄: | 33번째 줄: | ||
@keyframes btn-background { | @keyframes btn-background { | ||
from { | from { | ||
background: rgba(0, 0, 255, .1); | background: blue; | ||
background: rgba(0, 0, 255, 0.1); | |||
} | } | ||
to { | to { | ||
background: | background: none; | ||
} | } | ||
} | } | ||
59번째 줄: | 45번째 줄: | ||
/* PC 분류 박스 */ | /* PC 분류 박스 */ | ||
.namucat-main-box { | .namucat-main-box { | ||
margin-bottom: | margin-bottom: 1rem; | ||
border: 1px solid # | border: 1px solid #5b5955; | ||
border-radius: 4px; | border-radius: 4px; | ||
padding: 3px 3px 3px 5px; | padding: 3px 3px 3px 5px; | ||
66번째 줄: | 52번째 줄: | ||
/* PC 미분류 박스 */ | /* PC 미분류 박스 */ | ||
.namucat-no-box { | .namucat-no-box { | ||
margin-bottom: | margin-bottom: 1rem; | ||
border: 1px solid #bcdff1; | border: 1px solid #bcdff1; | ||
padding: 10px; | padding: 10px; | ||
73번째 줄: | 59번째 줄: | ||
color: #31708f; | color: #31708f; | ||
} | } | ||
} | } | ||
102번째 줄: | 71번째 줄: | ||
/* 분류 간 구분선 */ | /* 분류 간 구분선 */ | ||
.namucat-stick:after { | .namucat-stick:after { | ||
content: '|'; | |||
padding: 0 5px; | |||
user-select: none; | |||
} | } | ||
/* 링크 색 변화 없애기 */ | /* 링크 색 변화 없애기 */ | ||
a:hover { | a:hover { | ||
color: # | color: #feddbd!important; | ||
text-shadow:0px 0px 15px #fdd18b!important; | |||
} | } | ||
a:active { | a:active { | ||
color: # | color: #ec9f19!important; | ||
} | } | ||
a.new:hover { | a.new:hover { | ||
color: # | color: #fe5757!important; | ||
text-shadow:0px 0px 15px #fc2020!important; | |||
} | } | ||
a.new:active { | a.new:active { | ||
color: # | color: #dc4343!important; | ||
} | } | ||
a.external:hover { | a.external:hover { | ||
color: # | color: #95ed95!important; | ||
text-shadow:0px 0px 15px #17ec17!important; | |||
} | } | ||
a.external:active { | a.external:active { | ||
color: # | color: #33b733!important; | ||
} | } | ||
.plainlinks:hover a.external { | .plainlinks:hover a.external { | ||
color: # | color: #feddbd!important; | ||
text-shadow:0px 0px 15px #fdd18b!important; | |||
} | } | ||
.plainlinks:active a.external { | .plainlinks:active a.external { | ||
color: # | color: #ec9f19!important; | ||
} | } | ||
a.selflink { | a.selflink { | ||
color: inherit; | color: inherit!important; | ||
} | } | ||
a.selflink:hover { | a.selflink:hover { | ||
color: inherit; | color: inherit!important; | ||
} | } | ||
a.selflink:active { | a.selflink:active { | ||
color: inherit | color: inherit!important; | ||
} | } |
2024년 5월 22일 (수) 23:29 기준 최신판
/* 모바일에서 */
@media screen and (max-width: 768px) {
/* 모바일 분류 박스 */
.namucat-main-box {
margin-bottom: .6rem;
border: 1px solid #5b5955;
border-radius: 4px;
padding: 3px 3px 3px 5px;
}
/* 모바일 미분류 박스 */
.namucat-no-box {
margin-bottom: .6rem;
border: 1px solid #bcdff1;
padding: 10px;
background: #d9edf7;
border-radius: 5px;
color: #31708f;
}
/* 링크 클릭 시 파란 박스 */
a:active {
animation-name: btn-background;
animation-duration: .5s;
animation-iteration-count: 1;
animation-timing-function: steps(1, end);
animation-fill-mode: forwards;
}
/* 순환 링크 애니메이션 제외 */
a.selflink:active:before {
animation: none;
}
}
/* 파란 박스가 0.5초 뒤 사라지는 애니메이션 */
@keyframes btn-background {
from {
background: blue;
background: rgba(0, 0, 255, 0.1);
}
to {
background: none;
}
}
/* PC에서 */
@media screen and (min-width: 768px) {
/* PC 분류 박스 */
.namucat-main-box {
margin-bottom: 1rem;
border: 1px solid #5b5955;
border-radius: 4px;
padding: 3px 3px 3px 5px;
}
/* PC 미분류 박스 */
.namucat-no-box {
margin-bottom: 1rem;
border: 1px solid #bcdff1;
padding: 10px;
background: #d9edf7;
border-radius: 5px;
color: #31708f;
}
}
/* 분류 블러 */
.namucat-blur {
filter: blur(3px);
}
.namucat-blur:hover {
filter: none;
}
/* 분류 간 구분선 */
.namucat-stick:after {
content: '|';
padding: 0 5px;
user-select: none;
}
/* 링크 색 변화 없애기 */
a:hover {
color: #feddbd!important;
text-shadow:0px 0px 15px #fdd18b!important;
}
a:active {
color: #ec9f19!important;
}
a.new:hover {
color: #fe5757!important;
text-shadow:0px 0px 15px #fc2020!important;
}
a.new:active {
color: #dc4343!important;
}
a.external:hover {
color: #95ed95!important;
text-shadow:0px 0px 15px #17ec17!important;
}
a.external:active {
color: #33b733!important;
}
.plainlinks:hover a.external {
color: #feddbd!important;
text-shadow:0px 0px 15px #fdd18b!important;
}
.plainlinks:active a.external {
color: #ec9f19!important;
}
a.selflink {
color: inherit!important;
}
a.selflink:hover {
color: inherit!important;
}
a.selflink:active {
color: inherit!important;
}