미디어위키:Common.css: 두 판 사이의 차이

편집 요약 없음
태그: 되돌려진 기여
편집 요약 없음
 
(같은 사용자의 중간 판 76개는 보이지 않습니다)
7번째 줄: 7번째 줄:
   text-decoration: none; /* 링크 밑줄 제거 */
   text-decoration: none; /* 링크 밑줄 제거 */
   color: inherit; /* 부모 요소의 색상 사용 */
   color: inherit; /* 부모 요소의 색상 사용 */
}
.nolinkstyle a {
    text-decoration: none; /* 링크 밑줄 제거 */
    color: inherit; /* 부모 요소의 색상 사용 */
}
/* .image-cell 클래스를 사용하여 이미지 크기 조정 */
.image-cell {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.image-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 셀 크기에 맞게 이미지 비율을 유지하면서 잘라냄 */
}
}


17번째 줄: 37번째 줄:
}
}


/* MediaWiki:Common.css 또는 MediaWiki:YourSkin.css에 추가 */
/* 빛나는 텍스트 효과를 위한 기본 클래스 */
.glow-text {
    color: rgba(255, 255, 255, 1); /* 기본 글자 색상, 투명도 포함 */
    text-shadow: 0 0 10px rgba(255, 0, 0, 1), /* 더 큰 블러 반경과 높은 불투명도로 외부 광선을 추가 */
                0 0 20px rgba(255, 0, 0, 1), /* 더 큰 블러 반경으로 외곽 부분 글로우 */
                0 0 30px rgba(255, 0, 0, 1); /* 더욱 넓은 블러 반경으로 부드러운 글로우 */
    display: inline; /* 글자를 블록 요소가 아닌 인라인 요소로 표시 */
    transition: all 0.3s ease; /* 부드러운 효과 전환 */
}
 
/* 외부 광선 색상 및 크기 조정 */
.glow-text.custom {
    --glow-text-color: rgba(0, 0, 0, 1); /* 글자 색상, 투명도 포함 */
    --glow-shadow-color: rgba(255, 0, 0, 1); /* 외부 광선 색상 */
    --glow-shadow-size: 10px; /* 외부 광선 크기 */


/* 기본 glow 클래스 스타일 */
     color: var(--glow-text-color); /* 글자 색상 적용 */
.glow {
     text-shadow: 0 0 var(--glow-shadow-size) var(--glow-shadow-color); /* 외부 광선 효과 적용 */
    display: inline; /* 글자만 존재하게 하고, 별도의 셀이 생기지 않도록 설정 */
     color: var(--glow-text-color, #ffffff); /* 기본 글자색 (흰색), hex 코드로 설정 가능 */
     text-shadow:  
        0 0 var(--glow-size, 5px) var(--glow-color, #ff00ff), /* 외부 광선 색상 및 크기 */
        0 0 calc(var(--glow-size, 5px) * 2) var(--glow-color, #ff00ff),
        0 0 calc(var(--glow-size, 5px) * 3) var(--glow-color, #ff00ff),
        0 0 calc(var(--glow-size, 5px) * 4) var(--glow-color, #ff00ff);   
    font-weight: bold; /* 글자를 두껍게 설정 */
    font-size: inherit; /* 부모 요소의 폰트 크기를 따르도록 설정 */
}
}


/* 사용자 맞춤 설정을 위해 CSS 변수를 지원하지 않는 브라우저에 대한 폴백 */
.toggle-collapse {
.glow-fallback {
cursor: pointer;
     display: inline; /* 글자만 존재하게 설정 */
     display: inline; /* 인라인 요소로 설정하여 불필요한 줄바꿈 방지 */
     color: #000000; /* 기본 글자색 (흰색) */
     padding: 0; /* 내부 여백 제거 */
     text-shadow:  
     margin: 0; /* 외부 여백 제거 */
        0 0 5px #ff00ff,
     line-height: 1; /* 텍스트 높이와 동일하게 설정 */
        0 0 10px #ff00ff,
     font-size: inherit; /* 부모 요소의 폰트 크기와 동일하게 설정 */
        0 0 15px #ff00ff,
    vertical-align: baseline; /* 부모 텍스트와 동일한 수직 정렬 */
        0 0 20px #ff00ff;  
     font-weight: bold; /* 글자를 두껍게 설정 */
     font-size: inherit; /* 부모 요소의 폰트 크기를 따르도록 설정 */
}
}

2024년 11월 30일 (토) 18:00 기준 최신판

/* 이 CSS 설정은 모든 스킨에 적용됩니다 */

/* ReferenceTooltip 스타일 로드 */
@import url('//en.wikipedia.org/w/index.php?title=MediaWiki:Gadget-ReferenceTooltips.css&action=raw&ctype=text/css');

.no-link-style a {
  text-decoration: none; /* 링크 밑줄 제거 */
  color: inherit; /* 부모 요소의 색상 사용 */
}

.nolinkstyle a {
    text-decoration: none; /* 링크 밑줄 제거 */
    color: inherit; /* 부모 요소의 색상 사용 */
}

/* .image-cell 클래스를 사용하여 이미지 크기 조정 */
.image-cell {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.image-cell img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* 셀 크기에 맞게 이미지 비율을 유지하면서 잘라냄 */
}

.custom-toggle {
    cursor: pointer;
}

.custom-content {
    display: none; /* 초기 상태는 접힘 */
}

/* 빛나는 텍스트 효과를 위한 기본 클래스 */
.glow-text {
    color: rgba(255, 255, 255, 1); /* 기본 글자 색상, 투명도 포함 */
    text-shadow: 0 0 10px rgba(255, 0, 0, 1), /* 더 큰 블러 반경과 높은 불투명도로 외부 광선을 추가 */
                 0 0 20px rgba(255, 0, 0, 1), /* 더 큰 블러 반경으로 외곽 부분 글로우 */
                 0 0 30px rgba(255, 0, 0, 1); /* 더욱 넓은 블러 반경으로 부드러운 글로우 */
    display: inline; /* 글자를 블록 요소가 아닌 인라인 요소로 표시 */
    transition: all 0.3s ease; /* 부드러운 효과 전환 */
}

/* 외부 광선 색상 및 크기 조정 */
.glow-text.custom {
    --glow-text-color: rgba(0, 0, 0, 1); /* 글자 색상, 투명도 포함 */
    --glow-shadow-color: rgba(255, 0, 0, 1); /* 외부 광선 색상 */
    --glow-shadow-size: 10px; /* 외부 광선 크기 */

    color: var(--glow-text-color); /* 글자 색상 적용 */
    text-shadow: 0 0 var(--glow-shadow-size) var(--glow-shadow-color); /* 외부 광선 효과 적용 */
}

.toggle-collapse {
	cursor: pointer;
    display: inline; /* 인라인 요소로 설정하여 불필요한 줄바꿈 방지 */
    padding: 0; /* 내부 여백 제거 */
    margin: 0; /* 외부 여백 제거 */
    line-height: 1; /* 텍스트 높이와 동일하게 설정 */
    font-size: inherit; /* 부모 요소의 폰트 크기와 동일하게 설정 */
    vertical-align: baseline; /* 부모 텍스트와 동일한 수직 정렬 */
}