masiv/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Transfer to git

Browse Source
This commit is contained in:
masiv
2026-02-03 19:37:38 -03:00
commit 35d8517e56
137 changed files with 5817 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
css/global/fonts/HonyaJi-Re.ttf Normal file
View File

Binary file not shown.

BIN
css/global/fonts/basiic.ttf Normal file
View File

Binary file not shown.

BIN
css/global/fonts/beefont.ttf Normal file
View File

Binary file not shown.

BIN
css/global/fonts/lmmono10-regular.woff Normal file
View File

Binary file not shown.

BIN
css/global/fonts/specialelite.woff2 Normal file
View File

Binary file not shown.

3
css/global/global-settings.css Normal file
View File

@@ -0,0 +1,3 @@
@import url('styling/reset.css');
@import url('layout/global-layout.css');
@import url('styling/global-styling.css');

171
css/global/layout/global-layout.css Normal file
View File

@@ -0,0 +1,171 @@
/* -------- Variables --------- */
html {
--gap: 2em;
--mobile-topnavbar-height: 125px;
--mobile-botnavbar-height: var(--mobile-topnavbar-height);
--side-bar-width: 240px;
--max-percentage-width-navar: 70%;
}
/* ---- Hide mobile only ---- */
.navbar.bot { display: none; }
/* ---- Hierarchical layout ---- */
.panel { padding: calc(var(--gap) / 2); }
.panel .header {
flex-shrink: 0;
display: flex;
justify-content: center;
align-items: center;
height: calc(var(--title-height) + 0.5em );
transform: translateY(-15px);}
.blank { pointer-events: none; }
body {
display: flex;
flex-direction: row;
height: 100%;
overflow: hidden;
}
.navbar {
position: fixed;
z-index: 999;
display: flex;
gap: var(--gap);
padding: var(--gap);
}
.navbar.blank {
position: relative;
flex-shrink: 0;
opacity: 0;}
.navbar.top {
flex-direction: column;
justify-content: space-around;
align-items: center;
width: var(--side-bar-width);
height: 100%;
--max-width: var(--max-percentage-width-navar);
}
.links {
flex-grow: 1;
display: flex;
flex-direction: column;
justify-content: flex-start;
gap: calc(var(--gap) / 2);}
.links > div {
align-items: center;
height: 50px;
padding: 7px;}
.links a {
margin: 0px;
text-align: left;}
.links .mail { height: fit-content; }
.links > .social-media {
display: flex;
flex-direction: row;
gap: calc(var(--gap) / 4);}
.links img { height: 24px; }
.navbar.top > div { width: 100%; }
.wrapper {
flex-grow: 1;
width: 0%; /* Don't know why this works, forces div to always grow */
overflow-y: auto;
overflow-x: hidden;}
.primary {
display: flex;
flex-direction: row-reverse;
align-content: space-between;
flex-wrap: wrap;
padding: var(--gap);
gap: var(--gap);
height: fit-content;
width: 100%;}
@media only all and (max-width:700px) {
/* -- Ordering -- */
.about { order: 1; }
.logo { order: 2; }
.lang-picker { order: 3; }
/* -- Layout -- */
body {
flex-direction: column;
overflow: hidden;}
.wrapper {
width: 100%;
height: fit-content;
display: flex;
flex-direction: column;
flex-wrap: wrap;
gap: 0;
overflow: auto;
position: relative;}
.navbar.top {
flex-direction: row;
justify-content: space-around;
align-items: center;
height: var(--mobile-topnavbar-height);
gap: var(--gap);
width: 100%;
--max-width: 80%;}
.navbar.top > .links { display: none; }
.navbar.bot { display: flex; }
.navbar.bot.blank {
position: relative;
flex-shrink: 0;
opacity: 0;}
.navbar.bot {
display: flex;
position: fixed;
bottom: 0px;
height: var(--mobile-botnavbar-height);
flex-direction: column;
justify-content: center;
align-content: center;
width: 100%;}
.navbar.bot > div { flex-direction: row; }
.links {
/* Scroll mechanics */
margin-bottom: -1em; /* Trick to hide visual scrollbar */
padding-bottom: 1em;
overflow-x: auto;
overflow-y: hidden;
mask-image: linear-gradient(to right, rgba(0,0,0,1) 80%, rgba(0,0,0,0));
/* Ordering */
justify-content: flex-start;
clip-path: content-box;
align-items: flex-start;
flex-direction: column;}
.links .last { margin-right: 20%; } /* Complementing visual trick by allow extra scrolling to hide previous visual trick, 100% - 80% */
.links > div{ align-items: center;}
}

174
css/global/styling/global-styling.css Normal file
View File

