diff --git a/Dockerfile b/Dockerfile deleted file mode 100644 index 299ac20..0000000 --- a/Dockerfile +++ /dev/null @@ -1,4 +0,0 @@ -FROM docker.io/library/nginx:alpine - -# Copy files to nginx path -COPY . /usr/share/nginx/html diff --git a/README.md b/README.md index f7245c1..1b81e1c 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,7 @@ # TechTransThai.org -Source code for the front page of [TechTransThai.org](https://www.techtransthai.org), showcasing our currently available services, projects and authors. Written in plain HTML and CSS. +Source code for the [TechTransThai.org](https://www.techtransthai.org) website, showcasing our currently available services, projects and team members. Written in plain HTML and CSS. Inspired by [Flathub](https://flathub.org). + +This website will work just fine WITHOUT Javascript. [![Please don't upload to GitHub](https://nogithub.codeberg.page/badge.svg)](https://nogithub.codeberg.page) \ No newline at end of file diff --git a/avatars/nekovari.jpg b/avatars/nekovari.jpg new file mode 100644 index 0000000..df6b3d5 Binary files /dev/null and b/avatars/nekovari.jpg differ diff --git a/avatars/placeholder.png b/avatars/placeholder.png new file mode 100644 index 0000000..8fd76a6 Binary files /dev/null and b/avatars/placeholder.png differ diff --git a/browser.html b/browser.html deleted file mode 100644 index 4607b3f..0000000 --- a/browser.html +++ /dev/null @@ -1,61 +0,0 @@ - - - - - - - ข้อมูลเบราว์เซอร์ - - - - -
- - - -
-

ข้อมูลเบราว์เซอร์

-
-
-
- -
- - -
-
- - - - diff --git a/index.html b/index.html index 3c12bff..3d501d5 100644 --- a/index.html +++ b/index.html @@ -5,290 +5,170 @@ - TechTransThai 🏳️‍⚧️ + TechTransThai
- +
- TTT Logo -

TechTransThai 🏳️‍⚧️

-
-
- -
-
- - -
- - - - -
- วงแหวนเว็บ -
- -
- -
- DATE-VERSION -
- -
- -
- สถานะการให้บริการ -
+ +
-
- -

บริการสาธารณะ

-
+
+ +

เทคทรานส์ไทย 🏳️‍⚧️ 🇹🇭

+ + ชุมชนเทคโนโลยีสำหรับคนข้ามเพศและพันธมิตรในประเทศไทย เราให้ความสำคัญกับซอฟต์แวร์เสรี แพลตฟอร์มกระจายศูนย์ และข้อมูลเปิด - -
-
- Invidious -
-
-

Invidious

-

ดูวิดีโอจาก YouTube ไร้โฆษณากวนใจ

-
-
- Visit... -
-
+ -
+ +

บริการ โปรเจกต์ และคอนเทนต์ของเรา

- -
-
- LibreSpeed -
-
-

LibreSpeed

-

ทดสอบความเร็วอินเทอร์เน็ต

-
-
- Visit... -
-
- -
- - -
-
- little-lines -
-
-

Little Lines

-

ระบบนำทางสำหรับล้อขนาดเล็ก

-
-
- Visit... -
-
- -
- - -
-
- syncthing-relay -
-
-

Syncthing Relay

-

Relay server สำหรับ Syncthing

-
-
- Stats... -
-
- -
- -

เฉพาะบุคคลที่ได้รับอนุญาตเท่านั้น

-
- - - -
-
- Nextcloud -
-
-

TechTransThai Cloud

-

Nextcloud instance ของเรา

-
-
- Visit... -
-
- -
- -
-
- Sharkey -
-
-

TechTransThai F-Social

-

Sharkey instance ของเรา

-
-
- Visit... -
-
- -
- - -
-
- Home Assistant -
-
-

TechTransThai Home

-

Home Assistant instance ของเรา

-
-
- Visit... -
-
- -
- - -
-
- Peertube -
-
-

TechTransThai Video

-

Peertube instance ของเรา

-
-
- Visit... -
-
- -
- - - - -

โปรเจกต์

- -
- - -
-
- FOSS4Change -
-
-

