MediaWiki:Common.css: Difference between revisions

← Older edit

MediaWiki:Common.css (view source)

Revision as of 22:37, 1 April 2025

3,307 bytes added , 1 April

m

Added: ol li {margin-left: -0.5em;}

FaeriMagic

contributors, Interface administrators

2,292

edits

@@ Line 1: / Line 1: @@
 /* CSS placed here will be applied to all skins */
+/* Main container style */
+.mp-container {
+    margin: 10px auto;
+    display: table;
+    width: 100%;
+}
+/* Table row style */
+.mp-table-row {
+    display: table-row;
+}
+/* Table cell style */
+.mp-table-cell {
+    display: table-cell;
+    border: 3px solid transparent;
+    border-image: linear-gradient(to right, transparent 0%, #6a1b9a 25%, #6a1b9a 75%, transparent 100%);
+    border-image-slice: 1;
+    width: 48%; /* Adjust the width as needed */
+    box-sizing: border-box;
+    margin: 0 auto;
+}
+/* Common style for section headings */
+.mp-section-heading {
+    border-radius: 12px;
+    background: linear-gradient(45deg, #4b0082, #8b008b, #4b0082);
+    color: white;
+    border: 2px solid #632971;
+    text-align: center;
+    font-size: 24px;
+    padding: 12px;
+    line-height: 1.6;
+    position: relative;
+    letter-spacing: 1px;
+    font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
+}
+/* Style for links within .mp-section-heading */
+.mp-section-heading a {
+    color: white; /* Make the link white */
+    text-decoration: none; /* Remove underline if needed */
+}
+.mp-section-spacing {
+        margin-bottom: 10px; /* Adjust the margin as needed */
+    }
+/* Category filter style */
+.category-filter {
+    background-color: transparent;
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 8px;
+    margin-bottom: 20px;
+    text-align: center;
+    width: 100%; /* Adjust the width as needed */
+    margin-left: auto;
+    margin-right: auto;
+}
+.category-filter h2 {
+    color: #4b0082;
+}
+.category-filter ul {
+    list-style-type: none;
+    padding: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 5px !important;
+}
+.category-filter li {
+    margin: 0 10px; /* Equal spacing on both sides */
+}
+.category-link {
+    display: inline-block;
+    padding: 8px 12px;
+    border-radius: 5px;
+    color: #fff;
+    text-align: center;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+.category-link-characters,
+.category-link-events,
+.category-link-village,
+.category-link-drakenberg,
+.category-link-miscellanea {
+    background-color: #4b0082;
+    flex: 1; /* Equal width for all buttons */
+}
+.category-link:hover {
+    background-color: #632971;
+}
@@ Line 229: / Line 332: @@
 .content {
    width: 100%;
+}
+.blur {
+  transition: filter 0.15s ease-in-out;
+  overflow: hidden;
+  position: relative;
+}
+.blur img {
+  filter: blur(20px);
+  transition: filter 0.15s ease-in-out;
+}
+.blur:hover img {
+  filter: none;
+  transition: filter 0.15s ease-in-out;
+}
+.blur:hover figcaption {
+  opacity: 0;
+  display: none;
+}
+.blur > figcaption {
+  opacity: 0.5;
+  padding: 10px 15px 10px 15px !important;
+  border-radius: 15px;
+  background-color: black !important;
+  color: white;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+.blur > figcaption::before {
+  margin-left: 0px !important;
+  float: unset !important;
+}
+.blur > figcaption:empty {
+  display: none;
+}
+.spoiler {
+    background-color: #000; /* Change this to the desired background color */
+    color: #000; /* Change this to the desired text color */
+    cursor: pointer;
+    padding: 5px; /* Adjust the padding as needed */
+}
+.spoiler:hover {
+    background-color: transparent; /* Reveals the content on hover */
+    color: inherit;
+}
+ol li {
+    margin-left: -0.5em;
 }