MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 691: / Line 691: @@
 }
-/* Level selector */
+/* Level selector (table infobox legacy layout) */
-:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox) .module-level-selector .sv-level-ui{
+:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
-width:90%;
+.module-level-selector .sv-level-ui{
-margin:0 !important;
+  width:100%;
-display:flex;
+  margin:0 !important;
-flex-direction:column;
+  display:flex;
-gap:0.3em;
+  flex-direction:column;
+  gap:0.3em;
+}
+/* Keep label weight if those table layouts still show it */
+:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
+.module-level-selector .sv-level-label{
+  font-weight:600;
+}
+/* NEW: slider row is always [bar left] [value right] */
+:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
+.module-level-selector .sv-level-slider{
+  display:flex;
+  flex-direction:row;
+  align-items:center;
+  gap:10px;
+  width:100%;
 }
-:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox) .module-level-selector .sv-level-label{
+/* Let the bar take remaining space (no hard 90% width) */
-font-weight:600;
+:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
+.module-level-selector .sv-level-slider input[type="range"],
+:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
+.module-level-selector .sv-level-slider .sv-level-range--custom,
+:is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
+.module-level-selector .sv-level-slider .sv-level-range[data-sv-slider="1"]{
+  flex:1 1 auto;
+  min-width:0;
+  width:auto;
+  box-sizing:border-box;
+  margin:0;
+  order:1;
 }
+/* Ensure the JS-added end value stays on the right */
 :is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
-.module-level-selector .sv-level-slider input[type="range"]{
+.module-level-selector .sv-level-slider .sv-level-endvalue{
-width:90%;
+  flex:0 0 auto;
-box-sizing:border-box;
+  order:2;
-margin:0;
 }
+/* Keep this if you still use the single-UI variant */
 :is(table.spiritvale-skill-infobox, table.spiritvale-passive-infobox)
 .module-level-selector .sv-level-ui-single .sv-level-slider-single{
-min-height:0.45em;
+  min-height:0.45em;
 }