new file: moderation/report/peertube/index.html

new file:   moderation/report/substyle.css
main
anthony 3 weeks ago
parent 7f312488cf
commit 64bb241ce3

@ -1,27 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<a rel="me" href="https://mastodon.cif.su/@anthony">Mastodon</a>
<link rel="stylesheet" href="./style.css">
<script src="./script.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Communist Internet Federation</title>
</head>
<body>
<!--Welcome Page Sector-->
<div class="page" id="page1">
<h1 class="slidefadein title">[ CiF ].su</h1>
<h2 class="slidefadein">Let's change the World for the Better. Together. Bit for <span class="glitch">Bit</span>.</h2>
<h1 class="slidefadein title"><span class="no-break">[ CiF ].su</span></h1>
<h2 class="slidefadein"><span class="no-break">Let's change the World.</span> <span class="no-break">For the Better.</span> <span class="no-break">Together.</span> <span class="no-break">Bit for <span class="glitch">Bit</span>.</span></h2>
<div class="background-arms">
<div class="sunken-arms">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 594.962">
<g transform="matrix(3.1679 0 0 3.1679 -.95 -.947)">
<!-- Main filled parts -->
<!-- Hammer -->
<path class="filled" d="M84 49h22v112H84z"/>
<path class="filled" d="M64 54h52l16 21v7H64z"/>
<!-- Left awns (stroke only) -->
<!-- Right grain -->
<path class="stroked" d="M370 495c-15-28-41-45-72-48M367 498c-14-28-41-45-71-47M365 501c-14-26-36-43-70-46M362 504c-12-24-35-43-68-45M357 502c-15-24-35-37-62-39M354 505c-12-21-30-35-58-38M350 506c-11-19-28-32-53-35" transform="translate(-194 -446)"/>
<!-- Left filled parts -->
<path class="filled" d="M262 629h13c37-8 64-23 79-45s17-50 4-81 0-1 1-1h1c14 32 11 60-4 83s-43 40-80 48c-8 2-14-4-14-4z" transform="translate(-194 -446)"/>
<path class="filled" d="M370 495c7 31-21 18 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M346 503c31 5 9 27 0 0z" transform="translate(-194 -446)"/>
@ -35,11 +34,8 @@
<path class="filled" d="M337 583c-24 28 8 32 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M343 618c-37-15-29 18 0 0z" transform="translate(-194 -446)"/>
<path class="filled" d="M323 594c-28 23 4 35 0 0zM353 491c-3 29 25 15 0 0zM346 569c-9 15-4 24 0 23s7 1 0-23z" transform="translate(-194 -446)"/>
<!-- Right awns (stroke only, mirrored) -->
<!-- Left grain -->
<path class="stroked" d="M370 495c-15-28-41-45-72-48M367 498c-14-28-41-45-71-47M365 501c-14-26-36-43-70-46M362 504c-12-24-35-43-68-45M357 502c-15-24-35-37-62-39M354 505c-12-21-30-35-58-38M350 506c-11-19-28-32-53-35" transform="translate(384 -446) scale(-1,1)"/>
<!-- Right filled parts (mirrored) -->
<path class="filled" d="M262 629h13c37-8 64-23 79-45s17-50 4-81 0-1 1-1h1c14 32 11 60-4 83s-43 40-80 48c-8 2-14-4-14-4z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M370 495c7 31-21 18 0 0z" transform="translate(384 -446) scale(-1,1)"/>
<path class="filled" d="M346 503c31 5 9 27 0 0z" transform="translate(384 -446) scale(-1,1)"/>
@ -58,6 +54,8 @@
</div>
</div>
</div>
<!--Info Sector-->
<div class="page" id="page2">
<div class="card neomorphic about">
<h1>Oh Fuck...</h1>
@ -79,19 +77,17 @@
</div>
<!--Project Intorductions-->
<div class="card neomorphic projects">
<h1>Our Projects </h1>
<ul>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/CiF-Lemmy.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://lemmy.cif.su">Lemmy</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/CiF-Peertube.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://peertube.cif.su">Peertube</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/CiF-Mastodon.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://mastodon.cif.su">Mastodon</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><h2><a href="https://code.cif.su">Git</a></h2></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Lemmy/CiF-Lemmy.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://lemmy.cif.su">Lemmy</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Peertube/CiF-Peertube.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://peertube.cif.su">Peertube</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Mastodon/CiF-Mastodon.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://mastodon.cif.su">Mastodon</a></h2><p>A Forum based Social-Media Platform Similar to Reddit and 4Chan. Fully Compatible with the Fediverse. A good place for Discussion and Advice</p></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Git/CiF-Git.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://code.cif.su">Git</a></h2><p>Our Free to Use Code Reposetory, where we upload all of our finished & work-in-progress projects. Also Free for you, to use as your own git Reposetory.</p></div></li>
</ul>
</div>
</div>
<script src="./script.js"></script>
</body>
</html>

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="/moderation/report/style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> [ CiF ] Moderation Report</title>
</head>
<h1></h1>
<h1 class="slidefadein title"><span class="no-break">[ CiF ].su</span></h1>
<h2 class="slidefadein"><span class="no-break"> Moderation Report</span></h2>
<div class="card neomorphic projects">
<h2>Choose a Service to Continue:</h2>
<ul class="card-list">
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Lemmy/CiF-Lemmy.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://lemmy.cif.su">Lemmy</a></h2></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Peertube/CiF-Peertube.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://peertube.cif.su">Peertube</a></h2></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Mastodon/CiF-Mastodon.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://mastodon.cif.su">Mastodon</a></h2></div></li>
<li class="cards1 neomorphic-i project"><img src="https://code.cif.su/CiF/Branding/raw/branch/main/Logos/Git/CiF-Git.svg" class="cards2 neomorphic2"/><div class="info"><h2><a href="https://code.cif.su">Git</a></h2></div></li>
</ul>
</div>

