MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
Line 58: | Line 58: | ||
#floating-toc { | |||
position: fixed; | |||
bottom: 20px; | |||
right: 20px; | |||
width: 250px; | |||
width: 250px; | |||
background: linear-gradient(to bottom, #111 0%, #222 100%); | background: linear-gradient(to bottom, #111 0%, #222 100%); | ||
border: 2px solid rgba(255, 215, 0, 0. | border: 2px solid rgba(255, 215, 0, 0.5); /* Goldish border */ | ||
border-radius: 10px; | border-radius: 10px; | ||
padding: | padding: 10px; | ||
font-size: 14px; | font-size: 14px; | ||
box-shadow: 0px 0px | box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8); | ||
transition: all 0.3s ease-in-out; | |||
z-index: 1000; | |||
} | } | ||
/* Collapsed State */ | |||
#floating-toc.collapsed { | |||
width: 150px; | |||
height: 30px; | |||
overflow: hidden; | overflow: hidden; | ||
text-align: | padding: 5px; | ||
text-align: center; | |||
cursor: pointer; | |||
} | } | ||
/* Header Style */ | |||
font-family: 'Cinzel', serif; | #floating-toc h2 { | ||
font-family: 'Cinzel', serif; | |||
font-size: 16px; | font-size: 16px; | ||
font-weight: bold; | |||
text-transform: uppercase; | text-transform: uppercase; | ||
color: #C0A080; /* Gold */ | color: #C0A080; /* Gold */ | ||
text-align: center; | |||
margin: 0; | |||
padding: 5px; | |||
} | } | ||
/* ToC Links */ | |||
border-top: 1px solid rgba(255, 215, 0, 0.3) | #floating-toc ul { | ||
list-style: none; | |||
padding: 0; | |||
margin-top: 10px; | |||
border-top: 1px solid rgba(255, 215, 0, 0.3); | |||
} | } | ||
#floating-toc li { | |||
padding: 4px; | |||
} | } | ||
#floating-toc a { | |||
font-family: 'Cinzel', serif; | font-family: 'Cinzel', serif; | ||
font-size: 13px; | |||
color: #bbb; | |||
text-decoration: none; | |||
display: block; | display: block; | ||
padding: 4px 10px; | padding: 4px 10px; | ||
border-radius: 4px; | border-radius: 4px; | ||
transition: all 0.3s ease; | transition: all 0.3s ease; | ||
} | } | ||
#floating-toc a:hover { | |||
color: #FFD700; /* | color: #FFD700; /* Gold Hover */ | ||
background: rgba(255, 255, 255, 0.1); | background: rgba(255, 255, 255, 0.1); | ||
} | } | ||
/* Collapsed Text */ | |||
. | #floating-toc.collapsed::after { | ||
content: "Contents ▼"; | |||
font-family: 'Cinzel', serif; | |||
font-size: 14px; | |||
color: #C0A080; | |||
display: block; | |||
text-align: center; | |||
padding: 5px; | |||
} | } |
Revision as of 02:32, 25 March 2025
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&display=swap');
#mw-panel {
width: 150px;
padding: 2px;
display: flex;
flex-direction: column;
gap: 4px;
}
#mw-panel .mw-portlet {
width: 100%;
background: linear-gradient(to bottom, #111 0%, #222 100%);
border: 1px solid rgba(255, 215, 0, 0.3);
border-radius: 6px;
padding: 2px;
margin-bottom: 4px;
}
#mw-panel .mw-portlet .vector-menu-heading {
font-family: 'Cinzel', serif;
font-size: 13px;
font-weight: bold;
text-transform: uppercase;
color: #C0A080;
background: rgba(15, 15, 15, 0.9);
padding: 4px;
border-radius: 6px 6px 0 0;
text-align: center;
letter-spacing: 1px;
line-height: 12px;
}
#mw-panel .mw-portlet .body a {
font-family: 'Cinzel', serif;
font-size: 12px;
color: #bbb;
text-decoration: none;
padding: 3px 5px;
display: block;
transition: all 0.3s ease;
}
#mw-panel .mw-portlet .body a:hover {
color: #FFD700; /* Royal Gold Hover */
background: rgba(255, 255, 255, 0.1);
border-radius: 2px;
}
#mw-panel .mw-portlet .body {
padding: 2px;
}
#mw-panel .mw-portlet {
margin-bottom: 3px;
}
#floating-toc {
position: fixed;
bottom: 20px;
right: 20px;
width: 250px;
background: linear-gradient(to bottom, #111 0%, #222 100%);
border: 2px solid rgba(255, 215, 0, 0.5); /* Goldish border */
border-radius: 10px;
padding: 10px;
font-size: 14px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
transition: all 0.3s ease-in-out;
z-index: 1000;
}
/* Collapsed State */
#floating-toc.collapsed {
width: 150px;
height: 30px;
overflow: hidden;
padding: 5px;
text-align: center;
cursor: pointer;
}
/* Header Style */
#floating-toc h2 {
font-family: 'Cinzel', serif;
font-size: 16px;
font-weight: bold;
text-transform: uppercase;
color: #C0A080; /* Gold */
text-align: center;
margin: 0;
padding: 5px;
}
/* ToC Links */
#floating-toc ul {
list-style: none;
padding: 0;
margin-top: 10px;
border-top: 1px solid rgba(255, 215, 0, 0.3);
}
#floating-toc li {
padding: 4px;
}
#floating-toc a {
font-family: 'Cinzel', serif;
font-size: 13px;
color: #bbb;
text-decoration: none;
display: block;
padding: 4px 10px;
border-radius: 4px;
transition: all 0.3s ease;
}
#floating-toc a:hover {
color: #FFD700; /* Gold Hover */
background: rgba(255, 255, 255, 0.1);
}
/* Collapsed Text */
#floating-toc.collapsed::after {
content: "Contents ▼";
font-family: 'Cinzel', serif;
font-size: 14px;
color: #C0A080;
display: block;
text-align: center;
padding: 5px;
}