FOSS4Change

-

ร่วมสร้างความเปลี่ยนแปลงด้วยโอเพนซอร์ส

-
-
- Visit... -
-
- -
- - -
-
- Compute4Change -
+
+ +
+ Compute4Change

Compute4Change

อัปเดตความเคลื่อนไหวจากวงการ BOINC

+
+
+ +
+ FOSS4Change
- Visit... +

FOSS4Change

+

ร่วมสร้างความเปลี่ยนแปลงด้วยโอเพนซอร์ส

-
- -

เครื่องมือ

- -
- -
-

หมายเลข IP

+
+ + -

รู้จักกับเรา

-
diff --git a/install.sh b/install.sh index d40fd55..74574c9 100755 --- a/install.sh +++ b/install.sh @@ -1,10 +1,4 @@ systemctl --user stop ttt-org cp ttt-org.container ~/.config/containers/systemd systemctl --user daemon-reload - -sed -i "s/DATE/$(date -I)/g" index.html -sed -i "s/VERSION/$(git log -1 --oneline | awk '{print $1}')/g" index.html -podman build -t ttt-org . - - systemctl --user start ttt-org diff --git a/ip.html b/ip.html deleted file mode 100644 index b611b83..0000000 --- a/ip.html +++ /dev/null @@ -1,46 +0,0 @@ - - - - - - - หมายเลข IP - - - - - - -
- - - -
-

หมายเลข IP

