374 lines
12 KiB
Svelte
374 lines
12 KiB
Svelte
<script lang="ts" xmlns:svelte="http://www.w3.org/1999/html">
|
||
import Download from './icons/Download.svelte';
|
||
import Terminal from './icons/Terminal.svelte';
|
||
import Check from './icons/Check.svelte';
|
||
import PhotoSwipeLightbox from 'photoswipe/lightbox';
|
||
import 'photoswipe';
|
||
import 'photoswipe/style.css';
|
||
import { onMount } from 'svelte';
|
||
import Telegram from './icons/Telegram.svelte';
|
||
import Mastodon from './icons/Mastodon.svelte';
|
||
|
||
let downloadIsPressed = false;
|
||
let checksumSwayIsPressed = false;
|
||
let checksumRiverIsPressed = false;
|
||
|
||
|
||
onMount(() => {
|
||
let lightbox = new PhotoSwipeLightbox({
|
||
gallery: '#sway-screenshots',
|
||
children: 'a',
|
||
pswpModule: () => import('photoswipe')
|
||
});
|
||
lightbox.init();
|
||
});
|
||
onMount(() => {
|
||
document.body.addEventListener('click', (e) => {
|
||
let classes = (e.target as HTMLElement).classList;
|
||
if(classes.contains('download-all') == false) {
|
||
downloadIsPressed = false;
|
||
}
|
||
|
||
if(classes.contains('checksum-sway') == false) {
|
||
checksumSwayIsPressed = false;
|
||
}
|
||
if(classes.contains('checksum-river') == false) {
|
||
checksumRiverIsPressed = false;
|
||
}
|
||
})
|
||
});
|
||
</script>
|
||
|
||
<svelte:head>
|
||
<title>TileOS</title>
|
||
</svelte:head>
|
||
|
||
<div class="flex justify-center items-center flex-col text-center bg-[#24273a]">
|
||
<img alt="" height="216px" src="tileos.svg" width="216px" />
|
||
<h1 class="text-3xl font-bold">TileOS</h1>
|
||
<p class="m-5">Debian-based distribution with tiling window managers.</p>
|
||
<div class="flex flex-row flex-wrap m-7 justify-center">
|
||
<div class="relative inline-block text-left">
|
||
<div>
|
||
<button
|
||
class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#6993e9] download-all"
|
||
on:click={() => {
|
||
downloadIsPressed = !downloadIsPressed;
|
||
}}
|
||
>
|
||
<Download className="mr-1.5 download-all"></Download>
|
||
Download
|
||
</button>
|
||
</div>
|
||
<div
|
||
class="absolute left-0 mx-5 my-3 w-56 rounded-md bg-[#6993e9] {downloadIsPressed
|
||
? 'transition-all ease-in duration-75 opacity-100 scale-100 visible'
|
||
: 'opacity-0 transition-all ease-out duration-100 scale-95 invisible'}"
|
||
>
|
||
<div class="py-1">
|
||
<!-- Sway/River Download Links Under Logo -->
|
||
<p class="block px-4 py-2 text-sm">
|
||
<a href="https://downloads.tile-os.com/beta/sway/tileos-sway-1.0-desktop-beta-amd64.iso"
|
||
>Download (1.0-beta Sway)</a
|
||
>
|
||
<a
|
||
class="underline"
|
||
href="https://downloads.tile-os.com/beta/sway/tileos-sway-1.0-desktop-beta-amd64.sha256.txt"
|
||
>(sha256)</a
|
||
>
|
||
<a
|
||
class="underline"
|
||
href="https://downloads.tile-os.com/beta/sway/tileos-sway-1.0-desktop-beta-amd64.md5.txt"
|
||
>(md5)</a
|
||
>
|
||
</p>
|
||
<p class="block px-4 py-2 text-sm">
|
||
<a
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.iso"
|
||
>Download (1.0-beta River)</a
|
||
>
|
||
<a
|
||
class="underline"
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.sha256.txt"
|
||
>(sha256)</a
|
||
>
|
||
<a
|
||
class="underline"
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.md5.txt"
|
||
>(md5)</a
|
||
>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Source Code Link -->
|
||
<a class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#73b4d1]" href="https://gitlab.com/tile-os">
|
||
<Terminal className="mr-1.5"></Terminal>
|
||
Source Code</a
|
||
>
|
||
<a class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#8aadf4]" href="https://t.me/tile_os">
|
||
<Telegram className="mr-1.5"></Telegram>
|
||
Telegram</a
|
||
>
|
||
<a class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#c6a0f6]" href="https://mastodon.social/@tile_os">
|
||
<Mastodon className="mr-1.5"></Mastodon>
|
||
Mastodon</a
|
||
>
|
||
</div>
|
||
<div class="flex flex-wrap flex-col p-8">
|
||
<div class="m-5">
|
||
<h2 class="font-bold text-2xl mb-3">Some of the features:</h2>
|
||
|
||
<ul class="mb-8 list-disc text-left">
|
||
<li>Stable and solid Debian base with some packages backported from Debian Testing;</li>
|
||
<li>Fully pre-configured desktop based on a tiling window manager (or Wayland compositor);</li>
|
||
<li>Fresh and stable graphics drivers (Mesa) backported from Debian Testing;</li>
|
||
<li>Many device drivers and non-free firmwares are included in the base system;</li>
|
||
<li>Included some performance optimizations as well as some system tweaks (see);</li>
|
||
<li>Included additional repositories for installing programs not found in Debian, such as OnlyOffice, VirtualBox, Librewolf, Visual Studio Code and Brave;</li>
|
||
<li>Ability to install additional software in the Calamares installer.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="flex flex-col xl:flex-row p-8">
|
||
<div class="flex-1 m-5">
|
||
<h1 class="font-bold text-3xl mb-3">TileOS 1.0 "T-Rex" Sway Edition</h1>
|
||
<p>
|
||
TileOS Sway is a flagship edition featuring Sway - a lightweight and highly customizable
|
||
Wayland compositor. It is designed to be compatible with the i3 window manager but is built
|
||
using the Wayland display server protocol instead of X11. Sway is a full feature complete
|
||
Wayland compositor, combined with awesome Catppuccin color scheme, Waybar panel and apps
|
||
from NWG project (such as nwg-drawer, nwg-look, etc) it provides powerful, easy to use and
|
||
very flexible desktop.
|
||
</p>
|
||
<div class="flex flex-row flex-wrap m-7 ml-0">
|
||
<!-- Sway Download Link -->
|
||
<a
|
||
class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#6993e9] ml-0"
|
||
href="https://downloads.tile-os.com/beta/sway/tileos-sway-1.0-desktop-beta-amd64.iso"
|
||
>
|
||
<Download className="mr-1.5"></Download>
|
||
Download (1.0-beta Sway)</a
|
||
>
|
||
<div class="relative inline-block text-left">
|
||
<div>
|
||
<button
|
||
class="border-2 p-2.5 mx-5 my-3 ml-0 rounded-md bg-[#8bd5ca] checksum-sway"
|
||
on:click={() => {
|
||
checksumSwayIsPressed = !checksumSwayIsPressed;
|
||
}}
|
||
>
|
||
<Check className="mr-1.5 checksum-sway"></Check>
|
||
Checksums
|
||
</button>
|
||
</div>
|
||
<div
|
||
class="absolute left-0 mx-5 my-3 ml-0 w-56 rounded-md bg-[#8bd5ca] {checksumSwayIsPressed
|
||
? 'transition ease-in duration-75 opacity-100 scale-100'
|
||
: 'opacity-0 transition ease-out duration-100 scale-95'}"
|
||
>
|
||
<div class="py-1">
|
||
<!-- Checksum Download Links -->
|
||
<p class="block px-4 py-2 text-sm">
|
||
<a
|
||
class=""
|
||
href="https://downloads.tile-os.com/beta/sway/tileos-sway-1.0-desktop-beta-amd64.sha256.txt"
|
||
>SHA256</a
|
||
>
|
||
</p>
|
||
<p class="block px-4 py-2 text-sm">
|
||
<a
|
||
class=""
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.md5.txt"
|
||
>MD5</a
|
||
>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="flex-1 m-5">
|
||
<!-- Screenshots -->
|
||
<div class="flex justify-center flex-wrap" id="sway-screenshots">
|
||
<a
|
||
href="screenshots/sway/screen1.png"
|
||
data-pswp-width="1920"
|
||
data-pswp-height="980"
|
||
target="_blank"
|
||
>
|
||
<img
|
||
class="m-4 h-[24wh] w-[48vw] lg:h-[16wh] lg:w-[32vw] xl:h-[8wh] xl:w-[16vw]"
|
||
src="screenshots/sway/screen1.png"
|
||
alt=""
|
||
/>
|
||
</a>
|
||
<a
|
||
href="screenshots/sway/screen2.png"
|
||
data-pswp-width="1920"
|
||
data-pswp-height="980"
|
||
target="_blank"
|
||
>
|
||
<img
|
||
class="m-4 h-[24wh] w-[48vw] lg:h-[16wh] lg:w-[32vw] xl:h-[8wh] xl:w-[16vw]"
|
||
src="screenshots/sway/screen2.png"
|
||
alt=""
|
||
/>
|
||
</a>
|
||
<a
|
||
href="screenshots/sway/screen3.png"
|
||
data-pswp-width="1920"
|
||
data-pswp-height="980"
|
||
target="_blank"
|
||
>
|
||
<img
|
||
class="m-4 h-[24wh] w-[48vw] lg:h-[16wh] lg:w-[32vw] xl:h-[8wh] xl:w-[16vw]"
|
||
src="screenshots/sway/screen3.png"
|
||
alt=""
|
||
/>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="flex flex-col xl:flex-row p-8">
|
||
<div class="flex-1 m-5">
|
||
<h1 class="font-bold text-3xl mb-3">TileOS 1.0 "T-Rex" River Edition</h1>
|
||
<p>
|
||
TileOS River Edtion featuring River - a minimalistic and lightweight dynamic Wayland
|
||
compositor. It is designed to be simple, efficient, and easy to use, making it a great
|
||
choice for users looking for a streamlined window management experience. River automatically
|
||
arranges windows in a tiled layout, maximizing screen space and allowing users to easily
|
||
switch between applications. It has a very simple configuration and low resource
|
||
consumption, сombined with awesome Catppuccin color scheme, Waybar panel and apps from NWG
|
||
project (such as nwg-drawer, nwg-look, etc) it provides powerful, easy to use and very
|
||
flexible desktop.
|
||
</p>
|
||
<div class="flex flex-row flex-wrap m-7 ml-0">
|
||
<!-- River Download Link -->
|
||
<a
|
||
class="border-2 p-2.5 mx-5 my-3 rounded-md bg-[#6993e9] ml-0"
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.iso"
|
||
>
|
||
<Download className="mr-1.5"></Download>
|
||
Download (1.0-beta River)</a
|
||
>
|
||
<div class="relative inline-block text-left">
|
||
<div>
|
||
<button
|
||
class="border-2 p-2.5 mx-5 my-3 ml-0 rounded-md bg-[#8bd5ca] checksum-river"
|
||
on:click={() => {
|
||
checksumRiverIsPressed = !checksumRiverIsPressed;
|
||
}}
|
||
>
|
||
<Check className="mr-1.5 checksum-river"></Check>
|
||
Checksums
|
||
</button>
|
||
</div>
|
||
<div
|
||
class="absolute left-0 mx-5 my-3 ml-0 w-56 rounded-md bg-[#8bd5ca] {checksumRiverIsPressed
|
||
? 'transition ease-in duration-75 opacity-100 scale-100'
|
||
: 'opacity-0 transition ease-out duration-100 scale-95'}"
|
||
>
|
||
<div class="py-1">
|
||
<!-- Checksum Download Links -->
|
||
<p class="block px-4 py-2 text-sm">
|
||
<a
|
||
class=""
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.sha256.txt"
|
||
>SHA256</a
|
||
>
|
||
</p>
|
||
<p class="block px-4 py-2 text-sm">
|
||
<a
|
||
class=""
|
||
href="https://downloads.tile-os.com/beta/river/tileos-river-1.0-desktop-beta-amd64.md5.txt"
|
||
>MD5</a
|
||
>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="flex-1 m-5">
|
||
<!-- Screenshots -->
|
||
<div class="flex justify-center flex-wrap" id="sway-screenshots">
|
||
<a
|
||
href="screenshots/river/screen4.png"
|
||
data-pswp-width="1920"
|
||
data-pswp-height="980"
|
||
target="_blank"
|
||
>
|
||
<img
|
||
class="m-4 h-[24wh] w-[48vw] lg:h-[16wh] lg:w-[32vw] xl:h-[8wh] xl:w-[16vw]"
|
||
src="screenshots/river/screen4.png"
|
||
alt=""
|
||
/>
|
||
</a>
|
||
<a
|
||
href="screenshots/river/screen5.png"
|
||
data-pswp-width="1920"
|
||
data-pswp-height="980"
|
||
target="_blank"
|
||
>
|
||
<img
|
||
class="m-4 h-[24wh] w-[48vw] lg:h-[16wh] lg:w-[32vw] xl:h-[8wh] xl:w-[16vw]"
|
||
src="screenshots/river/screen5.png"
|
||
alt=""
|
||
/>
|
||
</a>
|
||
<a
|
||
href="screenshots/river/screen6.png"
|
||
data-pswp-width="1920"
|
||
data-pswp-height="980"
|
||
target="_blank"
|
||
>
|
||
<img
|
||
class="m-4 h-[24wh] w-[48vw] lg:h-[16wh] lg:w-[32vw] xl:h-[8wh] xl:w-[16vw]"
|
||
src="screenshots/river/screen6.png"
|
||
alt=""
|
||
/>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="flex flex-col lg:flex-row m-7">
|
||
<div class="m-5 flex-1">
|
||
<h2 class="text-2xl font-bold mb-3">System requirements:</h2>
|
||
<ul class="list-disc">
|
||
<li class="ml-[15.3px]">CPU: Dual-core CPU with 1.6 GHz</li>
|
||
<li class="ml-[15.3px]">RAM: 1 GB (Recommended 2GB)</li>
|
||
<li class="ml-[15.3px]">Storage Space: 20 GB</li>
|
||
<li class="ml-[15.3px]">
|
||
GPU: Any Intel or AMD GPU (Nvidia cards require additional settings and are <span
|
||
class="font-bold">NOT</span
|
||
> officially supported.)
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="m-5 flex-1">
|
||
<h2 class="text-2xl font-bold mb-3">Known Issues:</h2>
|
||
<ul class="list-disc">
|
||
<li class="ml-[15.3px]">
|
||
Secure Boot is not officially supported and may break your system! Use it on your own
|
||
risk!
|
||
</li>
|
||
<li class="ml-[15.3px]">
|
||
The installer currently has problems installing on encrypted partitions.
|
||
</li>
|
||
<li class="ml-[15.3px]">
|
||
The installer currently has installation issues when selecting a non-Latin keyboard layout
|
||
(e.g. Russian). You need to choose English keyboard layout while installing the system
|
||
(system region does not matter and you can choose one that you need).
|
||
</li>
|
||
<li class="ml-[15.3px]">Having boot problems on VMware virtual machines.</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|