toufy/website
toufy/website
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

initial commit

Browse source
This commit is contained in:
toufic ar 2026-01-02 23:00:34 +02:00
commit 24c9032f4f
No known key found for this signature in database
17 changed files with 576 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

198
style.css Normal file
View file

@ -0,0 +1,198 @@
:root {
--primary: #ffb7c5;
--secondary: #ff003f;
--background: #534b4f;
--background-alt: #645452;
--foreground: #faf0e6;
@media (prefers-color-scheme: light) {
--primary: #ff91a4;
--secondary: #dc143c;
--foreground: #534b4f;
--background: #faf0e6;
--background-alt: #f0ead6;
}
}
@font-face {
font-family: DepartureMono;
src: url(./DepartureMono-Regular.woff2);
}
@keyframes banner {
0%,
100% {
background-color: var(--primary);
color: var(--background);
border-top-right-radius: 50px;
border-bottom-left-radius: 50px;
border-top-left-radius: 0;
border-bottom-right-radius: 0;
}
25% {
color: var(--secondary);
}
50% {
color: var(--background);
border-top-left-radius: 50px;
border-bottom-right-radius: 50px;
border-top-right-radius: 0;
border-bottom-left-radius: 0;
}
75% {
color: var(--secondary);
}
}
html {
background-color: var(--background);
color: var(--foreground);
::selection,
::-moz-selection {
background-color: var(--primary);
color: var(--background);
}
font-family: DepartureMono;
* {
margin: 0;
padding: 0;
}
h1 {
color: var(--primary);
font-size: 32px;
}
p,
a {
font-size: 20px;
}
a {
color: var(--primary);
text-decoration: underline;
text-decoration-style: wavy;
&::selection,
&::-moz-selection {
background-color: var(--secondary);
color: var(--primary);
}
&:hover,
&:active {
background-color: var(--primary);
color: var(--background);
text-decoration: none;
}
}
body {
main {
margin: 5% 15%;
@media (max-width: 799px) {
margin: 5% 5%;
}
#banner {
user-select: none;
-moz-user-select: none;
display: flex;
flex-direction: column;
width: 100%;
align-items: center;
justify-content: center;
img {
max-height: 80px;
max-width: 80px;
}
h1 {
font-size: 48px;
padding: 10px;
animation: banner 10s infinite;
}
}
#description {
* {
font-size: 20px;
}
padding: 10px;
margin: 20px 0;
#ideology {
padding: 10px;
margin: 10px;
ul {
list-style-position: inside;
}
}
}
#subdomains {
padding: 5px;
h1,
p {
padding: 5px;
}
#sd-grid {
display: flex;
flex-direction: row;
align-items: stretch;
justify-content: stretch;
flex-wrap: wrap;
.sd-grid-card {
display: flex;
flex-direction: column;
text-align: center;
align-items: center;
justify-content: space-between;
background-color: var(--background-alt);
padding: 5px;
margin: 5px;
border-radius: 5px;
border: 1px solid var(--primary);
width: 300px;
.sd-grid-card-title {
text-align: center;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
font-size: 25px;
color: var(--primary);
width: 100%;
* {
padding: 10px;
}
}
.sd-grid-card-description {
padding: 5px;
text-align: left;
}
.sd-grid-card-action {
padding: 5px;
width: 90%;
border: 4px dotted var(--secondary);
border-radius: 4px;
font-size: 22px;
font-weight: bolder;
text-decoration: none;
color: var(--secondary);
&:hover,
&:active {
background-color: var(--secondary);
color: var(--primary);
}
}
}
}
}
#credits {
h1 {
padding: 5px;
}
p,
li,
a {
font-size: 18px;
}
ul {
margin-left: 10px;
list-style-position: inside;
}
}
}
}
}