Added styles and content
Rafael Alcalde Azpiazu
parent
a8bd67940c
commit
dac2c1cf90
45
index.html
45
index.html
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>NEKERAFA's social links</title>
|
||||
|
||||
|
|
@ -7,24 +7,35 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<link rel="stylesheet" href="https://unpkg.com/@picocss/pico@latest/css/pico.min.css" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css" integrity="sha512-1sCRPdkRXhBV2PBLUdRb4tMg1w2YPf37qatUFeS7zlBy7jJI8Lf4VHwWfZZfpXtYSLy85pkm9GaYVYMfw5BC1A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<link rel="stylesheet" href="./styles.css" />
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
NEKERAFA's social links
|
||||
</header>
|
||||
<main class="container">
|
||||
<h1>NEKERAFA's social links</h1>
|
||||
|
||||
<main>
|
||||
<ul>
|
||||
<li><a href=""><i class="fa-solid fa-rss"></i> My Website: nekerafa.dev</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-twitter"></i> Twitter: @nekerafa_dev</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-mastodon"></i> Mastodon: @LordGomo@tech.lgbt</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-twitch"></i> Twitch: NEKERAFA</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-youtube"></i> YouTube: OoNEKERAFAoO</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-linkedin"></i> LinkedIn: rafael_alcalde_azpiazu</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-github"></i> GitHub: NEKERAFA</a></li>
|
||||
<li><a href=""><i class="fa-brands fa-gitlab"></i> GitLab: NEKERAFA</a></li>
|
||||
</ul>
|
||||
</main>
|
||||
<ul>
|
||||
<li><a href="https://nekerafa.dev" role="button"><i class="fa-solid fa-rss"></i> My Website: nekerafa.dev</a></li>
|
||||
<li><a href="https://matrix.to/#/@nekerafa:matrix.org" role="button"><i class="fa-solid fa-comment-dots"></i> Matrix: @nekerafa:matrix.org</a></li>
|
||||
<li><a href="https://discord.com/users/NEKERAFA#8624" role="button"><i class="fa-brands fa-discord"></i> Discord: NEKERAFA#8624</a></li>
|
||||
<li><a href="https://t.me/nekerafa" role="button"><i class="fa-brands fa-telegram"></i> Telegram: @nekerafa</a></li>
|
||||
<li><a href="https://twitter.com/nekerafa_dev" role="button"><i class="fa-brands fa-twitter"></i> Twitter: @nekerafa_dev</a></li>
|
||||
<li><a rel="me" href="https://tech.lgbt/@nekerafa" role="button"><i class="fa-brands fa-mastodon"></i> Mastodon: @nekerafa@tech.lgbt</a></li>
|
||||
<li><a rel="me" href="https://mastodon.gal/@nekerafa" role="button"><i class="fa-brands fa-mastodon"></i> Mastodon (GAL): @nekerafa@mastodon.gal</a></li>
|
||||
<li><a href="https://twitch.tv/NEKERAFA" role="button"><i class="fa-brands fa-twitch"></i> Twitch: NEKERAFA</a></li>
|
||||
<li><a href="https://youtube.com/OoNEKERAFAoO"role="button"><i class="fa-brands fa-youtube"></i> YouTube: OoNEKERAFAoO</a></li>
|
||||
<li><a href="https://www.linkedin.com/in/rafael-alcalde-azpiazu" role="button"><i class="fa-brands fa-linkedin"></i> LinkedIn: rafael_alcalde_azpiazu</a></li>
|
||||
<li><a href="https://github.com/NEKERAFA" role="button"><i class="fa-brands fa-github"></i> GitHub: NEKERAFA</a></li>
|
||||
<li><a href="https://gitlab.com/NEKERAFA" role="button"><i class="fa-brands fa-gitlab"></i> GitLab: NEKERAFA</a></li>
|
||||
</ul>
|
||||
|
||||
<article>
|
||||
<p>The content of this web is licensed under <a href="https://www.gnu.org/licenses/gpl-3.0.html">GNU General Public License v3.0 (GPLv3)</a>.</p>
|
||||
<p>Layout designed with <a href="https://picocss.com/">Pico.css</a>, under MIT Licensed</p>
|
||||
<p>All icons are under <a href="https://fontawesome.com/"><i class="fa-solid fa-font-awesome"></i> Font awesome license</a>, brand icons are trademarks of their repective owners.</p>
|
||||
<p>Source code on <a href="https://github.com/NEKERAFA/socials.nekerafa.dev"><i class="fa-brands fa-github"></i> GitHub</a></p>
|
||||
</article>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
@import url('https://fonts.googleapis.com/css2?family=Comfortaa&display=swap');
|
||||
|
||||
/* Green Light scheme (Default) */
|
||||
/* Can be forced with data-theme="light" */
|
||||
[data-theme="light"],
|
||||
:root:not([data-theme="dark"]) {
|
||||
--primary: #43a047;
|
||||
--primary-hover: #388e3c;
|
||||
--primary-focus: rgba(67, 160, 71, 0.125);
|
||||
--primary-inverse: #FFF;
|
||||
}
|
||||
|
||||
/* Green Dark scheme (Auto) */
|
||||
/* Automatically enabled if user has Dark mode enabled */
|
||||
@media only screen and (prefers-color-scheme: dark) {
|
||||
:root:not([data-theme="light"]) {
|
||||
--primary: #43a047;
|
||||
--primary-hover: #4caf50;
|
||||
--primary-focus: rgba(67, 160, 71, 0.25);
|
||||
--primary-inverse: #FFF;
|
||||
}
|
||||
}
|
||||
|
||||
/* Green Dark scheme (Forced) */
|
||||
/* Enabled if forced with data-theme="dark" */
|
||||
[data-theme="dark"] {
|
||||
--primary: #43a047;
|
||||
--primary-hover: #4caf50;
|
||||
--primary-focus: rgba(67, 160, 71, 0.25);
|
||||
--primary-inverse: #FFF;
|
||||
}
|
||||
|
||||
/* Green (Common styles) */
|
||||
:root {
|
||||
--form-element-active-border-color: var(--primary);
|
||||
--form-element-focus-color: var(--primary-focus);
|
||||
--switch-color: var(--primary-inverse);
|
||||
--switch-checked-background-color: var(--primary);
|
||||
--font-family: 'Comfortaa', 'Ubuntu', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Comfortaa', 'Ubuntu', sans-serif;
|
||||
}
|
||||
|
||||
h1 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 0 1.5em;
|
||||
}
|
||||
|
||||
ul li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
ul li a i {
|
||||
margin-right: 0.5em;
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
[role="button"] {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
text-align: left;
|
||||
align-items: center;
|
||||
margin-bottom: 2em;
|
||||
padding: 1.5em 1em;
|
||||
}
|
||||
Loading…
Reference in New Issue