Template:OSProject/style.css

.tpl-osproject-grid { display: flex; flex-flow: row wrap; justify-content: flex-start; }

.tpl-osproject-tile { background: #f8f9fa; border: 1px solid #eaecf0; padding: 1em 2em; border-radius: 2px; margin: 0 1em 1em 0; flex: 0 1 300px;

/* Make each tile a flex container so that we can control where the growth goes * in this case, make the growth to the the tagline so that the links are always * aligned at the bottom of each row's tiles. */ display: flex; flex-flow: column; justify-content: flex-start; }

.tpl-osproject-tile-title { margin-top: 0; line-height: 1; display: block; /* override Minerva `.in-block` */ } .tpl-osproject-tile-title a, .tpl-osproject-tile-title a.external { color: inherit; } .tpl-osproject-tile-title > span.mw-headline { display: inline; /* override Minerva `.in-block > span` */ width: auto; /* override Minerva `.in-block .mw-headline` */ }

.tpl-osproject-tile-lang { float: right; } .tpl-osproject-tile-lang em { color: #72777d; font-weight: normal; font-style: normal; } .tpl-osproject-tile-lang em:before { content: '('; } .tpl-osproject-tile-lang em:after { content: ')'; }

.tpl-osproject-tile-tagline { font-size: 1.2em; line-height: 1.4; flex-grow: 2; }

.tpl-osproject-tile-links { margin: 0; }

.tpl-osproject-tile-links li { display: inline-block; } .tpl-osproject-tile-links li:after { content: " · "; font-weight: bold; } .tpl-osproject-tile-links li:last-child:after { content: none; }

.tpl-osproject-screenreader { display: block; position: absolute !important; clip: rect( 1px, 1px, 1px, 1px ); width: 1px; height: 1px; margin: -1px; border: 0; padding: 0; overflow: hidden; }