165 lines
4.5 KiB
Plaintext
165 lines
4.5 KiB
Plaintext
<div class="top" id="top">
|
|
<div class="text">
|
|
<h2 id="welcome">Welcome to Hyprland!</h2>
|
|
<p>
|
|
A dynamic tiling
|
|
<a
|
|
href="https://wayland.freedesktop.org/"
|
|
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
|
|
id="install-hypr"
|
|
href="https://wiki.hyprland.org/Getting-Started/Installation/"
|
|
>
|
|
<div>
|
|
<p>Install Hyprland</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div id="slide" class="top">
|
|
<div id="slide-content">
|
|
<div class="swiper">
|
|
<div class="swiper-wrapper">
|
|
<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 class="swiper-slide">
|
|
<img src="/imgs/img6.png" id="slide-img" />
|
|
</div>
|
|
</div>
|
|
|
|
<div class="swiper-pagination" style="color: #cfe8f6"></div>
|
|
|
|
<div class="swiper-button-prev" style="color: #cfe8f6"></div>
|
|
<div class="swiper-button-next" style="color: #cfe8f6"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="features">
|
|
<h1 id="features-text">Features</h1>
|
|
<div class="animation">
|
|
<div id="ani-vid">
|
|
<video
|
|
class="animatedVideo"
|
|
src="/videos/windows.mp4"
|
|
autoplay
|
|
muted
|
|
loop
|
|
></video>
|
|
</div>
|
|
<div id="ani-text">
|
|
<h1 style="padding-bottom: 15px">
|
|
Smooth<br />
|
|
Animations
|
|
</h1>
|
|
<p>
|
|
Hyprland offers smooth and responsive animations, be it when
|
|
switching between windows, changing a workspace or opening an app
|
|
launcher, on top of being highly customizable!
|
|
</p>
|
|
<a href="https://wiki.hyprland.org/Configuring/Animations/">
|
|
<div>MORE ABOUT ANIMATIONS</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="tiling" id="tiling">
|
|
<div id="til-text">
|
|
<h1 style="padding-bottom: 15px">
|
|
Dynamic<br />
|
|
Tiling
|
|
</h1>
|
|
<p>
|
|
Tiling in Hyprland is dynamic, meaning it handles the placement of
|
|
windows automatically based on multiple factors. Hyprland supports a
|
|
variety of layouts, each with their own options to fine-tune them to
|
|
your likings.
|
|
</p>
|
|
<a href="https://wiki.hyprland.org/Configuring/Dwindle-Layout/">
|
|
<div>MORE ABOUT TILING</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div id="til-vid">
|
|
<video
|
|
class="animatedVideo"
|
|
src="/videos/tiling.mp4"
|
|
autoplay
|
|
muted
|
|
loop
|
|
></video>
|
|
</div>
|
|
</div>
|
|
<div class="configure">
|
|
<div id="con-vid">
|
|
<video
|
|
class="animatedVideo"
|
|
src="/videos/configure.mp4"
|
|
autoplay
|
|
muted
|
|
loop
|
|
></video>
|
|
</div>
|
|
<div id="con-text">
|
|
<h1 style="padding-bottom: 15px">
|
|
Easy<br />
|
|
Configuration
|
|
</h1>
|
|
<p>
|
|
Editing the config file for Hyprland is as easy as editing a text
|
|
document. Be sure to check the
|
|
<a href="https://wiki.hyprland.org/" id="link-config">Wiki Page</a>
|
|
for information about the config options, features and syntax. If
|
|
you still feel lost, hit us up
|
|
<a
|
|
id="link-config-discord"
|
|
href="https://discord.com/invite/hQ9XvMUjjr"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>@Discord</a
|
|
>.
|
|
</p>
|
|
<a
|
|
id="feat-text"
|
|
href="https://wiki.hyprland.org/Configuring/Configuring-Hyprland/"
|
|
>
|
|
<div>GET STARTED</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
|
|
<%- include("./components/swiperjs") %>
|
|
|
|
<script defer src="/js/smooth-view.js"></script>
|
|
<script defer src="/js/github-logo.js"></script>
|
|
<script defer src="/js/play-vid-on-focus.js"></script> |