MediaWiki:SkillNav.css: Difference between revisions
From Elwiki
No edit summary |
No edit summary |
||
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 105: | Line 106: | ||
.mw-customtoggle-Surya.mw-customtoggle { | .mw-customtoggle-Surya.mw-customtoggle { | ||
width: calc(20px + | width: calc(20px + 0.5rem); | ||
height: calc(20px + | height: calc(20px + 0.5rem); | ||
transform: skew(10deg); | transform: skew(10deg); | ||
margin-left: auto; | margin-left: auto; | ||
margin-right: | margin-right: 1.5rem; | ||
padding: | padding: 0.5rem; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
background-size: | background-size: 20px; | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-position: center; | background-position: center; | ||
Line 120: | Line 121: | ||
.mw-customtoggle-Surya.mw-customtoggle:hover { | .mw-customtoggle-Surya.mw-customtoggle:hover { | ||
background-color: rgba( | background-color: rgba(255,255,255,.25); | ||
} | } |
Revision as of 23:13, 16 June 2022
.skill-nav {
margin: 1rem 0;
}
.skill-nav-inner-wrap {
margin-top: 0.5rem;
display: grid;
grid-template-columns: max-content auto;
border-top: 1px solid black;
border-left: 1px solid black;
user-select: none;
}
.skill-nav-inner-wrap > div {
border-bottom: 1px solid black;
border-right: 1px solid black;
}
.skill-nav .image-cropped {
margin-left: -8px;
transform: skew(10deg);
}
.skill-nav .skill-nav-header {
display: flex;
gap: 1rem;
place-items: center;
transform: skew(-10deg);
overflow: hidden;
height: 45px;
}
.skill-nav .skill-nav-header span {
color: #fff;
font-weight: 500;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
display: inline-block;
transform: skew(10deg);
font-size: 1.25rem;
}
.skill-nav .skill-nav-header a {
color: #fff !important;
}
.skill-nav .skill-nav-skill-content {
display: flex;
gap: 0.25rem;
flex-wrap: wrap;
}
.skill-nav .skill-nav-skill {
display: flex;
flex-direction: row;
place-content: center;
place-items: center;
transition: background-color 0.3s;
}
.skill-nav .skill-nav-skill a {
padding: 0.35rem;
text-decoration: none!important;
height: 100%;
display: flex;
place-items: center;
box-sizing: border-box;
}
.skill-nav .skill-nav-skill a:not(.skill-nav-image a) {
padding: 0.5rem 0.5rem 0.5rem 0.15rem;
width: 100%;
font-weight: 500;
}
.skill-nav .skill-nav-sub-head {
padding: 0.5rem;
min-width: 8.5rem;
font-weight: 500;
display: flex;
place-items: center;
}
.skill-nav .skill-nav-image {
margin-right: auto;
height: 100%;
display: flex;
place-items: center;
}
.skill-nav .skill-nav-image .force-skill-icon {
padding-right: 0.65rem;
height: calc(30px + 0.5rem)!important;
}
.skill-nav .skill-nav-skill .force-skill-icon a {
display: block;
}
.skill-nav .skill-nav-skill a.mw-selflink:not(.skill-nav-image a) {
font-weight: 600!important;
}
.skill-nav .self-skill:hover {
background: none!important;
}
.mw-customtoggle-Surya.mw-customtoggle {
width: calc(20px + 0.5rem);
height: calc(20px + 0.5rem);
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: .3s;
border-radius: 4px;
}
.mw-customtoggle-Surya.mw-customtoggle:hover {
background-color: rgba(255,255,255,.25);
}