@ -0,0 +1,160 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="/moderation/report/substyle.css">
<meta name="viewport" content="width=device-width initial-scale=1.0">
<title> [ CiF ] Moderation Report</title>
</head>
<h1></h1>
<h1 class="slidefadein title"><span class="no-break">[ CiF ] Peertube</span></h1>
<h2 class="slidefadein"><span class="no-break"> Moderation Report</span></h2>
<div class="card neomorphic projects">
<h2 class="table-titel">The Following Videos has been Blocked</h2>
<ul class="card-list">
<table>
<tr>
<th>Title</th>
<th>Thumbnail</th>
<th>Created by</th>
<th>Reason</th>
<th>Created on</th>
<th>Acknowledged by Creator</th>
</tr>
<tr>
<td> Weak Hero S02E03 Hindi dub</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/8bb82f80-ef0d-4b49-b22b-b0bcf0fb958e.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/somiya/">Somiya</a></td>
<td>Blatant Copyright Violation</td>
<td>5/28/2025 02:47:06</td>
<td>Pending</td>
</tr>
<tr>
<td> Weak Hero S02E02 Hindi dub</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/b451350c-228e-4b53-9f1a-90fc059897ba.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/somiya/">Somiya</a></td>
<td>Blatant Copyright Violation</td>
<td>5/28/2025 01:41:12</td>
<td>Pending</td>
</tr>
<tr>
<td> Weak Hero S02E01 Hindi dub</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/683b7359-2bfd-4934-8c90-d951e62f3758.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/somiya/">Somiya</a></td>
<td>Blatant Copyright Violation</td>
<td>5/28/2025 01:41:03</td>
<td>Pending</td>
</tr>
<tr>
<td>Part 2 ATID-511hd-1748270874802 </td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/0839bb7e-3a0d-4c88-8949-1d617ee4b172.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/26/2025 05:30:27</td>
<td>Yes</td>
</tr>
<tr>
<td> Part 1 ATd-174826475Atid 551 7402</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/137d5812-be4f-4e05-bd59-34048fd6255e.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/26/2025 04:20:16</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 2 Stereo-1748244837584</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/b950a1f3-487a-488f-879b-0ebe9c8acd07.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/26/2025 11:48:46</td>
<td>Yes</td>
</tr>
<tr>
<td>[Dark TV 2]EBOD 405 </td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/337c4b50-c977-41be-b159-f9e174870196.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/25/2025 12:15:47</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 2 PRED-526-1747918687906 </td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/e2c29ec2-1f5a-4703-89a5-fa3770919bc4.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/22/2025 04:18:37</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 1 PRED-526-1747918412357</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/3c457fe5-17af-4b5c-88eb-9b8eab9c429a.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/22/2025 02:58:05</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 1 Stereo-1747903779323</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/ee012952-0028-49c5-8e5a-50f55425c5bc.jpg" referrerpolicy="no-referrer"</td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/22/2025 09:43:13</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 2 Pet Girl Secret-1747818288367</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/0d7421aa-96d9-427c-b77a-0f9b4afdd94d.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/21/2025 12:55:04</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 1 Pet Girl Secret-1747818274723</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/aba6351e-7514-40b5-ada3-29d7b5014940.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/21/2025 11:57:11</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 2 xrULy.caa</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/2d32286b-929a-448f-916a-5031be66ca05.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/20/2025 06:13:48</td>
<td>Yes</td>
</tr>
<tr>
<td>Part 1 hhULy.caa</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/3036eb96-03c3-48cf-b7a3-ce781f118ba4.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/20/2025 05:58:53</td>
<td>Yes</td>
</tr>
<tr class="last-row">
<td>Silip.Sa.Apoy.2-1747633861082</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/72a148b7-4665-42cd-8d4c-43f9680a78a7.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/oomigamiga/">Oomigamiga</a></td>
<td>Blatant Copyright Violation</td>
<td>5/19/2025 07:24:39</td>
<td>Yes</td>
</tr>
<!-- Placeholder -->
<!--
<tr>
<td>Title</td>
<td><img src="https://peertube.cif.su/lazy-static/thumbnails/Video-ID.jpg" referrerpolicy="no-referrer"></td>
<td><a href="https://peertube.cif.su/a/Channel-Name/">Channel-Name</a></td>
<td>Reason</td>
<td>DD/MM/YYYY HH:MM:SS</td>
<td>Yes/Pending/No</td>
</tr>
-->
</table>
</ul>
</div>

