틀:Namucat-liban/styles.css

2024년 4월 17일 (수) 00:22 판 (원본 보기) 리반 (토론 | 기여) 편집 요약 없음 태그: 되돌려진 기여 ← 이전 편집		2024년 4월 17일 (수) 02:14 기준 최신판 (원본 보기) 리반 (토론 | 기여) 편집 요약 없음 태그: 수동 되돌리기
(같은 사용자의 중간 판 24개는 보이지 않습니다)
113번째 줄:		113번째 줄:
	a.selflink:active {		a.selflink:active {
	color: inherit!important;		color: inherit!important;
	}
	/* 리스트를 나무위키처럼 */
	ul:not(#toc) {
	margin: .2em 0 .2em 1.5em!important;
	padding-left: .5rem!important;
	list-style-type: disc;
	list-style-image: none;
	}
	ol:not(#toc) {
	margin: .2em 0 .2em 1.5em!important;
	padding-left: .5rem!important;
	}
	dl {
	margin: .2em 0 .2em 1.5em!important;
	padding-left: .5rem!important;
	}
	li:not(#toc) {
	margin: .2em 0!important;
	}
	dt {
	margin: .2em 0!important;
	}
	dd {
	margin: .2em 0!important;
	}
	ul ul:not(#toc) {
	list-style-type: circle;
	list-style-image: none;
	}
	ul ul ul:not(#toc) {
	list-style-type: square;
	list-style-image: none;
	}
	#toc ul {
	margin: 0!important;
	padding: 0.6rem 1.2rem!important;
	border: none;
	border-radius: 0;
	background: #d3d0c7;
	}
	#toc ul ul {
	margin: 0 0 0 1rem!important;
	padding: 0!important;
	}
	#toc li {
	margin: 0!important;
	padding: 0!important;
	border: none;
	border-radius: 0;
	background: #d3d0c7;
	}
	/* 목차를 나무위키처럼 */
	.toc {
	border-radius: 0!important;
	border: 1px solid #5b5955!important;
	margin-left: 5px;
	}
	.toctitle {
	min-width: 0!important;
	background-color: #d3d0c7!important;
	}
	#mw-toc-heading {
	border: none!important;
	font-weight: normal;
	user-select: none;
	}
	.tocnumber {
	color: #0275d8;
	padding-right: .3em!important;
	}
	.tocnumber:after {
	content: '.';
	}
	.toctext {
	cursor: default;
	}
	.toctogglespan {
	display: none;
	}
	/* 문단을 나무위키처럼 */
	h1 {
	border-bottom: 1px solid #5b5955!important;
	}
	h2 {
	border-bottom: 1px solid #5b5955!important;
	}
	h3 {
	border-bottom: 1px solid #5b5955!important;
	}
	h4 {
	border-bottom: 1px solid #5b5955!important;
	}
	h5 {
	border-bottom: 1px solid #5b5955!important;
	}
	h6 {
	border-bottom: 1px solid #5b5955!important;
	}
	.reference-paragraph {
	border-bottom: 1px solid #777!important;
	}
	.mw-headline {
	font-weight: bold;
	}
	.number-link {
	font-weight: bold;
	color: #0275d8;
	transition: color .05s ease-in;
	}
	.number-link:hover {
	color: #0263d8;
	}
	.number-link:active {
	color: #0263d8;
	}
	.mw-headline-number {
	cursor: pointer;
	}
	.mw-headline-number:hover {
	text-decoration: underline;
	}
	.mw-editsection {
	float: right;
	font-weight: bold;
	}
	.mw-editsection-visualeditor {
	display: none;
	}
	.mw-editsection-divider {
	display: none;
	}
	.mw-editsection-bracket {
	margin: 0!important;
	color: #0275d8!important;
	}		}

---

2024년 4월 17일 (수) 02:14 기준 최신판

/* 모바일에서 */
@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;
}