Kaynağa Gözat

Redesign website

master
Fen Dweller 5 yıl önce
ebeveyn
işleme
783dff024f
7 değiştirilmiş dosya ile 166 ekleme ve 26 silme
  1. BIN
      static/images/feast-logo.png
  2. BIN
      static/images/gorge-logo.png
  3. BIN
      static/images/satiate-logo.png
  4. BIN
      static/images/stroll-logo.png
  5. +94
    -0
      static/sexy.css
  6. +36
    -13
      templates/index.html
  7. +36
    -13
      templates/nightly.html

BIN
static/images/feast-logo.png Dosyayı Görüntüle

Önce Sonra
Genişlik: 834  |  Yükseklik: 834  |  Boyut: 15 KiB

BIN
static/images/gorge-logo.png Dosyayı Görüntüle

Önce Sonra
Genişlik: 834  |  Yükseklik: 834  |  Boyut: 18 KiB

BIN
static/images/satiate-logo.png Dosyayı Görüntüle

Önce Sonra
Genişlik: 834  |  Yükseklik: 834  |  Boyut: 18 KiB

BIN
static/images/stroll-logo.png Dosyayı Görüntüle

Önce Sonra
Genişlik: 834  |  Yükseklik: 834  |  Boyut: 21 KiB

+ 94
- 0
static/sexy.css Dosyayı Görüntüle

@@ -123,3 +123,97 @@ a:hover {
font-size: 10vw;
}
}

.flex-container {
display: flex;
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
}

.game-button {
user-select: none;
position: relative;
width: 40vh;
}

.game-logo {
width: 40vh;
opacity: 0.5;
}

.game-button:hover > .game-logo {
opacity: 1;
}

.game-title {
position: absolute;
color: rgb(183, 16, 206);
font-size: 10vh;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 1;
transition: 0.2s;
}

.game-button:hover > .game-title {
font-size: 12vh;
}

.game-description {
display: none;
position: fixed;
left: 50%;
top: 80%;
transform: translate(-50%, 0);
}

.game-button:hover > .game-description {
display: inline;
}

.title {
font-size: 100px;
color: rgb(183, 16, 206);
position: fixed;
left: 50%;
top: 10%;
transform: translate(-50%, 0);
}

.switcher {
text-align: center;
background-color: pink;
min-width: 300px;
min-height: 100px;
position: fixed;
right: -100px;
top: 0px;
transform: rotate(45deg);
}

.switcher-text {
position: relative;
color: black;
font-size: 24px;
top: 25px;
}

.discord {
text-align: center;
background-color: pink;
min-width: 300px;
min-height: 100px;
position: fixed;
left: -100px;
top: 0px;
transform: rotate(-45deg);
}

.discord-text {
position: relative;
color: black;
font-size: 24px;
top: 40px;
}

+ 36
- 13
templates/index.html Dosyayı Görüntüle

@@ -5,19 +5,42 @@
<link rel="stylesheet" type="text/css" href="sexy.css">
</head>
<body>
<div class="box">
<h1 class="heading">Fen's Games</h1>
<div class="body"><a href="https://discord.gg/vqcKVV6">Join the Discord server!</a></div>
<div class="body"><a href="/nightly">View unstable nightly builds</a></div>
<br>
<a class="game" href="https://stroll.crux.sexy">Stroll</a>
<br>
<a class="game" href="https://feast.crux.sexy">Feast</a>
<br>
<a class="game" href="https://gorge.crux.sexy">Gorge</a>
<br>
<a class="game" href="https://satiate.crux.sexy">Satiate</a>
<div class="title">
fen's games
</div>
<div class="flex-container">
<a href="https://stroll.crux.sexy" class="game-button">
<div class="game-title">stroll</div>
<div class="game-description">A macro/vore procedural game</div>
<img class="game-logo" src="/images/stroll-logo.png">
</a>
<a href="https://feast.crux.sexy" class="game-button">
<div class="game-title">feast</div>
<div class="game-description">A vore-focused RPG</div>
<img class="game-logo" src="/images/feast-logo.png">
</a>
<a href="https://gorge.crux.sexy" class="game-button">
<div class="game-title">gorge</div>
<div class="game-description">An idle/clicker vore game</div>
<img class="game-logo" src="/images/gorge-logo.png">
</a>
<a href="https://satiate.crux.sexy" class="game-button">
<div class="game-title">satiate</div>
<div class="game-description">A text adventure engine with an emphasis on sound</div>
<img class="game-logo" src="/images/satiate-logo.png">
</a>
</div>
<a class="switcher" href="/nightly">
<div class="switcher-text">
nightly
<br>
builds
</div>
</a>
<a class="discord" href="https://discord.gg/vqcKVV6">
<div class="discord-text">
Discord
</div>
</a>
</body>
</html>

+ 36
- 13
templates/nightly.html Dosyayı Görüntüle

@@ -5,19 +5,42 @@
<link rel="stylesheet" type="text/css" href="sexy.css">
</head>
<body class="nightly">
<div class="box">
<h1 class="heading">Fen's Games</h1>
<div class="body"><a href="https://discord.gg/vqcKVV6">Join the Discord server!</a></div>
<div class="body"><a href="/">View stable releases</a></div>
<br>
<a class="game" href="https://stroll.crux.sexy">Stroll</a>
<br>
<a class="game" href="https://feast.crux.sexy">Feast</a>
<br>
<a class="game" href="https://gorge.crux.sexy">Gorge</a>
<br>
<a class="game" href="https://satiate.crux.sexy">Satiate</a>
<div class="title">
fen's games
</div>
<div class="flex-container">
<a href="https://stroll.crux.sexy/nightly" class="game-button">
<div class="game-title">stroll</div>
<div class="game-description">A macro/vore procedural game</div>
<img class="game-logo" src="/images/stroll-logo.png">
</a>
<a href="https://feast.crux.sexy/nightly" class="game-button">
<div class="game-title">feast</div>
<div class="game-description">A vore-focused RPG</div>
<img class="game-logo" src="/images/feast-logo.png">
</a>
<a href="https://gorge.crux.sexy/nightly" class="game-button">
<div class="game-title">gorge</div>
<div class="game-description">An idle/clicker vore game</div>
<img class="game-logo" src="/images/gorge-logo.png">
</a>
<a href="https://satiate.crux.sexy/nightly" class="game-button">
<div class="game-title">satiate</div>
<div class="game-description">A text adventure engine with an emphasis on sound</div>
<img class="game-logo" src="/images/satiate-logo.png">
</a>
</div>
<a class="switcher" href="/">
<div class="switcher-text">
stable
<br>
builds
</div>
</a>
<a class="discord" href="https://discord.gg/vqcKVV6">
<div class="discord-text">
Discord
</div>
</a>
</body>
</html>

Yükleniyor…
İptal
Kaydet