1
0
Fork 0
mirror of https://github.com/GuerillaStudio/vanillalist.git synced 2024-12-30 11:51:57 +00:00

Improve website for small sites

This commit is contained in:
Tixie 2021-03-01 04:46:06 +01:00
parent 4799b393b6
commit 540a1cfab5
3 changed files with 82 additions and 4 deletions

View file

@ -3,4 +3,82 @@
/* ----------------------------------------------------------- */ /* ----------------------------------------------------------- */
@media (max-width: $xsmall) { @media (max-width: $xsmall) {
/* Header
-------------------------------------------------------------- */
.header {
padding: 3rem 0;
}
.header__name {
font-size: 2.1rem;
}
.header_slogan {
font-size: 1.5rem;
}
.header__search {
display: flex;
margin-top: 2rem;
}
.header__search input,
.header__search .btn {
font-size: 1.6rem;
}
.header__search input {
min-width: 0;
}
.header__search .btn {
flex-shrink: 0;
margin-left: .3rem;
}
/* Plugins
-------------------------------------------------------------- */
.pluginList {
row-gap: 4rem;
}
.plugin {
display: grid;
grid-template-columns: 25% 1fr;
align-items: start;
column-gap: 2rem;
}
.plugin__visual {
grid-row: 1 / span 3;
grid-column: 1 / 2;
}
.plugin__name,
.plugin__about,
.plugin__links {
grid-column: 2 / 3;
}
.plugin__name {
margin: 0;
margin-bottom: .5rem;
}
/* Pagination
-------------------------------------------------------------- */
.pagination {
margin-bottom: 0;
}
/* Footer
-------------------------------------------------------------- */
.footer {
padding-top: 3rem;
}
} }

View file

@ -14,7 +14,7 @@ $fontstack2 : Georgia, Times, 'Times New Roman', serif;
// responsive // responsive
// -------------------------------------------------------------- // --------------------------------------------------------------
$xsmall : 480px; $xsmall : 559px;
$small : 768px; $small : 768px;
$medium : 990px; $medium : 990px;
$large : 1282px; $large : 1282px;

View file

@ -86,8 +86,8 @@
// == rwd */ // == rwd */
// -------------------------------------------------------------- // --------------------------------------------------------------
@import '8-rwd/_rwd-large'; // @import '8-rwd/_rwd-large';
@import '8-rwd/_rwd-medium'; // @import '8-rwd/_rwd-medium';
@import '8-rwd/_rwd-small'; // @import '8-rwd/_rwd-small';
@import '8-rwd/_rwd-xsmall'; @import '8-rwd/_rwd-xsmall';
@import '8-rwd/_rwd'; @import '8-rwd/_rwd';