forked from ProjectSegfault/website
Merge branch 'projectsegfault-left' of https://github.com/ProjectSegfault/website into projectsegfault-left
This commit is contained in:
commit
05320931ac
@ -26,6 +26,7 @@
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"@modular-css/svelte": "^28.1.0",
|
||||
"@sveltejs/adapter-static": "next"
|
||||
}
|
||||
}
|
||||
|
1
src/app.d.ts
vendored
1
src/app.d.ts
vendored
@ -1,3 +1,4 @@
|
||||
/* eslint-disable */
|
||||
/// <reference types="@sveltejs/kit" />
|
||||
|
||||
// See https://kit.svelte.dev/docs/typescript
|
||||
|
263
src/assets/animation.css
Normal file
263
src/assets/animation.css
Normal file
@ -0,0 +1,263 @@
|
||||
/* ----------------------------------------------
|
||||
* Generated by Animista on 2022-4-22 18:29:34
|
||||
* Licensed under FreeBSD License.
|
||||
* See http://animista.net/license for more info.
|
||||
* w: http://animista.net, t: @cssanimista
|
||||
* ---------------------------------------------- */
|
||||
|
||||
/**
|
||||
* ----------------------------------------
|
||||
* animation text-flicker-in-glow
|
||||
* ----------------------------------------
|
||||
*/
|
||||
@-webkit-keyframes text-flicker-in-glow {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
10% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
10.1% {
|
||||
opacity: 1;
|
||||
text-shadow: none;
|
||||
}
|
||||
10.2% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
20% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
20.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
20.6% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
30% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
30.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
30.5% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
30.6% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
45% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
45.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
55% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
55.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
57% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
57.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
60.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
65% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
65.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
75% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
75.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
77% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
77.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
85% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
85.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
86% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
86.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
@keyframes text-flicker-in-glow {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
10% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
10.1% {
|
||||
opacity: 1;
|
||||
text-shadow: none;
|
||||
}
|
||||
10.2% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
20% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
20.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
20.6% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
30% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
30.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
30.5% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
30.6% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
45% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
45.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
50% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
55% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.45), 0 0 60px rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
55.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
57% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
57.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
60% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35);
|
||||
}
|
||||
60.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
65% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
65.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
75% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.35), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
75.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
77% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
77.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
85% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.55), 0 0 60px rgba(255, 255, 255, 0.4), 0 0 110px rgba(255, 255, 255, 0.2), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
85.1% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
86% {
|
||||
opacity: 0;
|
||||
text-shadow: none;
|
||||
}
|
||||
86.1% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
text-shadow: 0 0 30px rgba(255, 255, 255, 0.6), 0 0 60px rgba(255, 255, 255, 0.45), 0 0 110px rgba(255, 255, 255, 0.25), 0 0 100px rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
@ -51,10 +51,14 @@ a.visited {
|
||||
.button:hover {
|
||||
background-color: #00d4aa;
|
||||
color: black;
|
||||
border-radius: 12px;
|
||||
transform: translateY(-0.25em);
|
||||
box-shadow: 0 0.5em 0.5em -0.4em #00755e;
|
||||
}
|
||||
.button:active {
|
||||
transform: translateY(0.10em);
|
||||
background-color: #4beacb;
|
||||
box-shadow: 0 0.5em 0.5em -0.4em #00c7a1;
|
||||
}
|
||||
|
||||
.ResponsiveImage {
|
||||
|
@ -1,11 +1,11 @@
|
||||
<script lang="ts">
|
||||
import css from "../assets/animation.css";
|
||||
import ProjectSegfaultLogo from "../assets/images/projectsegfault1.png";
|
||||
</script>
|
||||
<header>
|
||||
<img src={ProjectSegfaultLogo} id="ProjectSegfaultLogoHeader" alt="Why is this not loading? Anyway, project segfault's logo." />
|
||||
<a href="/" style="color: #ce1717">Project</a> <a href="/" style="color: #00d4aa">Segfault</a>
|
||||
|
||||
<section class="center">
|
||||
<img src={ProjectSegfaultLogo} id="ProjectSegfaultLogoHeader" alt="project segfault's logo." />
|
||||
<a href="/" class="text-flicker-in-glow" style="color: #ce1717">Project <span style="color: #00d4aa">Segfault</span></a>
|
||||
<div class="center">
|
||||
<a href="/instances" class="button">Instances</a>
|
||||
|
||||
<a href="/gameservers" class="button">Games</a>
|
||||
@ -15,8 +15,7 @@
|
||||
<a href="/minecraft" class="button">Minecraft</a>
|
||||
|
||||
<a href="/contact" class="button">Contact</a>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<style>
|
||||
@ -35,6 +34,15 @@
|
||||
}
|
||||
.center {
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
.text-flicker-in-glow {
|
||||
opacity:1;
|
||||
-webkit-animation: text-flicker-in-glow 900ms both;
|
||||
animation: text-flicker-in-glow 900ms both;
|
||||
}
|
||||
@media screen and (prefers-reduced-motion: reduce) {
|
||||
.text-flicker-in-glow {
|
||||
opacity:1;
|
||||
}
|
||||
}
|
||||
</style>
|
@ -12,9 +12,9 @@ title: Our Gameservers
|
||||
<div class="card">
|
||||
<div id="gmod">
|
||||
<h3 class="gameserversCardTitle"> Garry's Mod </h3>
|
||||
<a href="https://gmod.mutahar.rocks">Garry's Mod has it's own website. Check it out here!</a>
|
||||
<a href="https://gmod.projectsegfau.lt">Garry's Mod has it's own website. Check it out here!</a>
|
||||
<br>
|
||||
<a href="steam://connect/gmodsrv.mutahar.rocks">Connect to the server using this link</a>
|
||||
<a href="steam://connect/gmodsrv.projectsegfau.lt">Connect to the server using this link</a>
|
||||
<br>
|
||||
<a href="https://www.gametracker.com/server_info/176.174.120.242:27015/" target="_blank">GameTracker Link</a>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user