-
-
- - - - diff --git a/navbar.css b/navbar.css new file mode 100644 index 0000000..8ea0d5a --- /dev/null +++ b/navbar.css @@ -0,0 +1,77 @@ +.header { + display: flex; + justify-content: center; + align-items: center; +} + + +@media (prefers-color-scheme: light) { + + .headerbutton { + color: black; + border: none; + border-radius: 8px; + justify-content: center; + align-items: center; + text-decoration: none; + display: flex; + font-size: 16px; + margin: 4px 2px; + padding-left: 0.3cm; + padding-right: 0.3cm; + cursor: pointer; + height: 35px; + transition-duration: 0.2s; + } + + .headerbutton:hover { + background-color: #fafafa; + } + + .topbar { + position: fixed; + width: 100%; + top: 0px; + left: 0px; + background-color: rgba(255, 255, 255, 1); + border: 1px solid rgba(224, 224, 224, 1); + color: #000000; + z-index: 10; + } + +} + +@media (prefers-color-scheme: dark) { + + .headerbutton { + color: #ffffff; + border: none; + border-radius: 8px; + justify-content: center; + align-items: center; + text-decoration: none; + display: flex; + font-size: 16px; + margin: 4px 2px; + padding-left: 0.3cm; + padding-right: 0.3cm; + cursor: pointer; + height: 35px; + transition-duration: 0.2s; + } + + .headerbutton:hover { + background-color: #4a4a4a; + } + + .topbar { + position: fixed; + width: 100%; + top: 0px; + left: 0px; + background-color: #303030; + border: 1px solid #1f1f1f; + color: #ffffff; + z-index: 10; + } +} diff --git a/style.css b/style.css index b10d465..2cde754 100644 --- a/style.css +++ b/style.css @@ -1,4 +1,5 @@ @import url("cantarell/cantarell.css"); +@import url("navbar.css"); html * { @@ -26,30 +27,37 @@ html * flex-direction: column; } -.pfp { - display: flex; - justify-content: center; - align-items: center; - margin-top: 3cm; -} - -.middle { +.middle-large { grid-area: middle; - width: 15cm; + width: 80vw; + max-width: 35cm; } - -.inner-grid { - display: grid; - align-items: center; - grid-template-columns: 3cm 1fr 3cm; - grid-template-areas: - 'inner-left inner-middle inner-right' -} .description { font-size: 10pt; margin-top: -0.3cm; + opacity: 0.7; +} + +.pronouns { + font-size: 12pt; opacity: 0.5; + margin-left: 0.25cm; +} + +.row { + display: flex; + justify-content: space-between; +} + +.itemcard-placeholder { + display: grid; + border-radius: 12px; + text-decoration: none; + margin-bottom: 0.5cm; + min-height: 3cm; + min-width: 6cm; + width: 32.5% } @media (prefers-color-scheme: light) { @@ -60,6 +68,8 @@ html * .logo { color: #000; + font-weight: bold; + text-decoration: none; } .grid-container { @@ -70,129 +80,29 @@ html * 'left middle right' } - .button { - background-color: #EBEBEB; - color: black; - border: none; - border-radius: 8px; - justify-content: center; - align-items: center; - text-decoration: none; + .listaction { display: flex; - font-size: 16px; + color: black; + align-items: center; + } + + .button { + height: 1cm; + border-radius: 6px; + background-color: rgba(0, 0, 0, 0.08); + color: black; + text-decoration: none; font-weight: bold; - margin: 4px 2px; - cursor: pointer; - width: 100px; - height: 35px; + padding: 10px 10px; + margin-top: 1cm; + margin-bottom: 1cm; transition-duration: 0.2s; } .button:hover { - background-color: #E0E0E0; + background-color: rgba(0, 0, 0, 0.18); } - .headerbutton { - background-color: #EBEBEB; - color: black; - border: none; - border-radius: 8px; - justify-content: center; - align-items: center; - text-decoration: none; - display: flex; - font-size: 16px; - font-weight: bold; - margin: 4px 2px; - padding-left: 0.3cm; - padding-right: 0.3cm; - cursor: pointer; - height: 35px; - transition-duration: 0.2s; - } - - .headerbutton:hover { - background-color: #E0E0E0; - } - - .list { - border-radius: 12px 12px 12px 12px; - background-color: #ffffff; - box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13); - margin-bottom: 50px; - } - - .separator { - width: 15cm; - height: 1px; - background-color: rgba(237, 237, 237, 1); - } - - .listaction { - display: grid; - grid-template-columns: 1fr 1cm; - text-decoration: none; - color: black; - align-items: center; - height: 1.5cm; - } - - .listinfo { - display: grid; - grid-template-columns: 1fr 2fr; - text-decoration: none; - color: black; - align-items: center; - height: 1.5cm; - } - - .topbar { - position: fixed; - width: 100%; - height: 1.2cm; - top: 0px; - left: 0px; - background-color: rgba(255, 255, 255, 1); - border: 1px solid rgba(224, 224, 224, 1); - color: #000000; - z-index: 10; - } - - - .backbutton { - position: absolute; - color: black; - border-radius:10px; - justify-content: center; - align-items: center; - text-decoration: none; - display: grid; - font-size: 14px; - cursor: pointer; - margin: 0.1cm; - transition-duration: 0.2s; - width: 1cm; - height: 1cm; - } - - .backbutton:hover { - background-color: #DEDEDE; - } - - .banner { - position: fixed; - background-color: #BFD7F3; - color: black; - width: 100%; - height: 1.2cm; - top: 0px; - left: 0px; - justify-content: center; - align-items: center; - display: flex; - font-weight: bold; - text-align: center; - } .gtk-button-pill { position: relative; @@ -211,149 +121,80 @@ html * padding: 0px 32px; flex-wrap: nowrap; } + + .itemcard { + display: grid; + border-radius: 12px; + text-decoration: none; + background-color: #ffffff; + box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13); + margin-bottom: 0.5cm; + min-height: 3cm; + min-width: 6cm; + width: 32.5%; + transition-duration: 0.2s; + } + .itemcard-stealth { + display: grid; + border-radius: 12px; + text-decoration: none; + margin-bottom: 0.5cm; + min-height: 3cm; + min-width: 6cm; + width: 32.5%; + transition-duration: 0.2s; + } + + .itemcard:hover { + background-color: #fafafa; + } + + .itemcard-stealth:hover { + background-color: #e0e0e0; + } } @media (prefers-color-scheme: dark) { - .logo { - color: #fff; - } - body { background-color: #222222; } + .logo { + color: #fff; + font-weight: bold; + text-decoration: none; + } + .grid-container { display: grid; justify-content: center; - color: #ffffff; + color: #fff; grid-template-areas: - 'left middle right' + 'left middle right' + } + + .listaction { + display: flex; + color: white; + align-items: center; } .button { - background-color: #4a4a4a; - color: #ffffff; - border: none; - border-radius: 8px; - justify-content: center; - align-items: center; + height: 1cm; + border-radius: 6px; + background: rgba(255, 255, 255, 0.1); + color: white; text-decoration: none; - display: flex; - font-size: 16px; font-weight: bold; - margin: 4px 2px; - cursor: pointer; - width: 100px; - height: 35px; + padding: 10px 10px; + margin-top: 1cm; + margin-bottom: 1cm; transition-duration: 0.2s; } .button:hover { - background-color: #595959; - } - - .headerbutton { - background-color: #4a4a4a; - color: #ffffff; - border: none; - border-radius: 8px; - justify-content: center; - align-items: center; - text-decoration: none; - display: flex; - font-size: 16px; - font-weight: bold; - margin: 4px 2px; - padding-left: 0.3cm; - padding-right: 0.3cm; - cursor: pointer; - height: 35px; - transition-duration: 0.2s; - } - - .headerbutton:hover { - background-color: #595959; - } - - .list { - border-radius: 12px 12px 12px 12px; - background-color: #363636; - box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13); - margin-bottom: 50px; - } - - .separator { - width: 15cm; - height: 1px; - background-color: #232323; - } - - .listaction { - display: grid; - grid-template-columns: 1fr 1cm; - text-decoration: none; - color: #ffffff; - align-items: center; - height: 1.5cm; - } - - .listinfo { - display: grid; - grid-template-columns: 1fr 2fr; - text-decoration: none; - color: #ffffff; - align-items: center; - height: 1.5cm; - } - - .topbar { - position: fixed; - width: 100%; - height: 1.2cm; - top: 0px; - left: 0px; - background-color: #303030; - border: 1px solid #1f1f1f; - color: #ffffff; - z-index: 10; - } - - - - .backbutton { - position: absolute; - color: #ffffff; - border-radius:10px; - justify-content: center; - align-items: center; - text-decoration: none; - display: grid; - font-size: 14px; - cursor: pointer; - margin: 0.1cm; - transition-duration: 0.2s; - width: 1cm; - height: 1cm; - } - - .backbutton:hover { - background-color: #3e3e3e; - } - - .banner { - position: fixed; - background-color: #29415E; - color: white; - width: 100%; - height: 1.2cm; - top: 0px; - left: 0px; - justify-content: center; - align-items: center; - display: flex; - font-weight: bold; - text-align: center; + background: rgba(255, 255, 255, 0.18); } .gtk-button-pill { @@ -373,4 +214,35 @@ html * padding: 0px 32px; flex-wrap: nowrap; } + + .itemcard { + display: grid; + border-radius: 12px; + text-decoration: none; + background-color: #303030; + box-shadow: 0px 1px 4px 1px rgba(0, 0, 0, 0.13); + margin-bottom: 0.5cm; + min-height: 3cm; + min-width: 6cm; + width: 32.5%; + transition-duration: 0.2s; + } + .itemcard-stealth { + display: grid; + border-radius: 12px; + text-decoration: none; + margin-bottom: 0.5cm; + min-height: 3cm; + min-width: 6cm; + width: 32.5%; + transition-duration: 0.2s; + } + + .itemcard:hover { + background-color: #4a4a4a; + } + + .itemcard-stealth:hover { + background-color: #4a4a4a; + } } diff --git a/team.html b/team.html new file mode 100644 index 0000000..c202d8b --- /dev/null +++ b/team.html @@ -0,0 +1,117 @@ + + + + + + + + TechTransThai + + + + + +
+ +
+ + + + + + diff --git a/ttt-org.container b/ttt-org.container index b327621..06e4961 100644 --- a/ttt-org.container +++ b/ttt-org.container @@ -3,8 +3,9 @@ Description=TechTransThai.org Website [Container] ContainerName=ttt-org -Image=ttt-org +Image=docker.io/library/nginx:alpine PublishPort=8082:80 +Volume=/run/media/core/Data1/Apps/www.techtransthai.org:/usr/share/nginx/html:ro,z [Service] Restart=always