290 lines
10 KiB
Plaintext
290 lines
10 KiB
Plaintext
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="shortcut icon" href="ico/favicon.ico" type="image/x-icon" />
|
|
<link rel="stylesheet" href="css/home.css" />
|
|
<link
|
|
rel="stylesheet"
|
|
href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css"
|
|
/>
|
|
<title>Hyprland</title>
|
|
</head>
|
|
<body>
|
|
<div id="content-center" class="content-center">
|
|
<header id="header" class="header">
|
|
<div id="header-logo-div" class="header">
|
|
<a href="/">
|
|
<img
|
|
id="header-logo"
|
|
class="header"
|
|
src="svg/hyprland.svg"
|
|
alt="Hyprland Logo"
|
|
/>
|
|
</a>
|
|
</div>
|
|
<div id="header-links-div" class="header">
|
|
<div id="header-links" class="header">
|
|
<a id="header-link-home" class="header-link" href="/">Hyprland</a>
|
|
<a id="header-link-install" class="header-link" href="https://wiki.hyprland.org/Getting-Started/Installation/"
|
|
>Install</a
|
|
>
|
|
<a id="header-link-configure" class="header-link" href="https://github.com/hyprwm/hyprland"
|
|
>Github</a
|
|
>
|
|
</div>
|
|
</div>
|
|
<div id="links-out" class="header-out">
|
|
<div id="github" class="header-out">
|
|
<a
|
|
id="link-github"
|
|
href="https://github.com/hyprwm/hyprland"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>Github</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<div id="top" class="top">
|
|
<div id="text" class="top">
|
|
<h1 id="text-h1">Welcome to Hyprland!</h1>
|
|
<p class="text-para">
|
|
A dynamic tiling
|
|
<a
|
|
href="https://wayland.app/protocols/"
|
|
class="text-para-link"
|
|
id="link-1"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>Wayland</a
|
|
>
|
|
compositor based on
|
|
<a
|
|
href="https://way-cooler.org/book/wlroots_introduction.html"
|
|
class="text-para-link"
|
|
id="link-2"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>wlroots</a
|
|
>
|
|
that doesn't sacrifice on its looks.
|
|
</p>
|
|
<a href="https://wiki.hyprland.org/Getting-Started/Installation">
|
|
<button
|
|
id="install-link"
|
|
>
|
|
Install Hyprland
|
|
</button></a>
|
|
</div>
|
|
<div id="slide" class="top">
|
|
<div id="slide-content">
|
|
<!-- Slider main container -->
|
|
<div class="swiper">
|
|
<!-- Additional required wrapper -->
|
|
<div class="swiper-wrapper">
|
|
<!-- Slides -->
|
|
<div class="swiper-slide">
|
|
<img src="imgs/img1.png" id="slide-img" />
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="imgs/img2.png" id="slide-img" />
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="imgs/img3.png" id="slide-img" />
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="imgs/img4.png" id="slide-img" />
|
|
</div>
|
|
<div class="swiper-slide">
|
|
<img src="imgs/img5.png" id="slide-img" />
|
|
</div>
|
|
</div>
|
|
<!-- If we need pagination -->
|
|
<div class="swiper-pagination"></div>
|
|
|
|
<!-- If we need navigation buttons -->
|
|
<div class="swiper-button-prev"></div>
|
|
<div class="swiper-button-next"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <div id="animations">
|
|
<video src="videos/animation.mp4" autoplay="autoplay" loop="loop" controls=""></video> -->
|
|
<!-- </div> -->
|
|
</div>
|
|
<div id="features">
|
|
<h1 id="title-features">Features</h1>
|
|
<div id="animation">
|
|
<div id="animation-left">
|
|
<div id="animation-vid">
|
|
<video src="videos/animation.mp4" muted autoplay loop></video>
|
|
</div>
|
|
</div>
|
|
<div id="animation-right">
|
|
<h1 id="animation-h1">Smooth Animations</h1>
|
|
<p id="animation-p">
|
|
Hyprland offers super smooth and responsive animations, be it when
|
|
switching between windows or workspaces, resizing windows or
|
|
simply moving them around, plus you can easily customize it!
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div id="tiling">
|
|
<div id="tiling-left">
|
|
<h1 id="tiling-h1">Dynamic Tiling</h1>
|
|
<p id="tiling-p">
|
|
Tiling in Hyprland is "dynamic" meaning it handles the placement
|
|
of windows automatically acquiring the position of your cursor.
|
|
Hyprland also supports a variety of other layouts including
|
|
floating, pseudotiling and even fullscreen!
|
|
</p>
|
|
</div>
|
|
<div id="tiling-right">
|
|
<div id="tiling-vid">
|
|
<video src="videos/tiling.mp4" muted autoplay loop></video>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="configure">
|
|
<div id="configure-left">
|
|
<div id="configure-vid">
|
|
<video src="videos/configure.mp4" muted autoplay loop></video>
|
|
</div>
|
|
</div>
|
|
<div id="configure-right">
|
|
<h1 id="configure-h1">Easy Configuration</h1>
|
|
<p id="configure-p">
|
|
Editing the config file for Hyprland is as easy as editing a word
|
|
document, if you need any assist in configuring it, be sure to
|
|
check the
|
|
<a href="/configure" id="link-config">Configure Page</a> or feel
|
|
free to ask us
|
|
<a
|
|
id="link-config-discord"
|
|
href="https://discord.com/invite/hQ9XvMUjjr"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>@Discord</a
|
|
>.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div id="and-many-more" class="amm">
|
|
<h1 id="h1-amm" class="amm">And many more!</h1>
|
|
<div id="ul-amm-div" class="amm">
|
|
<ul id="ul-amm" class="amm">
|
|
<li id="li-amm" class="amm">Dual Kawase blur</li>
|
|
<li id="li-amm" class="amm">Pseudo Tiling</li>
|
|
<li id="li-amm" class="amm">Rounded corners</li>
|
|
<li id="li-amm" class="amm">Docks support</li>
|
|
<li id="li-amm" class="amm">
|
|
wlr_ext workspaces protocol support
|
|
</li>
|
|
</ul>
|
|
<ul id="ul-amm" class="amm">
|
|
<li id="li-amm" class="amm">
|
|
Custom bezier curve based animations
|
|
</li>
|
|
<li id="li-amm" class="amm">Drop shadows</li>
|
|
<li id="li-amm" class="amm">Fully dynamic workspaces</li>
|
|
<li id="li-amm" class="amm">Socket-based IPC</li>
|
|
<li id="li-amm" class="amm">Closely follows wlroots-git</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div id="quickinstall">
|
|
<h1>Quick Install (Arch Linux only)*</h1>
|
|
<div id="qi-content">
|
|
<p>
|
|
<span id="yay">yay </span><span id="syyu">-S </span
|
|
><span id="h-git">hyprland-git</span>
|
|
</p>
|
|
</div>
|
|
<p id="info-install">
|
|
*For a more detailed Installation process, please visit the
|
|
<a href="https://wiki.hyprland.org/Getting-Started/Installation" id="info-install-link">Install wiki page</a>.
|
|
</p>
|
|
<!--<div id="warning">
|
|
<img src="svg/warning.svg" alt="" />
|
|
<p>
|
|
Hyprland is still in its early development stages, although it is
|
|
pretty stable now, bugs <i>may</i> to be expected.
|
|
</p>
|
|
</div>-->
|
|
</div>
|
|
<hr />
|
|
<footer>
|
|
<div>
|
|
<p>© Hyprland Development 2022</p>
|
|
|
|
<div id="devs">
|
|
<p>
|
|
Developers -
|
|
<a
|
|
href="https://github.com/vaxry"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>Vaxry (Lead Developer)</a
|
|
><span>,</span>
|
|
<a
|
|
href="https://github.com/fufezan"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>Fufezan (Supporting Developer)</a
|
|
><span>,</span>
|
|
<a
|
|
href="https://github.com/ThatOneCalculator"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>ThatOneCalculator (Package Maintainer)</a
|
|
><span> and </span
|
|
><a
|
|
href="https://github.com/hyprwm/Hyprland/graphs/contributors"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>our fellow contributors</a
|
|
>.
|
|
</p>
|
|
</div>
|
|
<p class="p2">
|
|
Website created by -
|
|
<a
|
|
class="site"
|
|
href="https://github.com/System-x64"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>System-x64 (Dikshant Namdeo)</a
|
|
>.
|
|
</p>
|
|
<br />
|
|
<p class="p2" style="margin-bottom: 10px;">
|
|
Hyprland is licensed under the BSD 3-Clause "New" or "Revised"
|
|
License.
|
|
</p>
|
|
</div>
|
|
<div id="foot-icons">
|
|
<a
|
|
href="https://github.com/hyprwm/Hyprland"
|
|
target="_blank"
|
|
rel="noopener"
|
|
><img src="svg/github.svg" alt=""
|
|
/></a>
|
|
<a
|
|
href="https://discord.com/invite/hQ9XvMUjjr"
|
|
target="_blank"
|
|
rel="noopener"
|
|
><img src="svg/discord.svg" alt=""
|
|
/></a>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
|
|
<script src="js/swiper.js"></script>
|
|
</body>
|
|
</html>
|