사용자:Hsl0/common.css: 두 판 사이의 차이

리버티게임, 모두가 만들어가는 자유로운 게임
imported>Hsl0
편집 요약 없음
편집 요약 없음
 
(사용자 2명의 중간 판 54개는 보이지 않습니다)
1번째 줄: 1번째 줄:
/* 추가 스크롤 생성 방지 */
/* 2안 적색 배경 */
body {
/*.ns-3000 #content, .ns-3000 #p-cactions li a:hover, .ns-3000 #p-cactions li.selected a {
     overflow-x: hidden;
  background-color: #fff0f0;
}*/
 
/* linktools.css */
@keyframes link-wait {
    from {
        background-position-x: 200%;
    }
     to {
        background-position-x: 0%;
    }
}
}
.mw-page-container {
.link-modifier-cloak,
    padding-left: clamp(0px, calc(50vw - 14.6875em), 0.9375em);
.event-listener-cloak[data-target="link"],
     padding-right: clamp(0px, calc(50vw - 14.6875em), 0.9375em);
.event-handler-cloak[data-target="link"] {
     min-width: auto;
cursor: wait;
     overflow-x: hidden;
     overflow-y: hidden;
/* 그라데이션 애니메이션 */
     background-image: linear-gradient(
        135deg,
        #cccccc,
        #cccccc,
        #4d4d4d,
        #4d4d4d,
        #cccccc,
        #cccccc
    );
     background-size: 200% auto;
     background-clip: text;
     -webkit-background-clip: text;
    -moz-background-clip: text;
    color: transparent;
    animation: 2s linear 0s infinite running link-wait;
}
}


/* 불필요한 여백 제거 */
.link-modifier-cloak a,
.mw-footer-container {
.event-listener-cloak[data-target="link"] a,
    padding-top: 0;
.event-handler-cloak[data-target="link"] a {
}
     pointer-events: none;
.mw-footer-container {
    color: inherit;
     padding-bottom: 10px;
}
}


/* 반응형 폭 조정 */
/* 애니메이션 줄이기가 켜진 경우 (vector 스킨 important 덮어쓰기) */
@media screen and (max-width: 999px) {
@media (prefers-reduced-motion: reduce) {
.mw-header {
.link-modifier-cloak,
    padding-left: clamp(0px, calc(0.9375em + 50% - 50vw), 0.46875em);
.event-listener-cloak[data-target="link"],
    padding-right: clamp(0px, calc(0.9375em + 50% - 50vw), 0.46875em);
.event-handler-cloak[data-target="link"] {
animation: 4s linear 0s infinite running link-wait !important;
}
}
}
#content, #footer {
    padding-right: clamp(0.5em, calc(50vw - 13.75em), 0.9375em);
    padding-left: clamp(0.5em, calc(50vw - 13.75em), 0.9375em);
}
/* 배경이 들어가는 여백 폭 넓히기 */
.mw-content-container, .mw-article-toolbar-container {
    max-width: 61.875em;
}
/* 모바일 환경에서 알림창 폭을 화면 폭에 맞추기 */
@media(max-width: 530px) {
    .mw-echo-ui-notificationBadgeButtonPopupWidget-popup {
        left: 0 !important;
    }
    .mw-echo-ui-notificationBadgeButtonPopupWidget-popup > .oo-ui-popupWidget-popup {
        width: min(100vw, 500px) !important;
    }
    .mw-echo-ui-notificationBadgeButtonPopupWidget-popup .oo-ui-popupWidget-body {
        width: 100% !important;
    }
}
/* 모바일에서도 옆에서 사이드바 펼치기 */
@media screen and (max-width: 720px) {
    .mw-checkbox-hack-checkbox:checked ~ .mw-workspace-container #mw-panel {
        position: absolute;
        width: 11em;
        height: 100%;
        left: -1em;
    }
}
}

2024년 2월 27일 (화) 20:37 기준 최신판

/* 2안 적색 배경 */
/*.ns-3000 #content, .ns-3000 #p-cactions li a:hover, .ns-3000 #p-cactions li.selected a {
  background-color: #fff0f0;
}*/

/* linktools.css */
@keyframes link-wait {
    from {
        background-position-x: 200%;
    }
    to {
        background-position-x: 0%;
    }
}
.link-modifier-cloak,
.event-listener-cloak[data-target="link"],
.event-handler-cloak[data-target="link"] {
	cursor: wait;
	
	/* 그라데이션 애니메이션 */
    background-image: linear-gradient(
        135deg,
        #cccccc,
        #cccccc,
        #4d4d4d,
        #4d4d4d,
        #cccccc,
        #cccccc
    );
    background-size: 200% auto;
    background-clip: text;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    color: transparent;
    animation: 2s linear 0s infinite running link-wait;
}

.link-modifier-cloak a,
.event-listener-cloak[data-target="link"] a,
.event-handler-cloak[data-target="link"] a {
    pointer-events: none;
    color: inherit;
}

/* 애니메이션 줄이기가 켜진 경우 (vector 스킨 important 덮어쓰기) */
@media (prefers-reduced-motion: reduce) {
	.link-modifier-cloak,
	.event-listener-cloak[data-target="link"],
	.event-handler-cloak[data-target="link"] {
		animation: 4s linear 0s infinite running link-wait !important;
	}
}