Sb forum speech.png DiscordLink.png FacebookLink.png RedditLink.png SteamLink.png TwitterLink.png YoutubeLink.png

Difference between revisions of "Template:SB Infobox Compact"

From Starbase wiki
Jump to navigation Jump to search
m
m (Removed stylesheets: ported to common.css)
 
Line 5: Line 5:
}}
}}
}}
}}
{{#css:
</includeonly>
.Infobox-Compact {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(22em,1fr));
  grid-gap: 0.5em
}
 
.Infobox-Compact .SB-Infobox-Image-Wrap img {
  max-height: 10em;
}
.Infobox-Compact .SB-Infobox-Edgeless .SB-Infobox-Image-Wrap img {
  max-height: 16em;
}
 
.Infobox-Compact .SB-Infobox {
  float: none;
  clear: none;
  padding: 0;
  width: auto;
  margin: 0;
}
 
.Infobox-Compact .SB-Infobox-Data-Section-Header::before, .Infobox-Compact .SB-Infobox-Header-Caption, .Infobox-Compact p, .Infobox-Compact .IB-Components, .Infobox-Compact .SB-Infobox-Component-Wrap {
  display: none;
}
 
.Infobox-Compact .SB-Infobox-Data-Section-Header {
  margin-top: 0.25em;
}
 
.Infobox-Compact .SB-Infobox-Name {
  font-size: 1.6em;
}
 
.Infobox-Compact .SB-Infobox-Image-Wrap {
  margin: auto;
  background: none;
  padding: 0;
}
.Infobox-Compact .SB-Infobox-Image-Wrap a {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 12em;
}
 
.Infobox-Compact .SB-Infobox-Header {
  background: linear-gradient(transparent,#3a808045);
  position:relative;
}
 
.Infobox-Compact .SB-Infobox-Header::after {
  content: " ";
  background: linear-gradient(transparent,#3a80807d);
  transition: opacity .125s ease-in-out;
  opacity: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index:-1;
}
 
.Infobox-Compact .SB-Infobox-Header:hover:after{
  opacity: 1;
}
 
.Infobox-Compact .SB-Infobox-Construction-Section {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(10em,1fr));
    column-gap: 0.5em;
    padding: 0 0.4em;
}
 
}}</includeonly>

Latest revision as of 19:53, 7 March 2022

Cookies help us deliver our services. By using our services, you agree to our use of cookies.