forked from ScuffleCloud/scuffle
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Closes ScuffleCloud#35 fix: switch to scss feat: finish up layout chore: switch to mask + small other fixes Switched to mask as our task runner from Just. Mask seems to provide a much nicer cli than just and also is much easier to write than the just files, since its markdown. Ideally they should add support for submoudles and some things to help with code duplication. Like global variables, global scripts, cascading flags, catch all extra arguments, ect... However these are not big enough issues for us to not use it since just/make is very unmaintainable and very messy when we have a lot of tasks. I made an issue on their repo for the submodule idea. jacobdeichert/mask#96 Some small fixes: - .gitignores on mac - prettier not formatting all files feat: start landing page Closes ScuffleCloud#35 fix: switch to scss fix: remove unused file feat: fix magic text positioning chore: format fix: capitalization chore: add code coverage Add code coverage with Codecov. closes ScuffleCloud#50 feat: add blurred circles to background chore: format fix: remove unused <script> fix: text selection on top of blurred circles feat: added blurred-circle animation feat(api): initial api implementation + glibc Upon testing the API we noticed that when the app is compiled with musl the API would perform roughly 80% worse than the glibc counter part. We will have to do real benchmarks to see where this performance drop off is coming from and likely have to ticket it to the musl / rust / tokio devs. ci: add docker ci builds Adding docker builds to CI so that we can have regularly updated docker images pushed to GHCR. closes ScuffleCloud#46
- Loading branch information
1 parent
5ce8251
commit 75ce676
Showing
7 changed files
with
374 additions
and
18 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
<script> | ||
import "@fontsource/be-vietnam-pro"; | ||
import "@fontsource/comfortaa"; | ||
</script> | ||
|
||
<slot /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,12 +1,334 @@ | ||
<script lang="ts"> | ||
import init, { add } from "player"; | ||
import { onMount } from "svelte"; | ||
onMount(async () => { | ||
await init(); | ||
console.log(add(1, 2)); | ||
}); | ||
</script> | ||
|
||
<h1>Welcome to SvelteKit</h1> | ||
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p> | ||
<body> | ||
<div class="body container"> | ||
<div class="top-margin"> | ||
<div class="container header"> | ||
<span class="blurred-circle blue pos-1" /> | ||
<h1 class="wordmark">Scuffle.tv</h1> | ||
<p class="heading-description"> | ||
We’re building a streaming platform. | ||
<br /> | ||
A <span class="highlight">community driven streaming platform</span>, that is. | ||
</p> | ||
</div> | ||
<div class="section"> | ||
<span class="blurred-circle blue pos-2" /> | ||
<h2>For Fun™</h2> | ||
<p> | ||
Have you ever thought of making your own streaming platform? No? | ||
<br /> | ||
Well... We are making a streaming platform. An <span class="highlight">open-source</span> | ||
streaming platform. | ||
<br /> | ||
You can join us on our journey of world conquer... It will be fun... Probably. | ||
</p> | ||
</div> | ||
<div class="section center"> | ||
<h1>So... how do we conquer the world?</h1> | ||
<div class="bar-container"> | ||
<div class="rust-bar flex-text"> | ||
<p>90% Rust</p> | ||
<p class="magic-text">10% Magic</p> | ||
</div> | ||
<div class="magic-bar" /> | ||
</div> | ||
<p> | ||
With the power of <span class="highlight">Rust</span>.. and | ||
<span class="highlight">Magic</span>, of course. | ||
</p> | ||
</div> | ||
<div class="section"> | ||
<h2>Rust? Like the game?</h2> | ||
<p> | ||
No. Not the game, we’re talking ‘bout the programming language. | ||
<br /> | ||
If you’re a programmer you must have heard of it before. | ||
<br /> | ||
Fast and safe. That’s all you need to know about Rust. | ||
<br /> | ||
Did we mention it’s fast? <span class="blazing-fast-text">Blazingly Fast™.</span> | ||
</p> | ||
</div> | ||
<div class="section center"> | ||
<span class="blurred-circle brown pos-3" /> | ||
<h1>So... What makes it community driven?</h1> | ||
<p> | ||
Open source. Made by a community of people who actually care about their work. | ||
<br /> | ||
We plan on having everything be as transparent as possible. | ||
<br /> | ||
Transparent moderation, development. | ||
<br /> | ||
That’s what it’s all about. | ||
</p> | ||
</div> | ||
<div class="section center"> | ||
<h1>Aren’t streaming platforms super expensive?</h1> | ||
<p> | ||
Yes, they are... | ||
<br /> | ||
Our biggest goal and challenge is making everything cost effective and self sustainable. | ||
</p> | ||
</div> | ||
<div class="section"> | ||
<span class="blurred-circle blue pos-4" /> | ||
<span class="blurred-circle green pos-5" /> | ||
<h2>Alright, you convinced me. Where can I join in on the fun?</h2> | ||
<p>You can join our Discord, and check out the source code on GitHub.</p> | ||
</div> | ||
<div class="buttons-container center bottom"> | ||
<a href="https://github.com/scuffletv" target="_blank" rel="noopener noreferrer"> | ||
<button class="github-button">GitHub</button> | ||
</a> | ||
<a href="https://discord.gg/CVyX3WerGr" target="_blank" rel="noopener noreferrer"> | ||
<button class="discord-button">Discord</button> | ||
</a> | ||
</div> | ||
</div> | ||
</div> | ||
</body> | ||
|
||
<style lang="scss"> | ||
h1, | ||
h2, | ||
p { | ||
z-index: 1; | ||
} | ||
.body { | ||
max-width: 40rem; | ||
margin: 0 auto; | ||
} | ||
button { | ||
border: none; | ||
border-radius: 0.5rem; | ||
padding: 1rem 3rem; | ||
font-size: 1.2rem; | ||
font-weight: 600; | ||
cursor: pointer; | ||
transition: background 0.2s ease-in-out; | ||
} | ||
.discord-button { | ||
background: #5865f2; | ||
color: white; | ||
} | ||
.discord-button:hover { | ||
background: #7289da; | ||
} | ||
.github-button { | ||
background: #292929; | ||
color: white; | ||
} | ||
.github-button:hover { | ||
background: #3f3f3f; | ||
} | ||
.buttons-container { | ||
display: flex; | ||
flex-direction: row; | ||
justify-content: center; | ||
align-items: center; | ||
gap: 0.5rem; | ||
margin-top: 2rem; | ||
} | ||
.bottom { | ||
margin-bottom: 25rem; | ||
} | ||
.flex-text { | ||
display: flex; | ||
flex-direction: row; | ||
justify-content: space-between; | ||
align-items: flex-start; | ||
} | ||
.flex-text > p { | ||
color: black; | ||
} | ||
.bar-container { | ||
margin-top: 1rem; | ||
display: flex; | ||
flex-direction: row; | ||
justify-content: center; | ||
align-items: center; | ||
width: 70%; | ||
} | ||
.magic-text { | ||
// move it to the right | ||
transform: translateX(2rem); | ||
} | ||
.rust-bar { | ||
width: 90%; | ||
height: 3rem; | ||
background: #dea584; | ||
border-radius: 0.5rem 0 0 0.5rem; | ||
text-align: left; | ||
padding-left: 1rem; | ||
} | ||
.magic-bar { | ||
width: 10%; | ||
height: 3rem; | ||
background: linear-gradient(to bottom right, #6fcbff, #fff, #ff72f9); | ||
border-radius: 0 0.5rem 0.5rem 0; | ||
} | ||
.section { | ||
position: relative; | ||
margin-top: 7rem; | ||
display: flex; | ||
flex-direction: column; | ||
text-align: left; | ||
align-items: flex-start; | ||
justify-content: start; | ||
} | ||
.highlight { | ||
color: white; | ||
font-weight: bold; | ||
} | ||
h1, | ||
h2 { | ||
// get rid of the default margin | ||
margin: 0; | ||
} | ||
.header { | ||
position: relative; | ||
} | ||
.heading-description { | ||
text-align: center; | ||
margin-top: -0.1rem; | ||
} | ||
p { | ||
color: rgb(163, 163, 163); | ||
font-weight: 100; | ||
} | ||
.blazing-fast-text { | ||
font-weight: 800; | ||
color: #ffe145; | ||
background: linear-gradient(#ffe145, #ff0000); | ||
background-clip: text; | ||
-webkit-linear-gradient: (#ffe145, #ff0000); | ||
-webkit-background-clip: text; | ||
-webkit-text-fill-color: transparent; | ||
} | ||
.wordmark { | ||
font-family: "Comfortaa", sans-serif; | ||
font-weight: 700; | ||
font-size: 5rem; | ||
color: #ff7357; | ||
background: linear-gradient(#ff7357, #ff4c6d); | ||
background-clip: text; | ||
-webkit-linear-gradient: (#ff7357, #ff4c6d); | ||
-webkit-background-clip: text; | ||
-webkit-text-fill-color: transparent; | ||
} | ||
.blurred-circle { | ||
position: absolute; | ||
width: 30rem; | ||
height: 30rem; | ||
overflow: hidden; | ||
animation: scale-up-center 7s cubic-bezier(0.39, 0.575, 0.565, 1) infinite both; | ||
@keyframes scale-up-center { | ||
0% { | ||
transform: scale(1); | ||
} | ||
33% { | ||
transform: scale(1.1); | ||
} | ||
66% { | ||
transform: scale(0.9); | ||
} | ||
100% { | ||
transform: scale(1); | ||
} | ||
} | ||
/**.fade-delay-2000 { | ||
animation-delay: 2s; | ||
} | ||
.fade-delay-4000 { | ||
animation-delay: 4s; | ||
}*/ | ||
&.blue { | ||
background: radial-gradient( | ||
50% 50% at 50% 50%, | ||
rgba(47, 130, 255, 0.3) 0%, | ||
rgba(0, 0, 0, 0) 100% | ||
); | ||
} | ||
&.brown { | ||
background: radial-gradient( | ||
50% 50% at 50% 50%, | ||
rgba(255, 180, 136, 0.259) 0%, | ||
rgba(0, 0, 0, 0) 100% | ||
); | ||
} | ||
&.green { | ||
background: radial-gradient( | ||
50% 50% at 50% 50%, | ||
rgba(136, 255, 234, 0.35) 0%, | ||
rgba(0, 0, 0, 0) 100% | ||
); | ||
} | ||
&.pos-1 { | ||
top: -18rem; | ||
left: 35rem; | ||
} | ||
&.pos-2 { | ||
top: -10rem; | ||
left: -10rem; | ||
} | ||
&.pos-3 { | ||
top: -15rem; | ||
left: 25rem; | ||
} | ||
&.pos-4 { | ||
top: 2rem; | ||
left: -20rem; | ||
} | ||
&.pos-5 { | ||
top: 5rem; | ||
left: 35rem; | ||
} | ||
} | ||
body { | ||
margin: 0; | ||
overflow-x: hidden; | ||
height: 100%; | ||
// background-image: linear-gradient(to bottom ,#0F1314, #0F1314); | ||
// background-repeat: no-repeat; | ||
// background-size: cover; | ||
// background-position: center; | ||
background-color: #0f1314; | ||
color: white; | ||
font-family: "Be Vietnam Pro", sans-serif; | ||
} | ||
.container { | ||
display: flex; | ||
flex-direction: column; | ||
align-items: center; | ||
justify-content: center; | ||
} | ||
.top-margin { | ||
margin-top: 10rem; | ||
} | ||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.