jepler/circuitpython-org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

rework save changes button and mobile layout for filter

Browse source
This commit is contained in:
Justin Cooper 2019-03-25 15:02:42 -05:00
parent 76c11f3855
commit c68d65896d
2 changed files with 18 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
assets/sass/pages/_downloads.scss
View file

@ -90,6 +90,7 @@
} }
.downloads-filter-content { .downloads-filter-content {
position: relative;
display: none; display: none;
// this row spans to the edge // this row spans to the edge
grid-column: span 3; grid-column: span 3;
@ -132,17 +133,19 @@
} }
.filter-buttons { .filter-buttons {
display: flex; position: absolute;
justify-content: flex-end; top: 20px;
margin-top: 20px; height: 50px;
right: 0;
width: 50px;
button { button {
padding: 15px; width: 50px;
height: 50px;
background-color: $purple; background-color: $purple;
color: #fff; color: #fff;
border: none; border: none;
border-radius: 5px; border-radius: 5px;
margin-left: 10px;
cursor: pointer; cursor: pointer;
} }
} }
@ -216,6 +219,13 @@
width: 100%; width: 100%;
} }
} }
.downloads-filter-content > div {
grid-template-columns: repeat(1, 1fr);
& > div {
margin-top: 10px;
}
}
.downloads-section { .downloads-section {
grid-template-columns: repeat(1, 1fr); grid-template-columns: repeat(1, 1fr);
} }

6
downloads.html
View file

@ -19,6 +19,9 @@ permalink: /downloads
</div> </div>
</div> </div>
<div class="downloads-filter-content"> <div class="downloads-filter-content">
<div class="filter-buttons">
<button class="save-changes"><i class="fas fa-times"></i></button>
</div>
<div> <div>
<div class="manufacturers"> <div class="manufacturers">
<h2>Manufacturers</h2> <h2>Manufacturers</h2>
@ -37,9 +40,6 @@ permalink: /downloads
</ul> </ul>
</div> </div>
</div> </div>
<div class="filter-buttons">
<button class="save-changes">SAVE CHANGES</button>
</div>
</div> </div>
<div class="downloads-section"> <div class="downloads-section">
{% assign boards = site.data.files | sort: "downloads" | reverse %} {% assign boards = site.data.files | sort: "downloads" | reverse %}