User:Super Mikal/vector.css: Difference between revisions

From Path of Exile Wiki
Jump to navigation Jump to search
m (Super Mikal moved page User:Super Mikal/vector.css to User:Super Mikal/Vector.css without leaving a redirect: Misspelled title)
(Add .vector-menu-heading to label selector to override the existing rule for that class)
Line 2: Line 2:
/* ===== Menu tabs ===== */
/* ===== Menu tabs ===== */


div#mw-head .vector-menu-dropdown label {
div#mw-head .vector-menu-dropdown label.vector-menu-heading {
     color: var(--link-color);
     color: var(--link-color);
}
}
div#mw-head .vector-menu-dropdown label {
div#mw-head .vector-menu-dropdown label.vector-menu-heading {
     background-color: transparent;
     background-color: transparent;
     background-image: url("https://www.poewiki.net/w/images/c/c1/Vector_tab_left.png"), url("https://www.poewiki.net/w/images/0/07/Vector_tab_right.png");
     background-image: url("https://www.poewiki.net/w/images/c/c1/Vector_tab_left.png"), url("https://www.poewiki.net/w/images/0/07/Vector_tab_right.png");
Line 12: Line 12:
     background-size: auto;
     background-size: auto;
}
}
div#mw-head .vector-menu-dropdown label {
div#mw-head .vector-menu-dropdown label.vector-menu-heading {
     margin: 0;
     margin: 0;
     padding: 0;
     padding: 0;
     height: 100%;
     height: 100%;
}
}
div#mw-head .vector-menu-dropdown label::after {
div#mw-head .vector-menu-dropdown label.vector-menu-heading::after {
     content: none;
     content: none;
     display: none;
     display: none;
}
}
div#mw-head .vector-menu-dropdown:hover label,
div#mw-head .vector-menu-dropdown:hover label.vector-menu-heading,
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label {
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label.vector-menu-heading {
     background-position: left bottom, right bottom;
     background-position: left bottom, right bottom;
}
}
div#mw-head .vector-menu-dropdown:hover label span,
div#mw-head .vector-menu-dropdown:hover label.vector-menu-heading span,
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label span {
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label.vector-menu-heading span {
     background-position: center bottom;
     background-position: center bottom;
}
}
div#mw-head .vector-menu-dropdown label span {
div#mw-head .vector-menu-dropdown label.vector-menu-heading span {
     display: inline-block;
     display: inline-block;
     float: none;
     float: none;
Line 46: Line 46:
     background-size: auto;
     background-size: auto;
}
}
div#mw-head .vector-menu-dropdown label span::after {
div#mw-head .vector-menu-dropdown label.vector-menu-heading span::after {
     content: "";
     content: "";
     display: inline-block;
     display: inline-block;
Line 56: Line 56:
     transition: transform 0.15s ease-in;
     transition: transform 0.15s ease-in;
}
}
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label span::after {
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label.vector-menu-heading span::after {
     transform: rotate(-0.5turn);
     transform: rotate(-0.5turn);
}
}

Revision as of 17:31, 30 September 2023

/* ===== Menu tabs ===== */

div#mw-head .vector-menu-dropdown label.vector-menu-heading {
    color: var(--link-color);
}
div#mw-head .vector-menu-dropdown label.vector-menu-heading {
    background-color: transparent;
    background-image: url("https://www.poewiki.net/w/images/c/c1/Vector_tab_left.png"), url("https://www.poewiki.net/w/images/0/07/Vector_tab_right.png");
    background-position: left top, right top;
    background-repeat: no-repeat;
    background-size: auto;
}
div#mw-head .vector-menu-dropdown label.vector-menu-heading {
    margin: 0;
    padding: 0;
    height: 100%;
}
div#mw-head .vector-menu-dropdown label.vector-menu-heading::after {
    content: none;
    display: none;
}
div#mw-head .vector-menu-dropdown:hover label.vector-menu-heading,
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label.vector-menu-heading {
    background-position: left bottom, right bottom;
}
div#mw-head .vector-menu-dropdown:hover label.vector-menu-heading span,
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label.vector-menu-heading span {
    background-position: center bottom;
}
div#mw-head .vector-menu-dropdown label.vector-menu-heading span {
    display: inline-block;
    float: none;
    padding: 0 18px;
    height: 100%;
    font-family: var(--stylized-smallcaps-font);
    font-size: 16px;
    line-height: 26px;
    font-variant-ligatures: none;
    background-color: transparent;
    text-decoration: none;
    background-image: url("https://www.poewiki.net/w/images/a/ad/Vector_tab_center.png");
    background-position: center top;
    background-repeat: repeat-x;
    background-clip: content-box;
    background-size: auto;
}
div#mw-head .vector-menu-dropdown label.vector-menu-heading span::after {
    content: "";
    display: inline-block;
    margin-right: -6px;
    width: 1em;
    height: 1em;
    vertical-align: middle;
    background-image: url("data:image/svg+xml;utf-8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 320 512'><path d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z' fill='%23f2c462'/></svg>");
    transition: transform 0.15s ease-in;
}
div#mw-head .vector-menu-dropdown .vector-menu-checkbox:checked + label.vector-menu-heading span::after {
    transform: rotate(-0.5turn);
}