imported>Hsl0 |
|
| (사용자 2명의 중간 판 67개는 보이지 않습니다) |
| 1번째 줄: |
1번째 줄: |
| /* <pre><nowiki>*/ | | /* 2안 적색 배경 */ |
| | /*.ns-3000 #content, .ns-3000 #p-cactions li a:hover, .ns-3000 #p-cactions li.selected a { |
| | background-color: #fff0f0; |
| | }*/ |
|
| |
|
| /* 인쇄용 문서에서 일부 객체를 숨김 */ | | /* linktools.css */ |
| @media print {
| | @keyframes link-wait { |
| .editlink, .noprint, .metadata, .dablink {
| | from { |
| display: none;
| | background-position-x: 200%; |
| }
| |
| }
| |
| | |
| /* 로그인 상자의 모양 조절. */
| |
| form#userlogin {
| |
| float: left;
| |
| padding: 1em 1em .7em 1em;
| |
| background-color: #ffffe6;
| |
| border: 2px solid #fc6;
| |
| color: #000;
| |
| margin-right: 2em;
| |
| }
| |
| form#userlogin table {
| |
| background-color: #ffffe6;
| |
| color: #000;
| |
| }
| |
| form#userlogin2 {
| |
| float: left;
| |
| padding: 1em 1em .7em 1em;
| |
| background-color: #ffffe6;
| |
| border: 2px solid #fc6;
| |
| color: #000;
| |
| margin-right: 2em;
| |
| }
| |
| form#userlogin2 table {
| |
| background-color: #ffffe6;
| |
| color: #000;
| |
| }
| |
| | |
| /*</nowiki></pre>*/
| |
| | |
| /**
| |
| * 반응형 디자인 추가
| |
| * 단군조선의 홍익인간 정신을 본받아 모바일 사용자를 널리 이롭게 하고자 만든 리버티게임 반응형 css모듈입니다.
| |
| * 이 모듈을 삭제할 때 [[미디어위키:vector.js]]의 "사이드바 토글 버튼 추가" 모듈을 함께 삭제 해 주세요.
| |
| * 작성자: [[사용자:BANIP|BANIP]], [[사용자:hsl0|hsl0]]
| |
| */ | |
| @media (max-width: 800px) { | |
| body{ | |
| overflow-x:hidden; | |
| }
| |
| | |
| #content{
| |
| margin-left:0;
| |
| width:100%;
| |
| box-sizing: border-box;
| |
| }
| |
| | |
| /* 사용자 메뉴 레이아웃 조정 */
| |
| #p-personal{
| |
| position: absolute;
| |
| top: 0.33em;
| |
| right: 0.75em;
| |
| z-index: 100;
| |
| width: calc(100% - 3.5em);
| |
| }
| |
|
| |
| #p-personal > ul {
| |
| right: 0;
| |
| position: absolute;
| |
| text-align: right;
| |
| }
| |
|
| |
| #p-personal > ul > li{
| |
| float: none;
| |
| display: inline-block;
| |
| } | | } |
| | | to { |
| /* 사이드 바 */
| | background-position-x: 0%; |
| #btn-panelopen{ | |
| height: 2.4em;
| |
| background: #18a003 url(https://upload.wikimedia.org/wikipedia/commons/2/27/Menu%2C_Web_Fundamentals_%28White%29.svg) no-repeat center; | |
| background-size:1.8em;
| |
| left: 0;
| |
| top: 0em;
| |
| position: absolute;
| |
| display: block!important;
| |
| border: 0;
| |
| margin: 0;
| |
| padding: 0em 0.2em;
| |
| color: #fff;
| |
| font-weight: bold;
| |
| width: 2.5em;
| |
| } | | } |
|
| |
| #mw-panel{
| |
| visibility: hidden;
| |
| transform: translate(-100%);
| |
| transition:0.2s transform cubic-bezier(0.55, 0.06, 0.68, 0.19);
| |
| z-index: 200;
| |
|
| |
| top: 0!important;
| |
| padding-top: 0!important;
| |
| overflow-y: auto;
| |
| overflow-x: hidden;
| |
| }
| |
|
| |
| #mw-panel.visible{
| |
| visibility: visible;
| |
| height: 100%;
| |
| position: fixed;
| |
| transform: translate(0%);
| |
| }
| |
|
| |
| #mw-panel, #p-logo{
| |
| background: #f6f6f6;
| |
|
| |
| position: relative;
| |
| top: 0;
| |
| }
| |
|
| |
| /* 사이드바 스크롤바 */
| |
| #mw-panel::-webkit-scrollbar{
| |
| background: #000000;
| |
| width:0.4em;
| |
| height:0.3em;
| |
| }
| |
|
| |
| #mw-panel::-webkit-scrollbar-thumb {
| |
| background: #18a003;
| |
| }
| |
|
| |
| #p-tb{
| |
| padding-bottom: 2em!important;
| |
| }
| |
|
| |
| #left-navigation {
| |
| min-width: max-content;
| |
| }
| |
|
| |
| /* 검색바 가로폭 max로 설정 */
| |
| #right-navigation{
| |
| width: 100%;
| |
| float: unset;
| |
| }
| |
|
| |
| #p-search{
| |
| background: #000000;
| |
| display: flex;
| |
| justify-content: center;
| |
| align-content: center;
| |
| display: block;
| |
| position: absolute;
| |
| width: 100%;
| |
| padding: 0.2em 0.2em;
| |
| margin: 0 auto;
| |
| left: 0;
| |
| float: unset;
| |
| box-sizing: border-box;
| |
| }
| |
| #simpleSearch{
| |
| margin-top: 0!important;
| |
| width: 100%!important;
| |
| float: unset;
| |
| margin: 0;
| |
| min-width: unset!important;
| |
| max-width: unset!important;
| |
| box-sizing: border-box;
| |
| padding: 1em;
| |
| background: #fff;
| |
| }
| |
| #searchform{
| |
| margin-top: 0!important;
| |
| flex: 1;
| |
| }
| |
| #searchInput{
| |
| top: 0;
| |
| width: 100%;
| |
| height: 100%;
| |
| padding: 0 0 0 1em!important;
| |
| position: absolute;
| |
| left: 0;
| |
| background: #fff!important;
| |
| }
| |
|
| |
| /* 네비게이터 top 설정 */
| |
| #right-navigation, #left-navigation {
| |
| margin-top: 3.9em;
| |
| }
| |
| /* 검색바 top 설정 */
| |
| #p-search{
| |
| top:2em;
| |
| }
| |
| /* content top 설정 */
| |
| #content{
| |
| margin-top:1.35em;
| |
| }
| |
|
| |
| /* 네비게이터 위치 상세 조정*/
| |
| #left-navigation {
| |
| float:unset;
| |
| margin-left:0;
| |
| }
| |
|
| |
| #mw-head, #left-naviation, #p-namespaces > ul{
| |
| display:flex;
| |
| }
| |
|
| |
| /* 공지사항 위치 조율 */
| |
| .mw-dismissable-notice-body{
| |
| margin:0!important;
| |
| }
| |
|
| |
| .mw-dismissable-notice-close{
| |
| float:unset!important;
| |
| }
| |
|
| |
| #localNotice > ul > li {
| |
| text-align: initial;
| |
| }
| |
|
| |
| /* 공지사항 스타일링 */
| |
| #siteNotice{
| |
| position: relative;
| |
| border: 2px solid #000000;
| |
| }
| |
|
| |
| .mw-dismissable-notice-close{
| |
| background: #000000;
| |
| right: 0;
| |
| visibility: visible;
| |
| position: relative;
| |
| height: 2em;
| |
| color: transparent!important;
| |
| }
| |
|
| |
| .mw-dismissable-notice-close a{
| |
| position: absolute;
| |
| right: 0;
| |
| background: #18a003 url(/w/load.php?modules=oojs-ui.styles.icons-interactions&image=close&format=rasterized&skin=vector&version=16gk4) no-repeat center;
| |
| color: transparent!important;
| |
| font-size: 0em;
| |
| height: 100%;
| |
| width: 23px;
| |
| }
| |
| #footer {
| |
| margin:auto!important;
| |
| }
| |
| #mw-panel {
| |
| position: absolute;
| |
| }
| |
| #right-navigation {
| |
| width: 70%;
| |
| }
| |
| } | | } |
| #btn-panelopen{ | | .link-modifier-cloak, |
| display:none; | | .event-listener-cloak[data-target="link"], |
| }
| | .event-handler-cloak[data-target="link"] { |
| #p-personal ul {
| | cursor: wait; |
| padding: 0;
| | |
| | /* 그라데이션 애니메이션 */ |
| | 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, |
| * 삭제시 [[미디어위키:Vector.js]]의 "사용자 링크 펼치기 버튼 생성" 모듈도 삭제해 주세요.
| | .event-handler-cloak[data-target="link"] a { |
| * 제작자: [[사용자:hsl0|hsl0]]
| | pointer-events: none; |
| **/
| | color: inherit; |
| /* 700px 초과시 숨기지 않음 */
| |
| @media(min-width: 751px) {
| |
| #pt-collapse, #pt-expand {
| |
| display: none;
| |
| }
| |
| } | | } |
| /* 700px 이하일때 숨김 */
| |
| @media(max-width: 750px) {
| |
| #p-personal ul {
| |
| float: right;
| |
| }
| |
|
| |
|
| #p-personal ul:not(.expanded) { | | /* 애니메이션 줄이기가 켜진 경우 (vector 스킨 important 덮어쓰기) */ |
| align-items: stretch; | | @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; |
| } | | } |
|
| |
| #p-personal ul:not(.expanded) > li:nth-child(n+5):not(#pt-expand):not([id^="pt-anon"]):not(#pt-createaccount):not(#pt-login) {
| |
| display: none;
| |
| }
| |
|
| |
| #p-personal ul.expanded {
| |
| display: grid;
| |
| background: white;
| |
| width: auto;
| |
| grid-template-areas: "userpage alert notice collapse";
| |
| align-items: baseline;
| |
| border: 1px solid gray;
| |
| border-radius: 5px;
| |
| overflow: hidden;
| |
| }
| |
|
| |
| #pt-userpage {grid-area: userpage;}
| |
| #pt-talk-alert {grid-area: talk-alert;}
| |
| #pt-notifications-alert {grid-area: alert;}
| |
| #pt-notifications-notice {grid-area: notice;}
| |
| #pt-collapse {grid-area: collapse;}
| |
|
| |
| #p-personal ul.expanded > * {
| |
| margin: 0;
| |
| padding: 0;
| |
| overflow: hidden;
| |
| height: 100%;
| |
| }
| |
|
| |
| #p-personal ul.expanded > li > a {
| |
| display: block;
| |
| height: 100%;
| |
| padding-top: 10px;
| |
| padding-bottom: 10px;
| |
| padding-left: 15px;
| |
| padding-right: 15px;
| |
| }
| |
|
| |
| #p-personal ul.expanded > :not(#pt-userpage):not(#pt-notifications-alert):not(#pt-notifications-notice):not(#pt-collapse):not(#pt-collapse) {
| |
| margin: 0;
| |
| grid-column: 1 / -1
| |
| }
| |
|
| |
| #p-personal ul.expanded > :hover {
| |
| background: lightgrey;
| |
| }
| |
|
| |
| #p-personal ul.expanded #pt-userpage a {
| |
| border-top-left-radius: 5px;
| |
| display: block;
| |
| margin-top: 0.9em;
| |
| padding: 0 10px;
| |
| height: 20px;
| |
| width: 100%;
| |
| background-position-x: 15px;
| |
| background-position-y: 2px;
| |
| padding-right: 20px;
| |
| padding-left: 40px !important;
| |
| }
| |
|
| |
| #p-personal ul.expanded #pt-talk-alert a:hover {
| |
| background: #f0b400;
| |
| }
| |
|
| |
| #p-personal ul.expanded #pt-collapse a {
| |
| border-top-right-radius: 5px;
| |
| height: 20px;
| |
| }
| |
|
| |
| ul.expanded #pt-logout a {
| |
| border-bottom-left-radius: 5px;
| |
| border-bottom-right-radius: 5px;
| |
| }
| |
|
| |
| ul.expanded > #pt-expand {
| |
| display: none;
| |
| }
| |
|
| |
| #pt-expand > a {
| |
| top: -5px;
| |
| position: relative;
| |
| height: 20px;
| |
| width: 20px;
| |
| display: block;
| |
| }
| |
|
| |
| .expanded #pt-notifications-notice .mw-echo-notifications-badge,.expanded #pt-notifications-alert .mw-echo-notifications-badge,.expanded #pt-collapse a {
| |
| top: 20%;
| |
| margin: auto;
| |
| background-repeat: no-repeat;
| |
| background-position: center;
| |
| height: 25px;
| |
| vertical-align: bottom;
| |
| }
| |
| } | | } |
| /* 사용자 링크 숨기기 끝 */
| |
