mirror of
https://github.com/ivabus/www
synced 2024-11-22 20:45:06 +03:00
Beautification; mobile optimization
This commit is contained in:
parent
d07f1804db
commit
08bda95f88
3 changed files with 44 additions and 6 deletions
|
@ -13,7 +13,7 @@ function Bottles() {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<p>{names.length} packages</p>
|
<p>Showing {names.length} packages</p>
|
||||||
{names.map((name) => (
|
{names.map((name) => (
|
||||||
<Bottle key={name} name={name} />
|
<Bottle key={name} name={name} />
|
||||||
))}
|
))}
|
||||||
|
@ -27,9 +27,9 @@ function Bottles() {
|
||||||
];
|
];
|
||||||
return (
|
return (
|
||||||
<div className="expand" onClick={() => toggleExpanded(!expanded)}>
|
<div className="expand" onClick={() => toggleExpanded(!expanded)}>
|
||||||
<div className="expand-text">
|
<div className="expand-text one-box-down">
|
||||||
<h3>{name}</h3>
|
<h3 className="display-3">{name}</h3>
|
||||||
<h4>
|
<h4 className="display-6">
|
||||||
{versions.length} version{versions.length === 1 ? "" : "s"} bottled
|
{versions.length} version{versions.length === 1 ? "" : "s"} bottled
|
||||||
</h4>
|
</h4>
|
||||||
</div>
|
</div>
|
||||||
|
@ -64,6 +64,9 @@ function Bottles() {
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
)}
|
)}
|
||||||
|
<div className="one-box-down">
|
||||||
|
<hr />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,7 +3,19 @@
|
||||||
<section>
|
<section>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col">
|
<div class="col title-col" style="padding:1.4vw;">
|
||||||
|
<h1 class="display-1">Bottles</h1>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
|
||||||
|
<section>
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col bottles-container">
|
||||||
|
|
||||||
{{- partial "bottle-grid.html" -}}
|
{{- partial "bottle-grid.html" -}}
|
||||||
|
|
||||||
|
@ -16,10 +28,11 @@
|
||||||
|
|
||||||
table{
|
table{
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
table, th, td {
|
table, th, td {
|
||||||
border: 1px solid;
|
border: 1px solid #949494;
|
||||||
font-family: "sono", sans-serif;
|
font-family: "sono", sans-serif;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
@ -28,6 +41,27 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 576px) {
|
||||||
|
|
||||||
|
.bottles-container{
|
||||||
|
padding: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
table, th, td {
|
||||||
|
border: 1px solid #949494;
|
||||||
|
font-family: "sono", sans-serif;
|
||||||
|
padding: 10px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-col{
|
||||||
|
padding: 4vw !important;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
1
src/layouts/partials/tea-icon.html
Normal file
1
src/layouts/partials/tea-icon.html
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<i class="icon-tea-logo-iconasset-1">
|
Loading…
Reference in a new issue