add links section
This commit is contained in:
42
index.php
42
index.php
@@ -14,14 +14,14 @@
|
|||||||
|
|
||||||
<div class=contacts>
|
<div class=contacts>
|
||||||
<?php
|
<?php
|
||||||
buildContact("Discord", "#475276", "cesium.one", "https://discord.com/users/230659159450845195");
|
buildLink("contact", "Discord", "#475276", "cesium.one", "https://discord.com/users/230659159450845195");
|
||||||
buildContact("Bluesky", "#2D5786", "cesium.one", "https://bsky.app/profile/cesium.one");
|
buildLink("contact", "Bluesky", "#2D5786", "cesium.one", "https://bsky.app/profile/cesium.one");
|
||||||
buildContact("Matrix", "#0A8864", "@cesium55:matrix.org", false);
|
buildLink("contact", "Matrix", "#0A8864", "@cesium55:matrix.org", false);
|
||||||
buildContact("GitHub", "#494949", "CesiumCs", "https://github.com/CesiumCs");
|
buildLink("contact", "GitHub", "#494949", "CesiumCs", "https://github.com/CesiumCs");
|
||||||
buildContact("YouTube", "#674141", "Cesium", "https://www.youtube.com/channel/UCXPFpgA9G9_wtlyDeT7QAig");
|
buildLink("contact", "YouTube", "#674141", "Cesium", "https://www.youtube.com/channel/UCXPFpgA9G9_wtlyDeT7QAig");
|
||||||
buildContact("Telegram", "#006699", "unfunnycesium", "https://t.me/unfunnycesium");
|
buildLink("contact", "Telegram", "#006699", "unfunnycesium", "https://t.me/unfunnycesium");
|
||||||
buildContact("Fluxer", "#464478", "cesium#3691", false);
|
buildLink("contact", "Fluxer", "#464478", "cesium#3691", false);
|
||||||
buildContact("Stoat", "#5a477d", "cesium#9904", false);
|
buildLink("contact", "Stoat", "#5a477d", "cesium#9904", false);
|
||||||
?>
|
?>
|
||||||
</div> <div style="clear: left;"></div>
|
</div> <div style="clear: left;"></div>
|
||||||
|
|
||||||
@@ -29,15 +29,23 @@
|
|||||||
<p>Names for game accounts I play</p>
|
<p>Names for game accounts I play</p>
|
||||||
<div class=contacts>
|
<div class=contacts>
|
||||||
<?php
|
<?php
|
||||||
buildContact("Steam", "#2A475E", "cesium2349", "https://steamcommunity.com/id/cesium2349");
|
buildLink("contact", "Steam", "#2A475E", "cesium2349", "https://steamcommunity.com/id/cesium2349");
|
||||||
buildContact("Xbox", "#2A475E", "Cesium#2349", false);
|
buildLink("contact", "Xbox", "#2A475E", "Cesium#2349", false);
|
||||||
buildContact("PlayStation", "#2A475E", "Cesium2349", "https://profile.playstation.com/Cesium2349");
|
buildLink("contact", "PlayStation", "#2A475E", "Cesium2349", "https://profile.playstation.com/Cesium2349");
|
||||||
buildContact("VRChat", "#053C48", "cesіum", "https://vrchat.com/home/user/usr_708e41b3-5658-4acc-a95c-ab74f4ac4dff");
|
buildLink("contact", "VRChat", "#053C48", "cesіum", "https://vrchat.com/home/user/usr_708e41b3-5658-4acc-a95c-ab74f4ac4dff");
|
||||||
buildContact("Overwatch", "#053C48", "Kira#112597", "https://overwatch.blizzard.com/en-us/career/d957be8bfe20caffbca920%7C1a7e32ed6054825457037f8f18ef7a6b/");
|
buildLink("contact", "Overwatch", "#053C48", "Kira#112597", "https://overwatch.blizzard.com/en-us/career/d957be8bfe20caffbca920%7C1a7e32ed6054825457037f8f18ef7a6b/");
|
||||||
buildContact("Fortnite", "#053C48", "cesium.one", "https://store.epicgames.com/en-US/u/e0bf067675d247518fd66d813cf1380c");
|
buildLink("contact", "Fortnite", "#053C48", "cesium.one", "https://store.epicgames.com/en-US/u/e0bf067675d247518fd66d813cf1380c");
|
||||||
buildContact("Ingress", "#394A7F", "Cesium5061", false);
|
buildLink("contact", "Ingress", "#394A7F", "Cesium5061", false);
|
||||||
buildContact("Splatoon", "#394A7F", "Kira#1067", "https://stat.ink/@Cesium2349");
|
buildLink("contact", "Splatoon", "#394A7F", "Kira#1067", "https://stat.ink/@Cesium2349");
|
||||||
buildContact("Minecraft", "#394A7F", "cesiumone", false);
|
buildLink("contact", "Minecraft", "#394A7F", "cesiumone", false);
|
||||||
|
?>
|
||||||
|
</div> <div style="clear: left;"></div>
|
||||||
|
|
||||||
|
<h2>Links</h2>
|
||||||
|
<p>other links like apps</p>
|
||||||
|
<div class=links>
|
||||||
|
<?php
|
||||||
|
buildLink("link", "Git Server", "#2A475E", "Gitea, has some small projects", "https://git.cesium.one/explore/repos");
|
||||||
?>
|
?>
|
||||||
</div> <div style="clear: left;"></div>
|
</div> <div style="clear: left;"></div>
|
||||||
|
|
||||||
|
|||||||
@@ -1,20 +1,22 @@
|
|||||||
<?php
|
<?php
|
||||||
function buildContact($title, $color, $username, $url) {
|
function buildLink($type, $title, $color, $text, $url) {
|
||||||
|
|
||||||
if (!$url) {
|
$opacity = $url ? "" : "0.9";
|
||||||
echo "<div class=contact style=\"background-color: $color; opacity: 0.9;\">";
|
|
||||||
} else {
|
|
||||||
echo "<div class=contact style=\"background-color: $color;\">";
|
|
||||||
}
|
|
||||||
|
|
||||||
|
echo "<div class=$type style=\"background-color: $color; opacity: $opacity;\">";
|
||||||
echo "<h3>$title</h3>";
|
echo "<h3>$title</h3>";
|
||||||
|
|
||||||
if (strlen($username) > 15) {
|
switch ($type) {
|
||||||
echo "<p style=\"font-size: 0.8em;\">$username</p>";
|
case "link":
|
||||||
} else {
|
$fontsize = "0.9em";
|
||||||
echo "<p>$username</p>";
|
break;
|
||||||
|
case "contact":
|
||||||
|
$fontsize = (strlen($text) > 15) ? "0.8em" : "1em";
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
echo "<p style=\"font-size: $fontsize;\">$text</p>";
|
||||||
|
|
||||||
if ($url) {
|
if ($url) {
|
||||||
echo "<a title=\"$title\" href=\"$url\"></a>";
|
echo "<a title=\"$title\" href=\"$url\"></a>";
|
||||||
}
|
}
|
||||||
|
|||||||
19
styles.css
19
styles.css
@@ -34,7 +34,7 @@ a {
|
|||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
.contacts {
|
.contacts, .links {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@@ -42,8 +42,7 @@ a {
|
|||||||
margin: auto;
|
margin: auto;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
.contact {
|
.contact, .link {
|
||||||
width: 170px;
|
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
background-color: #232629;
|
background-color: #232629;
|
||||||
@@ -53,10 +52,16 @@ a {
|
|||||||
position: relative;
|
position: relative;
|
||||||
transition: opacity .25s;
|
transition: opacity .25s;
|
||||||
}
|
}
|
||||||
|
.contact {
|
||||||
|
width: 170px;
|
||||||
|
}
|
||||||
|
.link {
|
||||||
|
width: 340px;
|
||||||
|
}
|
||||||
|
|
||||||
/* some hacky shit to make <div class=contact>s clickable. basically just makes
|
/* some hacky shit to make <div class=contact>s clickable. basically just makes
|
||||||
an <a> in a <div class=contact> take up the full div */
|
an <a> in a <div class=contact> take up the full div */
|
||||||
.contact a {
|
.contact a, .links a {
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@@ -71,7 +76,7 @@ div.contact:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width:900px) {
|
@media screen and (max-width:900px) {
|
||||||
.contacts {
|
.contacts, .links {
|
||||||
width: 580px;
|
width: 580px;
|
||||||
}
|
}
|
||||||
:root {
|
:root {
|
||||||
@@ -79,7 +84,7 @@ div.contact:hover {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media screen and (max-width:700px) {
|
@media screen and (max-width:700px) {
|
||||||
.contacts {
|
.contacts, .links {
|
||||||
width: 380px;
|
width: 380px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -89,7 +94,7 @@ div.contact:hover {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media screen and (max-width:390px) {
|
@media screen and (max-width:390px) {
|
||||||
.contacts {
|
.contacts, .links {
|
||||||
width: 200px;
|
width: 200px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user