Toggle search
Toggle menu
115
248
25
2.7K
SpiritVale Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Join the Playtest on Steam Now: SpiritVale

Module:GameInfo/styles.css: Difference between revisions

From SpiritVale Wiki
More actions
← Older editNewer edit →
No edit summary
Tags: Mobile edit Mobile web edit
No edit summary
Tags: Mobile edit Mobile web edit
Line 158: Line 158:


/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* 5) Level selector wrapper */
/* 5) Meta row */
/* -------------------------------------------------------------------------- */
 
.sv-skill-meta{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:6px;
}
 
.sv-gi-card .sv-meta-card,
.sv-skill-card .sv-meta-card{
  position:relative;
 
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
 
  min-height:34px;
  padding:0;
 
  border-radius:999px;
  border:1px solid var(--sv-ui-line2);
  background:var(--sv-ui-bg2);
  background-image:none;
  color:var(--sv-ui-text1);
}
 
.sv-gi-card .sv-meta-card:hover,
.sv-skill-card .sv-meta-card:hover{ background:var(--sv-ui-bg3); }
 
.sv-gi-card .sv-meta-icon,
.sv-skill-card .sv-meta-icon{
  flex:0 0 auto;
  width:20px;
  height:20px;
 
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
 
  border-radius:999px;
 
  /* Small inner bubble contrast. */
  background:var(--sv-ui-bg1);
  background-image:none;
}
 
.sv-gi-card .sv-meta-textwrap,
.sv-skill-card .sv-meta-textwrap{
  min-width:0;
  flex:0 1 auto;
}
 
.sv-gi-card .sv-meta-text,
.sv-skill-card .sv-meta-text{
  min-width:0;
  word-wrap:break-word;
  text-align:center;
 
  font-weight:900;
  font-size:12px;
  line-height:1.02;
  letter-spacing:0.08px;
  color:var(--sv-ui-text1);
}
 
.sv-gi-card .sv-meta-lines span,
.sv-skill-card .sv-meta-lines span{ display:block; }
 
.sv-gi-card .sv-meta-text .sv-def,
.sv-skill-card .sv-meta-text .sv-def{ cursor:default; }
 
.sv-gi-card .sv-meta-text .sv-def-text,
.sv-skill-card .sv-meta-text .sv-def-text{
  color:inherit;
  border-bottom:none;
}
 
.sv-gi-card .sv-meta-text .sv-meta-lines span + span,
.sv-skill-card .sv-meta-text .sv-meta-lines span + span{
  margin-top:1px;
 
  font-size:10px;
  font-weight:800;
  letter-spacing:0.12px;
  color:var(--sv-ui-text3);
}
 
.sv-gi-card .sv-meta-hit,
.sv-skill-card .sv-meta-hit{
  position:absolute;
  top:0; right:0; bottom:0; left:0;
  z-index:5;
  opacity:0;
}
 
.sv-gi-card .sv-meta-hit .sv-def,
.sv-skill-card .sv-meta-hit .sv-def{
  display:block;
  width:100%;
  height:100%;
}
 
/* -------------------------------------------------------------------------- */
/* 6) Requirements and users row */
/* -------------------------------------------------------------------------- */
 
.sv-gi-card .sv-reqrow,
.sv-skill-card .sv-reqrow{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
}
 
.sv-gi-card .sv-disclose,
.sv-skill-card .sv-disclose{
  flex:0 1 190px;
  max-width:205px;
}
 
.sv-gi-card .sv-reqrow .sv-disclose-btn,
.sv-skill-card .sv-reqrow .sv-disclose-btn{
  min-height:36px;
  padding:0 12px;
  border-radius:999px;
}
 
/* -------------------------------------------------------------------------- */
/* 7) Level selector wrapper */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


Line 180: Line 311:


/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* 6) Skill scaling */
/* 8) Skill scaling */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


Line 207: Line 338:
}
}