@ -0,0 +1,280 @@
@font-face {
font-family: "Futura";
src: url("./../FuturaLT-Heavy.ttf") format("truetype");
}
/*Basic Site CSS*/
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
padding-top: 5%;
display: grid;
place-items: center;
scroll-behavior: smooth;
text-align: center;
position: absolute;
margin-top: 10px;
font-family: "Futura";
width: 100%; /* Full width */
padding-bottom: 5%;
}
h2 {
font-size: 25pt;
z-index: 1
}
.card-list {
display: flex;
flex-wrap: wrap;
gap: 20px;
padding: 0;
list-style-type: none;
}
.card-list li {
min-width: 200px;
}
/* Optional: Responsive adjustments */
@media (max-width: 800px) {
.card-list {
flex-direction: column;
}
}
ul {
list-style-type: none;
}
li {
padding: 10pt;
}
img {
width: 160px;
border-radius: 0 100px 100px 0;
padding: 5px;
}
.info {
display: flex;
flex-direction: column;
}
.slidefadein {
opacity: 0;
transform: translateY(100px);
animation: slideAndFade 0.5s ease-in-out forwards;
}
@keyframes slideAndFade {
to {
opacity: 1;
transform: translateY(0);
}
}
.title{
font-size: 120px;
z-index: 1;
}
.card {
width: 800pt;
height: auto;
border-radius: 20px;
display: flex;
align-items: center;
flex-direction: column;
margin-top: 30pt;
}
.cards1 {
width: 180pt;
height: auto;
border-radius: 40pt;
display: flex;
align-items: center;
flex-direction: column; /* Changed from column to row */
margin-top: 30pt;
gap: 20px; /* Adds some space between image and text */
}
.cards2 {
width: 150pt;
height: auto;
border-radius: 30pt;
display: flex;
align-items: center;
flex-direction: column;
}
.project h1 {
font-size: 50pt;
margin-top: 5pt;
}
.project a:link {
text-decoration: none;
}
.project a:visited {
text-decoration: none;
}
.project a:hover {
text-decoration: none;
}
.project a:active {
text-decoration: none;
}
.project p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.no-break {
white-space: nowrap;
}
/*Light Color Themes*/
@media (prefers-color-scheme: light) {
:root{
background-color: #fff3f9;
}
.title{
color: #ff5a99;
}
.neomorphic{
background: #ffa7c7;
box-shadow: -5px -5px 20px rgb(254,254,255, 0.69),
2px 2px 20px rgb(255,90,153)
}
.neomorphic-i{
background: #ffa7c7;
box-shadow: -3px -3px 15px rgba(254, 254, 255, 0.69) inset,
1px 1px 15px rgb(255,90,153) inset
}
.neomorphic2{
background: #ffa7c7;
transition: all 0.1s ease-in-out;
transform: scale(1);
cursor: pointer;
box-shadow: -5px -5px 20px rgba(254,254,255,0.5),
2px 2px 20px rgb(255,90,153)
}
.neomorphic2:hover{
background: #ffa7c7;
transform: scale(0.98);
box-shadow: -5px -5px 20px rgba(254, 254, 255, 0),
2px 2px 20px rgba(255, 90, 153, 0)
}
.neomorphic2:active{
background: #ffa7c7;
transform: scale(0.96);
box-shadow: -3px -3px 15px rgba(254, 254, 255, 0.69) inset,
1px 1px 15px rgb(255,90,153) inset
}
.cards2 h2 {
color: #060606;
}
.project {
color: #55052c;
}
.project h1 {
color: #060606;
}
.project a:link {
color: #060606;
}
.project a:visited {
color: #060606;
}
.project a:hover {
color: #060606;
}
.project a:active {
color: #060606;
}
.principals {
color: #55052c;
}
}
/*Dark Color Themes*/
@media (prefers-color-scheme: dark) {
:root{
background-color: #060606;
}
.title{
color: #00d791;
}
.neomorphic{
background: #55052c;
box-shadow: -5px -5px 20px rgba(1, 1, 0, 0.69),
2px 2px 20px rgba(0, 215, 143, 0.425)
}
.neomorphic-i{
background: #55052c;
box-shadow: -3px -3px 15px rgba(1, 1, 0, 0.69) inset,
1px 1px 15px rgb(0, 0, 0) inset
}
.neomorphic2{
background: #55052c;
box-shadow: -5px -5px 20px rgba(1, 1, 0, 0.5),
2px 2px 20px rgba(0, 215, 143, 0.534)
}
.cards2 h2 {
color: #fff3f9;
}
.project {
color: #ffa7c7;
}
.project h1 {
color: #fff3f9;
}
.project a:link {
color: #fff3f9;
}
.project a:visited {
color: #fff3f9;
}
.project a:hover {
color: #fff3f9;
}
.project a:active {
color: #fff3f9;
}
}

