ivabus/www
1
0
Fork 0
mirror of https://github.com/ivabus/www synced 2024-11-22 23:25:07 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Working on package grid display

Browse source
This commit is contained in:
Thomas Smith 2022-09-09 14:58:30 -04:00
parent d2a22a13ee
commit 421fcd8611
4 changed files with 97 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

73
src/layouts/index.html
View file

@ -56,22 +56,79 @@
<!-- Package Grid --> <!-- Package Grid -->
<style>
.grid-square{
background-color: gray;
width: 100%;
height: 400px;
}
</style>
<section> <section>
<div class="container"> <div class="container">
<div class="row">
<div class="col">
<div class="row mb-4">
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<img src="/Images/package-thumb-1.jpg" alt="spaceid">
<p class="package-label">V2.35 >45 installs</p>
{{- partial "detail-btn.html" . -}}
</div> </div>
<div class="col"> <div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div> </div>
<div class="col"> <div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div> </div>
<div class="col"> <div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div> </div>
</div> </div>
<div class="row mb-4">
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
</div>
<div class="row mb-4">
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
</div>
<div class="row mb-4">
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<img src="/Images/package-thumb-1.jpg" alt="spaceid">
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
<div class="col-lg-3 col-md-4 col-sm-12 col-12">
<div class="grid-square"></div>
</div>
</div>
</div> </div>
</section> </section>

22
src/layouts/partials/detail-btn.html Normal file
View file

@ -0,0 +1,22 @@
<style>
.detail-btn{
display:inline-block;
font-family: "pp-neue-machina", sans-serif;
background-color: #1a1a1a;
border: .5px solid #ffffff;
color: #fff;
padding-top: 5px;
text-decoration: none;
text-transform: uppercase;
width: 35%;
height: 40px;
transition: 0.1s linear;
}
.detail-btn:hover{
background-color: #8000ff;
box-shadow: inset 0px 0px 0px 4px #1a1a1a !important;
}
</style>
<button href="#" class="detail-btn">details</button>

BIN
src/static/Images/package-thumb-1.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 66 KiB

10
src/static/css/style.css
View file

@ -227,3 +227,13 @@ hr{
width:600px; width:600px;
} }
} }
/* Package Display Section */
.package-label{
font-size: 1rem;
}
.detail-btn{
float:right;
}