/* Two columns; mobile stacks. */
.sv_skill_scaling__body{
.sv_skill_scaling__body{
   display:grid;
   display:grid;
Line 214: Line 344:
   row-gap:12px;
   row-gap:12px;
   align-items:start;
   align-items:start;
   justify-items:center;
   justify-items:stretch;
}
 
.sv_skill_scaling__group{
  width:100%;
  min-width:0;
  padding:10px 12px;
 
  border-radius:16px;
  background:var(--sv-ui-bg0);
  background-image:none;
  box-shadow:none;
}
}


/* Center the left cluster. */
.sv_skill_scaling__group--primary-stats{
.sv_skill_scaling__cluster{
   grid-column:1;
   grid-column:1;
   grid-row:1;
   grid-row:1;


  display:flex;
  align-items:center;
  justify-content:center;
}
.sv_skill_scaling__group--core{
  grid-column:2;
  grid-row:1;
}
.sv_skill_scaling__cluster{
   display:inline-flex;
   display:inline-flex;
   align-items:center;
   align-items:center;
Line 235: Line 386:
}
}


/* Keep the core column full-width. */
.sv_skill_scaling__column--core{
.sv_skill_scaling__column--core{
  grid-column:2;
  grid-row:1;
   width:100%;
   width:100%;
   min-width:0;
   min-width:0;
}
}


/* Neutral wrappers. */
.sv_skill_scaling__column{
.sv_skill_scaling__column{
   min-width:0;
   min-width:0;
Line 538: Line 684:


/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* 7) Tab panels and content */
/* 9) Tab panels and content */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


Line 586: Line 732:


/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* Mechanics tab */
/* 10) Mechanics tab */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


Line 597: Line 743:
}
}


.sv-skill-tabs .sv-mech-panel__mods,
.sv-skill-tabs .sv-mech-panel__group{
.sv-skill-tabs .sv-mech-panel__keywords{
   min-width:0;
   min-width:0;
   max-width:100%;
   max-width:100%;
  padding:10px 12px;
  border-radius:16px;
  background:var(--sv-ui-bg0);
  background-image:none;
  box-shadow:none;
}
}


Line 729: Line 880:


/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* 8) Effect cards */
/* 11) Effect cards */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


Line 808: Line 959:


/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/* 9 Responsive */
/* 12) Responsive */
/* -------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


Line 890: Line 1,041:
   .sv-skill-title{ font-size:18px; }
   .sv-skill-title{ font-size:18px; }
   .sv-skill-desc{ font-size:13px; }
   .sv-skill-desc{ font-size:13px; }
  .sv-skill-meta-block{
    padding:9px 10px;
  }


   .sv_skill_scaling{ padding:9px 10px 10px; }
   .sv_skill_scaling{ padding:9px 10px 10px; }
Line 901: Line 1,056:
   }
   }


   .sv_skill_scaling__column--core{
   .sv_skill_scaling__group{
    padding:9px 10px;
  }
 
  .sv_skill_scaling__group--core{
     grid-column:1;
     grid-column:1;
     grid-row:2;
     grid-row:2;
    width:100%;
   }
   }


Line 926: Line 1,084:
   .sv-skill-tabs .sv-mech-panel__mods,
   .sv-skill-tabs .sv-mech-panel__mods,
   .sv-skill-tabs .sv-mech-panel__keywords{ grid-column:1; }
   .sv-skill-tabs .sv-mech-panel__keywords{ grid-column:1; }
  .sv-skill-tabs .sv-mech-panel__group{
    padding:9px 10px;
  }


   .sv-skill-tabs .sv-mech-panel__keywords{ margin-top:0; }
   .sv-skill-tabs .sv-mech-panel__keywords{ margin-top:0; }
Line 1,021: Line 1,183:


   .sv-skill-level{ padding:9px 10px; }
   .sv-skill-level{ padding:9px 10px; }
}
}


Retrieved from "https://spiritvale.info/wiki/Module:GameInfo/styles.css"