@@ -0,0 +1,174 @@
/* Colors */
/* ---------------- Variables ---------------- */
html {
--border-radius: 5px;
--accent-color-light: aliceblue;
--accent-color-middle: rgb(173, 189, 203);
--accent-color-dark: rgb(24, 47, 56);
--panel-border_one: var(--accent-color-dark);
--panel-border_two: var(--accent-color-dark);
--panel-header: var(--accent-color-dark);
--panel-background: var(--accent-color-light);
--body-background: rgb(255, 255, 255);
--input-background: white;
--input-background-hover: rgb(216, 222, 227);
--input-highlight: rgb(86, 176, 255);
--navvar-background: rgb(179, 200, 218);
--navbar-buttons-bg: var(--accent-color-light);
--navbar-buttons-hover: var(--input-background-hover);
--input-border-radius: var(--border-radius);
--link-color: var(--accent-color-dark);
--link-color-hover: var(--input-highlight);
--logo-outline-color: var(--input-highlight);}
/* Background texture */
body { background-image: url('graphgreen.gif'); }
/* ----------------- Others -------------------- */
* { scrollbar-width: thin;}
img { image-rendering: pixelated;}
.logo { position: relative; }
.logo > img {
position: absolute;
width: 80px;
top: 15px;
right: -40px;}
.links { overflow-y: auto; }
.links a { text-decoration: none;}
/* ----------------- Fonts -------------------- */
@font-face {
font-family: 'special elite';
src: url('../fonts/specialelite.woff2') format('woff');
font-weight: normal;
font-style: normal;}
@font-face {
font-family: 'honyaji';
src: url('../fonts/HonyaJi-Re.ttf') format('truetype');
font-weight: normal;
font-style: normal;}
@font-face {
font-family: 'basiic';
src: url('../fonts/basiic.ttf') format('truetype');
font-weight: normal;
font-style: normal;}
@font-face {
font-family: 'beefont';
src: url('../fonts/beefont.ttf') format('truetype');
font-weight: normal;
font-style: normal;}
* { text-align: center; }
body { font-family: 'special elite', honyaji, basiic, monospace, serif, sans-serif; }
/* ----------------- Color -------------------- */
.navbar { background-color: var(--navvar-background); }
.panel {
position: relative;
border-radius: 5px;
border: 2px solid var(--panel-border_one);
background-color: var(--panel-background);}
.chat-history {
border-radius: var(--chat-border-radius);
background-color: var(--chat-history-background);}
/* ------------- Decorations & dividers (D&D) -------------------- */
.panel .header { position: relative; }
.panel .header::after {
position: absolute;
bottom: -3px;
content: "- - --⛤-- - -";
font-size: 15px;}
/* ------------- Navbars stiling ------------------- */
.about, .links > div, .lang-picker {
border: 5px groove rgb(214, 236, 255);
background: var(--navbar-buttons-bg);}
.about:hover, .links > div:hover, .lang-picker:hover {
background-color: var(--navbar-buttons-hover);
transition: background-color 0.1s;}
/* ------------- Inputs & links ----------------- */
button, .button {
font-family: 'special elite';
background-color: var(--input-background);
border: 0;
border-radius: var(--input-border-radius);
border-bottom: 4px solid var(--input-highlight);
padding: 0.35em;}
button:hover, .button:hover {
background-color: var(--input-background-hover);
border-bottom: 2px solid var(--input-highlight);
padding-bottom: 0.1em;
padding-top: calc((0.35em + (0.25em - 0.1em)) + 2px);
transition: background-color 0.1s;
transition: border-bottom 0.1s;
transition: padding-bottom 0.15s;
transition: padding-top 0.15s;}
input[type=text] {
font-family: 'special elite';
border: 0;
border-radius: var(--input-border-radius);
border-bottom: 4px solid var(--input-highlight);
transition: background-color 0.1s;
transition: border-bottom 0.1s;}
input[type=text]:focus { outline: 0; }
input[type=text]:hover {
border-bottom: 2px solid var(--input-highlight);
background-color: var(--input-background-hover);
transition: background-color 0.1s;}
a, a:visited {
color: var(--link-color);
text-decoration-style: wavy;}
a:hover {
transform: translateY(-2px);
color: var(--link-color-hover);
transition: color 0.1s;
transition: transform 0.1s;}
.logo { position: relative; }
.logo-text {
/* position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%); */
font-size: 40px;
color: white;
text-shadow:
2px 0 var(--logo-outline-color),
-2px 0 var(--logo-outline-color),
0 2px var(--logo-outline-color),
0 -2px var(--logo-outline-color),
1px 1px var(--logo-outline-color),
-1px -1px var(--logo-outline-color),
1px -1px var(--logo-outline-color),
-1px 1px var(--logo-outline-color);}
.logo a {
color: white;
text-decoration: none;
}

BIN
css/global/styling/graphgreen.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 416 B

11
css/global/styling/reset.css Normal file
View File

@@ -0,0 +1,11 @@
/* Reset */
html, body {
box-sizing: border-box;
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
* { box-sizing: inherit; }