Template:QuickSummary/styles.css: Difference between revisions

Latest revision as of 10:20, 5 November 2025

/* === SECTION HEADINGS === */
.luna-heading {
  font-family:'AngerStyles', serif;
  font-size:32px;
  line-height:1.2;
  text-align:left;
  margin:40px 0 8px;
  position:relative;
  text-shadow:0 0 10px #000;
}

/* Color Variants */
.luna-heading.gold    { color:#ffd666; }
.luna-heading.crimson { color:#cc4444; }
.luna-heading.purple  { color:#b266ff; }
.luna-heading.cyan    { color:#33ccee; }
.luna-heading.green   { color:#66cc66; }
.luna-heading.orange  { color:#ff9933; }

/* Glowing underline (inherits currentColor) */
.luna-heading::after {
  content:"";
  position:absolute;
  left:0;
  bottom:-8px;
  width:100%;
  height:2px;
  background:linear-gradient(
    90deg,
    rgba(0,0,0,0) 0%,
    currentColor 20%,
    #ffffffaa 50%,
    currentColor 80%,
    rgba(0,0,0,0) 100%
  );
  box-shadow:0 0 8px currentColor;
}

/* === SECTION BODY === */
.luna-section {
  margin:16px 0 32px;
  padding:18px 24px;
  border-left:3px solid currentColor;
  border-radius:6px;
  background:rgba(20,20,20,0.7);
  line-height:1.55;
  box-shadow:0 0 12px #000 inset;  
}

/* Background accents per color */
.luna-section.gold    { border-color:#ffd666; background:rgba(35,30,10,0.25); }
.luna-section.crimson { border-color:#cc4444; background:rgba(35,20,20,0.25); }
.luna-section.purple  { border-color:#b266ff; background:rgba(30,20,40,0.25); }
.luna-section.cyan    { border-color:#33ccee; background:rgba(15,30,35,0.25); }
.luna-section.green   { border-color:#66cc66; background:rgba(20,35,20,0.25); }
.luna-section.orange  { border-color:#ff9933; background:rgba(40,25,10,0.25); }

/* === LISTS === */
.luna-section ul {
  margin:8px 0 8px 20px;
}
.luna-section li {
  margin:4px 0;
  padding-left:4px;
}

/* === DIAMOND BULLETS === */
.luna-section li::marker {
  content:"◆ ";
  color:currentColor;
}

.hover-gif {
  display:inline-block;
  width:200px;
  height:200px;
  background:url("https://wiki.cathedralofblades.com/images/Valravn.png") no-repeat center/cover;
}
.hover-gif:hover {
  background-image:url("https://wiki.cathedralofblades.com/images/Valravndemo.gif");
}
.hover-gif img { display:none; } /* Hide the original wiki-rendered <img> */

.citizen-overflow-wrapper {
  max-width: calc(100vw - 40px);
}

.smaller-table .citizen-overflow-wrapper {
  max-width: calc(100vw - 100px);
}

.wikitable {
  width: 100%;
}

.luna-section {
  overflow-x: auto;
  max-width: calc(100vw - 40px);
}

@@ Line 45: / Line 45: @@
    background:rgba(20,20,20,0.7);
    line-height:1.55;
    box-shadow:0 0 12px #000 inset;
 }
@@ Line 69: / Line 69: @@
    content:"◆ ";
    color:currentColor;
-}
-/* Hover GIF swap while still using MediaWiki file syntax */
-.hover-gif-wrapper {
-  display: inline-block;
-  text-align: center;
 }
 .hover-gif {
-   transition: transform 0.25s ease;
+   display:inline-block;
+  width:200px;
+  height:200px;
+  background:url("https://wiki.cathedralofblades.com/images/Valravn.png") no-repeat center/cover;
 }
 .hover-gif:hover {
-   content: url("https://wiki.cathedralofblades.com/images/Valravndemo.gif");
+   background-image:url("https://wiki.cathedralofblades.com/images/Valravndemo.gif");
-  transform: scale(1.03);
 }
+.hover-gif img { display:none; } /* Hide the original wiki-rendered <img> */
-.gif-caption {
+.citizen-overflow-wrapper {
-   margin-top: 6px;
+   max-width: calc(100vw - 40px);
-  font-family: 'AngerStyles', serif;
-  font-size: 18px;
-  color: #ffd666;
-  text-shadow: 0 0 6px #000;
 }
-@media screen and (max-width: 768px) {
-  body {
-    overflow-x: hidden;
-    padding-left: 8px;
-    padding-right: 8px;
-  }
-  .luna-section {
-    padding: 14px 12px;
-    margin-left: 0;
-    margin-right: 0;
-  }
-  .hover-gif-wrapper {
+.smaller-table .citizen-overflow-wrapper {
-    max-width: 100%;
+   max-width: calc(100vw - 100px);
-    overflow-x: auto;
-  }
-   .hover-gif {
-    max-width: 100%;
-    height: auto;
-  }
-  .luna-heading {
-    font-size: 24px;
-    word-wrap: break-word;
-  }
-  .gif-caption {
-    font-size: 16px;
-  }
 }
-html, body {
+.wikitable {
    width: 100%;
-  max-width: 100vw;
-  overflow-x: hidden !important;
-  box-sizing: border-box;
-  margin: 0;
-  padding: 0;
 }
-* {
-   box-sizing: border-box;
+.luna-section {
+   overflow-x: auto;
+  max-width: calc(100vw - 40px);
 }