ElEditors, Interface administrators, Administrators
70,980
edits
MediaWiki:SkillNav.css: Difference between revisions
no edit summary
No edit summary |
No edit summary |
||
| (22 intermediate revisions by the same user not shown) | |||
| Line 9: | Line 9: | ||
border-top: 1px solid black; | border-top: 1px solid black; | ||
border-left: 1px solid black; | border-left: 1px solid black; | ||
user-select: none; | |||
} | } | ||
| Line 16: | Line 17: | ||
} | } | ||
.skill-nav .image-cropped { | .skill-nav .skill-nav-header .image-cropped { | ||
margin-left: - | margin-left: -2px; | ||
transform: skew(10deg); | transform: skew(10deg); | ||
} | } | ||
| Line 23: | Line 24: | ||
.skill-nav .skill-nav-header { | .skill-nav .skill-nav-header { | ||
display: flex; | display: flex; | ||
place-items: center; | place-items: center; | ||
transform: skew(-10deg); | transform: skew(-10deg); | ||
| Line 30: | Line 30: | ||
} | } | ||
.skill-nav .skill-nav- | .skill-nav .skill-nav-title { | ||
color: #fff; | color: #fff; | ||
font-weight: 500; | font-weight: 500; | ||
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); | text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5); | ||
display: inline-block; | display: inline-block; | ||
font-size: 1.25rem; | |||
transform: skew(10deg); | transform: skew(10deg); | ||
} | } | ||
| Line 73: | Line 73: | ||
.skill-nav .skill-nav-sub-head { | .skill-nav .skill-nav-sub-head { | ||
padding: 0.5rem | padding: 0.5rem; | ||
min-width: 8.5rem; | |||
font-weight: 500; | font-weight: 500; | ||
display: flex; | display: flex; | ||
| Line 101: | Line 102: | ||
.skill-nav .self-skill:hover { | .skill-nav .self-skill:hover { | ||
background: none!important; | background: none!important; | ||
} | |||
.skill-nav .mw-customtoggle { | |||
width: calc(20px + 0.75rem); | |||
height: calc(20px + 0.75rem); | |||
transform: skew(10deg); | |||
margin-left: auto; | |||
margin-right: 1.5rem; | |||
padding: 0.5rem; | |||
box-sizing: border-box; | |||
background-size: 20px; | |||
background-repeat: no-repeat; | |||
background-position: center; | |||
transition: background-color .3s; | |||
border-radius: 4px; | |||
} | |||
.skill-nav .mw-customtoggle:hover { | |||
background-color: rgba(255,255,255,.25); | |||
} | |||
.skill-nav .mw-collapsed { | |||
display: none; | |||
} | |||
.skill-nav a > img:not(.image-face img) { | |||
max-width: initial!important; | |||
} | |||
.skill-nav .image-face > span { | |||
display: flex; | |||
} | |||
/* Force Nav */ | |||
.force-nav .skill-nav-extra-head { | |||
place-content: center; | |||
grid-column: span 2; | |||
} | |||
.force-nav .skill-nav-header a { | |||
font-size: 1.05rem; | |||
} | |||
.force-nav .skill-nav-header { | |||
height: auto; | |||
padding: 0.2rem; | |||
place-content: center; | |||
} | |||
.force-nav .mw-customtoggle { | |||
margin-left: 0; | |||
position: absolute; | |||
right: 0; | |||
background-size: 15px; | |||
width: calc(15px + 0.75rem); | |||
height: calc(15px + 0.75rem); | |||
} | |||
@media screen and (max-width: 500px) { | |||
.skill-nav .skill-nav-sub-head { | |||
min-width: unset; | |||
} | |||
.skill-nav-inner-wrap { | |||
grid-template-columns: min-content auto; | |||
} | |||
.skill-nav .skill-nav-skill-content { | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
gap: 0; | |||
} | |||
} | } | ||