@ -0,0 +1,256 @@
@font-face {
font-family: "Futura";
src: url("./../../FuturaLT-Heavy.ttf") format("truetype");
}
/*Basic Site CSS*/
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
padding-top: 5%;
display: grid;
place-items: center;
scroll-behavior: smooth;
text-align: center;
position: absolute;
margin-top: 10px;
width: 100%; /* Full width */
padding-bottom: 5%;
}
h2 {
font-size: 25pt;
z-index: 1
}
.card-list {
display: flex;
flex-wrap: wrap;
gap: 20px;
padding: 0;
list-style-type: none;
}
.card-list li {
min-width: 200px;
}
.title{
font-size: 120px;
z-index: 1;
font-family: "Futura";
}
.card {
width: 800pt;
height: auto;
border-radius: 20px;
display: flex;
align-items: center;
flex-direction: column;
margin-top: 30pt;
}
.cards1 {
width: 180pt;
height: auto;
border-radius: 40pt;
display: flex;
align-items: center;
flex-direction: column; /* Changed from column to row */
margin-top: 30pt;
gap: 20px; /* Adds some space between image and text */
}
.cards2 {
width: 150pt;
height: auto;
border-radius: 30pt;
display: flex;
align-items: center;
flex-direction: column;
}
/*Animations*/
.slidefadein {
opacity: 0;
transform: translateY(100px);
animation: slideAndFade 0.5s ease-in-out forwards;
}
@keyframes slideAndFade {
to {
opacity: 1;
transform: translateY(0);
}
}
/*Table CSS*/
td {
text-align: center;
}
td img {
height: 60px;
}
td {
width: 500px;
padding-top: 3px;
padding-bottom: 2px;
}
img {
border-radius: 10px 10px 10px 10px;
padding: 5px;
}
.project h1 {
font-size: 50pt;
margin-top: 5pt;
}
.project a:link {
text-decoration: none;
}
.project a:visited {
text-decoration: none;
}
.project a:hover {
text-decoration: none;
}
.project a:active {
text-decoration: none;
}
.project p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.no-break {
white-space: nowrap;
}
table {
margin: auto;
width: 95%;
border-collapse: collapse;
}
.table-titel {
margin: 33px
}
table td {
border-bottom: 1px solid #ff5a99;
}
.last-row td {
border-bottom: none;
}
/*Light Color Themes*/
@media (prefers-color-scheme: light) {
:root{
background-color: #ffa7c7;
}
.title{
color: #ff5a99;
}
.neomorphic{
background: #ffa7c7;
box-shadow: -5px -5px 20px rgb(254,254,255, 0.69),
2px 2px 20px rgb(255,90,153)
}
h2 {
color: #060606;
}
th {
color: #55052c;
}
td {
color: #55052c;
}
td a:link {
color: #55052c;
text-decoration: none;
}
td a:visited {
color: #55052c;
text-decoration: none;
}
td a:hover {
color: #55052c;
text-decoration: underline;
}
td a:active {
color: #55052c;
text-decoration: none;
}
}
/*Dark Color Themes*/
@media (prefers-color-scheme: dark) {
:root{
background-color: #55052c;
}
.title{
color: #00d791;
}
.neomorphic{
background: #55052c;
box-shadow: -5px -5px 20px rgb(0,215,145, 0.69),
2px 2px 20px rgb(6,6,6)
}
h2 {
color: #fff3f9;
}
th {
color: #ffa7c7;
}
td {
color: #ffa7c7;
}
td a:link {
color: #ffa7c7;
text-decoration: none;
}
td a:visited {
color: #ffa7c7;
text-decoration: none;
}
td a:hover {
color: #ffa7c7;
text-decoration: underline;
}
td a:active {
color: #ffa7c7;
text-decoration: none;
}
}

