techtransthai/www.techtransthai.org
techtransthai/www.techtransthai.org
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

implement grid

Browse source
This commit is contained in:
Late Night Defender 2024-07-04 01:18:10 +07:00
parent 78850a7145
commit 386b2c4920
2 changed files with 4 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
index.html
View file

@ -99,8 +99,6 @@
</div>
</div>
</a>
</div>
<div class="row">
<a class="itemcard" target="_blank" rel="noopener noreferrer" href="https://inv.techtransthai.org/feed/trending">
<div class="listaction">
<img src="icons/inv.svg" alt="Invidious" width="80" height="80" style="margin: 0.3cm;">
@ -128,8 +126,6 @@
</div>
</div>
</a>
</div>
<div class="row">
<a class="itemcard" target="_blank" rel="noopener noreferrer" href="https://openkmitl.gitlab.io">
<div class="listaction">
<img src="icons/openkmitl.png" alt="openKMITL" width="80" height="80" style="margin: 0.3cm;">
@ -157,8 +153,6 @@
</div>
</div>
</a>
</div>
<div class="row">
<a class="itemcard" target="_blank" rel="noopener noreferrer" href="https://video.techtransthai.org">
<div class="listaction">
<img src="icons/peertube-logo.svg" alt="Peertube" width="80" height="80" style="margin: 0.3cm;">
@ -203,8 +197,6 @@
</div>
</div>
</a>
</div>
<div class="row">
<a class="itemcard" target="_blank" rel="noopener noreferrer" href="https://forge.techtransthai.org/">
<div class="listaction">
<img src="icons/forgejo.svg" alt="Forgejo" width="80" height="80" style="margin: 0.3cm;">
@ -232,8 +224,6 @@
</div>
</div>
</a>
</div>
<div class="row">
<a class="itemcard" target="_blank" rel="noopener noreferrer" href="https://meet.techtransthai.org/">
<div class="listaction">
<img src="icons/jitsi.svg" alt="Jitsi" width="80" height="80" style="margin: 0.3cm;">
@ -252,7 +242,6 @@
</div>
</div>
</a>
<a class="itemcard-placeholder"></a>
</div>

70
style.css
View file

@ -65,8 +65,9 @@ h1 {
}
.row {
display: flex;
justify-content: space-between;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
grid-gap: 1rem;
}
.button {
@ -117,35 +118,11 @@ h1 {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
height: 3cm;
min-width: 6cm;
width: 32.5%;
transition-duration: 0.2s;
box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13);
}
.itemcard-placeholder {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
min-height: 3cm;
min-width: 6cm;
width: 32.5%
}
.itemcard-stealth {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
height: 3cm;
min-width: 6cm;
width: 32.5%;
transition-duration: 0.2s;
}
.listaction {
display: flex;
align-items: center;
@ -170,39 +147,20 @@ h1 {
width: 90vw;
max-width: 35cm;
}
.row {
display: flex;
flex-direction: column;
}
.itemcard {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
height: 3cm;
min-width: 6cm;
width: 100%;
transition-duration: 0.2s;
box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13);
}
.itemcard-placeholder {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
min-height: 3cm;
min-width: 6cm;
width: 100%
}
.itemcard-stealth {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
height: 3cm;
min-width: 6cm;
width: 100%;
transition-duration: 0.2s;
}
h1 {
@ -217,39 +175,21 @@ h1 {
width: 90vw;
max-width: 35cm;
}
.row {
display: flex;
flex-direction: column;
}
.itemcard {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
height: 3cm;
min-width: 6cm;
width: 100%;
transition-duration: 0.2s;
box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13);
}
.itemcard-placeholder {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
min-height: 3cm;
min-width: 6cm;
width: 100%
}
.itemcard-stealth {
display: grid;
border-radius: 12px;
text-decoration: none;
margin-bottom: 0.5cm;
height: 3cm;
min-width: 6cm;
width: 100%;
transition-duration: 0.2s;
}
h1 {
@ -257,8 +197,6 @@ h1 {
}
}
@media (prefers-color-scheme: light) {
body {