@ -3,6 +3,7 @@
src: url("./FuturaLT-Heavy.ttf") format("truetype");
}
/*Basic Site CSS*/
* {
margin: 0;
padding: 0;
@ -29,42 +30,43 @@
flex-direction: column; /* Stack children vertically */
}
#page1 {
height: 100vh;
background-color: #fff3f9;
color: rgb(0, 0, 0);
h2 {
font-size: 25pt;
z-index: 1
}
.title{
font-size: 120px;
z-index: 1;
color: #ff5a99;
ul {
list-style-type: none;
}
#page2 {
background-color: #ffa7c7;
color: white;
li {
padding: 10pt;
}
h2 {
font-size: 25pt;
z-index: 1
img {
width: 160px;
border-radius: 0 100px 100px 0;
padding: 5px;
}
.info {
display: flex;
flex-direction: column;
}
/*Text Glitch Effect*/
.glitch {
position: relative;
display: inline-block;
animation: glitch 1.2s infinite steps(1); /* Instant snaps */
}
/* MAIN GLITCH (Subtler movements, more variations) */
@keyframes glitch {
/* Normal state (longer pauses) */
0%, 60%, 62%, 70%, 100% {
transform: translate(0) skew(0deg) scale(1);
text-shadow: none;
}
/* Micro-glitch variations */
2% {
transform: translate(1px, -1px) skew(-2deg) scale(1.01);
text-shadow: 1px 0 rgba(255, 0, 0, 0.7);
@ -101,7 +103,6 @@ h2 {
}
}
/* PSEUDO-ELEMENTS (Subtle color splits) */
.glitch:before,
.glitch:after {
content: attr(data-text);
@ -111,24 +112,23 @@ h2 {
width: 100%;
height: 100%;
opacity: 0.8;
animation: none; /* Disable smooth animations */
animation: none;
}
.glitch:before {
color: rgba(0, 255, 255, 0.7); /* Cyan */
color: rgba(0, 255, 255, 0.7);
clip-path: polygon(0 0, 100% 0, 100% 30%, 0 30%);
transform: translate(-0.5px, -0.3px);
animation: glitch-before 1.5s infinite steps(1);
}
.glitch:after {
color: rgba(255, 0, 255, 0.7); /* Magenta */
color: rgba(255, 0, 255, 0.7);
clip-path: polygon(0 70%, 100% 70%, 100% 100%, 0 100%);
transform: translate(0.5px, 0.2px);
animation: glitch-after 1.8s infinite steps(1);
}
/* Pseudo-element glitches (tiny offsets) */
@keyframes glitch-before {
0%, 100% { transform: translate(-0.5px, -0.3px); }
10% { transform: translate(-1px, 0) skew(1deg); }
@ -158,23 +158,43 @@ h2 {
}
}
footer{
position: fixed;
bottom: 0px;
width:100%;
height: 75px;
#page1 {
height: 100vh;
}
.title{
font-size: 120px;
z-index: 1;
}
.card {
width: 800pt;
height: auto;
border-radius: 20px;
display: flex;
justify-content: space-around;
align-items: center;
flex-direction: column;
margin-top: 30pt;
}
.background-arms {
position: absolute;
width: 100%;
height: 100%;
.cards1 {
width: 700pt;
height: auto;
border-radius: 40pt;
display: flex;
justify-content: center;
align-items: center;
z-index: 0;
flex-direction: row; /* Changed from column to row */
margin-top: 30pt;
gap: 20px; /* Adds some space between image and text */
}
.cards2 {
width: 150pt;
height: auto;
border-radius: 30pt;
display: flex;
align-items: center;
flex-direction: column;
}
.sunken-arms {
@ -183,9 +203,6 @@ footer{
max-width: 600px;
max-height: 600px;
opacity: 1; /* Subtle background appearance */
filter:
drop-shadow(0.5px 0.5px rgba(255, 255, 255, 0.3))
drop-shadow(-0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.sunken-arms svg {
@ -195,31 +212,51 @@ footer{
/* Style for filled paths */
.filled {
fill: #ffebf2;
stroke: #ffebf2;
stroke-width: 1.4;
stroke-linecap: round;
stroke-linejoin: round;
filter:
drop-shadow(inset 0.5px 0.5px rgba(176, 62, 106, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(255, 255, 255, 0.3));
}
/* Style for stroke-only paths (awns) */
.stroked {
fill: none;
stroke: #ffebf2;
stroke-width: 1.4;
stroke-linecap: round;
stroke-linejoin: round;
filter:
drop-shadow(inset 0.5px 0.5px rgba(255, 255, 255, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.project h1 {
font-size: 50pt;
margin-top: 5pt;
}
.mission {
color: #55052c;
.project a:link {
text-decoration: none;
}
.project a:visited {
text-decoration: none;
}
.project a:hover {
text-decoration: none;
}
.project a:active {
text-decoration: none;
}
.project p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
}
.background-arms {
position: absolute;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
z-index: 0;
}
.mission h1 {
@ -233,10 +270,6 @@ footer{
margin-bottom: 5pt;
}
.about {
color: #55052c;
}
.about h1 {
font-size: 50pt;
margin-top: 5pt;
@ -249,10 +282,6 @@ footer{
margin-bottom: 5pt;
}
.principals {
color: #55052c;
}
.principals h1 {
font-size: 50pt;
margin-top: 5pt;
@ -264,23 +293,31 @@ footer{
margin-top: 5pt;
margin-bottom: 5pt;
}
.no-break {
white-space: nowrap;
}
.project {
color: #55052c;
/*Light Color Themes*/
@media (prefers-color-scheme: light) {
:root{
background-color: #000000;
}
.project h1 {
font-size: 50pt;
margin-top: 5pt;
#page1 {
background-color: #fff3f9;
color: rgb(0, 0, 0);
}
.project p {
font-size: 20pt;
margin-inline: 20pt;
margin-top: 5pt;
margin-bottom: 5pt;
.title{
color: #ff5a99;
}
#page2 {
background-color: #ffa7c7;
color: white;
}
.neomorphic{
background: #ffa7c7;
@ -301,51 +338,157 @@ footer{
2px 2px 20px rgb(255,90,153)
}
.card {
width: 800pt;
height: auto;
border-radius: 20px;
display: flex;
align-items: center;
flex-direction: column;
margin-top: 30pt;
.mission {
color: #55052c;
}
.about {
color: #55052c;
}
.sunken-arms {
filter:
drop-shadow(0.5px 0.5px rgba(255, 255, 255, 0.3))
drop-shadow(-0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.cards1 {
width: 700pt;
height: auto;
border-radius: 40pt;
display: flex;
align-items: center;
flex-direction: row; /* Changed from column to row */
margin-top: 30pt;
gap: 20px; /* Adds some space between image and text */
/* Style for filled paths */
.filled {
fill: #ffebf2;
stroke: #ffebf2;
filter:
drop-shadow(inset 0.5px 0.5px rgba(176, 62, 106, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(255, 255, 255, 0.3));
}
.cards2 {
width: 200px;
height: auto;
border-radius: 40pt;
display: flex;
align-items: center;
flex-direction: column;
/* Style for stroke-only paths (awns) */
.stroked {
stroke: #ffebf2;
filter:
drop-shadow(inset 0.5px 0.5px rgba(255, 255, 255, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.cards2 h2 {
color: #060606;
}
.project {
color: #55052c;
}
ul {
list-style-type: none;
.project h1 {
color: #060606;
}
li {
padding: 10pt;
.project a:link {
color: #060606;
}
.project a:visited {
color: #060606;
}
.project a:hover {
color: #060606;
}
.project a:active {
color: #060606;
}
img {
width: 160px;
border-radius: 0 100px 100px 0;
padding: 5px;
.principals {
color: #55052c;
}
.info {
display: flex;
flex-direction: column;
}
/*Dark Color Themes*/
@media (prefers-color-scheme: dark) {
:root{
background-color: #060606;
}
#page1 {
background-color: #060606;
color: rgb(255, 255, 255);
}
.title{
color: #00d791;
}
#page2 {
background-color: #55052c;
color: black;
}
.neomorphic{
background: #55052c;
box-shadow: -5px -5px 20px rgba(1, 1, 0, 0.69),
2px 2px 20px rgba(0, 215, 143, 0.425)
}
.neomorphic-i{
background: #55052c;
box-shadow: -3px -3px 15px rgba(1, 1, 0, 0.69) inset,
1px 1px 15px rgb(0, 0, 0) inset
}
.neomorphic2{
background: #55052c;
box-shadow: -5px -5px 20px rgba(1, 1, 0, 0.5),
2px 2px 20px rgba(0, 215, 143, 0.534)
}
.mission {
color: #ffa7c7;
}
.about {
color: #ffa7c7;
}
.sunken-arms {
filter:
drop-shadow(0.5px 0.5px rgba(0, 0, 0, 0.3))
drop-shadow(-0.5px -0.5px rgba(176, 62, 106, 0.3));
}
/* Style for filled paths */
.filled {
fill: #000000;
stroke: #000000;
filter:
drop-shadow(inset 0.5px 0.5px rgba(176, 62, 106, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(0, 0, 0, 0.3));
}
/* Style for stroke-only paths (awns) */
.stroked {
stroke: #000000;
filter:
drop-shadow(inset 0.5px 0.5px rgba(0, 0, 0, 0.3))
drop-shadow(inset -0.5px -0.5px rgba(176, 62, 106, 0.3));
}
.cards2 h2 {
color: #fff3f9;
}
.project {
color: #ffa7c7;
}
.project h1 {
color: #fff3f9;
}
.project a:link {
color: #fff3f9;
}
.project a:visited {
color: #fff3f9;
}
.project a:hover {
color: #fff3f9;
}
.project a:active {
color: #fff3f9;
}
.principals {
color: #ffa7c7;
}
}

Loading…
Cancel
Save