añadir sitio existente
This commit is contained in:
Santiago Forero
parent
4232f2fb20
commit
69671f0c42
|
|
@ -0,0 +1,216 @@
|
|||
|
||||
@-webkit-keyframes acidmove {
|
||||
0% {left:-10px; opacity: 0.3;}
|
||||
5% {left:-5px; opacity: 0.4;}
|
||||
10% {left:-8px; opacity: 0.3;}
|
||||
15% {left:-4px; opacity: 0.1;}
|
||||
20% {left:-5px; opacity: 0.1;}
|
||||
25% {left:-4px; opacity: 0.1;}
|
||||
30% {left:-9px; opacity: 0.2;}
|
||||
35% {left:-6px; opacity: 0.4;}
|
||||
40% {left:-3px; opacity: 0.2;}
|
||||
45% {left:-8px; opacity: 0.2;}
|
||||
100% {left:-4px; opacity: 0.2;}
|
||||
}
|
||||
|
||||
@-webkit-keyframes acidmove-retina {
|
||||
0% {left:-11px; opacity: 0.3;}
|
||||
5% {left:-6px; opacity: 0.4;}
|
||||
10% {left:-9px; opacity: 0.3;}
|
||||
15% {left:-6px; opacity: 0.1;}
|
||||
20% {left:-4px; opacity: 0.1;}
|
||||
25% {left:-4px; opacity: 0.1;}
|
||||
30% {left:-9px; opacity: 0.2;}
|
||||
35% {left:-6px; opacity: 0.4;}
|
||||
40% {left:-3px; opacity: 0.2;}
|
||||
45% {left:-8px; opacity: 0.2;}
|
||||
100% {left:-4px; opacity: 0.2;}
|
||||
}
|
||||
|
||||
@-webkit-keyframes static {
|
||||
0% {top: 0; height: 0; opacity: 0.5;}
|
||||
10% {top: 0; height: 10%;}
|
||||
11% {opacity: 0.8;}
|
||||
12% {opacity: 0.5;}
|
||||
20% {opacity: 0.3;}
|
||||
21% {opacity: 0.8;}
|
||||
23% {opacity: 0.3;}
|
||||
41% {opacity: 0.7;}
|
||||
44% {opacity: 0.6;}
|
||||
50% {opacity: 0.4;}
|
||||
60% {opacity: 0.3;}
|
||||
61% {opacity: 0.5;}
|
||||
63% {opacity: 0.6;}
|
||||
90% {top: 90%; height: 10%;}
|
||||
100% {top: 100%; height: 0; opacity: 0.5;}
|
||||
}
|
||||
|
||||
@-webkit-keyframes static-retina {
|
||||
0% {top: 0; height: 0; opacity: 0.5;}
|
||||
10% {top: 0; height: 10%;}
|
||||
11% {opacity: 0.7;}
|
||||
12% {opacity: 0.6;}
|
||||
20% {opacity: 0.3;}
|
||||
21% {opacity: 0.7;}
|
||||
23% {opacity: 0.3;}
|
||||
41% {opacity: 0.7;}
|
||||
44% {opacity: 0.5;}
|
||||
50% {opacity: 0.4;}
|
||||
60% {opacity: 0.3;}
|
||||
61% {opacity: 0.5;}
|
||||
63% {opacity: 0.7;}
|
||||
90% {top: 90%; height: 10%;}
|
||||
100% {top: 100%; height: 0; opacity: 0.5;}
|
||||
}
|
||||
|
||||
|
||||
|
||||
html {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
*, *:before, *:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: black;
|
||||
background-image: url('/img/broken_noise_@2X.png');
|
||||
|
||||
color: #00DF00;
|
||||
font-family: 'VT323', 'Courier', monospace;
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: #00DF00; /* Safari */
|
||||
color: black;
|
||||
}
|
||||
::-moz-selection {
|
||||
background: #ffb7b7; /* Firefox */
|
||||
}
|
||||
.content {
|
||||
z-index: 100;
|
||||
background-image: url('/img/line.png');
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
min-height: 100%;
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
.content:last-child {
|
||||
z-index: 1;
|
||||
left: -2px;
|
||||
opacity: 0.3;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 1) {
|
||||
.content:last-child {
|
||||
-webkit-animation: acidmove 8s ease-in;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.fuzz {
|
||||
-webkit-animation: static 40s linear;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 2) {
|
||||
.content:last-child {
|
||||
-webkit-animation: acidmove-retina 8s ease-in;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
.fuzz {
|
||||
-webkit-animation: static-retina 40s linear;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.fuzz {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(80,80,80,0.2);
|
||||
z-index: 20;
|
||||
height: 0;
|
||||
transform: translate3d(0,0,0);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.content:last-child .fuzz {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.logo-area {
|
||||
text-align: center;
|
||||
margin-top: 60px;
|
||||
text-shadow: 0 0 20px #00DF00;
|
||||
}
|
||||
.logo {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
}
|
||||
.logo-area-quote {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.instructions-wrapper {
|
||||
text-align: center;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.instructions {
|
||||
display: inline-block;
|
||||
width: 40em;
|
||||
text-align: left;
|
||||
}
|
||||
.green {
|
||||
color: #00DF00;
|
||||
text-shadow: 0 0 20px #00DF00;
|
||||
}
|
||||
.white{
|
||||
color: white;
|
||||
text-shadow: 0 0 20px rgba(255,255,255,0.5);
|
||||
}
|
||||
.cyan {
|
||||
color: #00E3E3;
|
||||
text-shadow: 0 0 20px #00E3E3;
|
||||
}
|
||||
.yellow {
|
||||
color: #E7E700;
|
||||
text-shadow: 0 0 20px #E7E700;
|
||||
}
|
||||
.magenta {
|
||||
color: #E100E1;
|
||||
text-shadow: 0 0 20px #E100E1;
|
||||
}
|
||||
ul,
|
||||
ol {
|
||||
list-style: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,148 @@
|
|||
html {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
*, *:before, *:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
html, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: black;
|
||||
|
||||
color: #00DF00;
|
||||
font-family: 'VT323', 'Courier', monospace;
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
pre {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: #00DF00; /* Safari */
|
||||
color: black;
|
||||
}
|
||||
::-moz-selection {
|
||||
background: #ffb7b7; /* Firefox */
|
||||
}
|
||||
.content {
|
||||
z-index: 100;
|
||||
background-image: url('/img/line.png');
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
min-height: 100%;
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
.content:last-child {
|
||||
z-index: 1;
|
||||
left: -2px;
|
||||
opacity: 0.3;
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 1) {
|
||||
.content:last-child {
|
||||
-webkit-animation: acidmove 8s ease-in;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
.fuzz {
|
||||
-webkit-animation: static 40s linear;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (-webkit-min-device-pixel-ratio: 2) {
|
||||
.content:last-child {
|
||||
-webkit-animation: acidmove-retina 8s ease-in;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
.fuzz {
|
||||
-webkit-animation: static-retina 40s linear;
|
||||
-webkit-animation-delay: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.fuzz {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: rgba(80,80,80,0.2);
|
||||
z-index: 20;
|
||||
height: 0;
|
||||
transform: translate3d(0,0,0);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.content:last-child .fuzz {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.logo-area {
|
||||
text-align: center;
|
||||
margin-top: 60px;
|
||||
text-shadow: 0 0 20px #00DF00;
|
||||
}
|
||||
.logo {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
}
|
||||
.logo-area-quote {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.instructions-wrapper {
|
||||
text-align: center;
|
||||
margin-top: 50px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.instructions {
|
||||
display: inline-block;
|
||||
width: 40em;
|
||||
text-align: left;
|
||||
}
|
||||
.green {
|
||||
color: #00DF00;
|
||||
text-shadow: 0 0 20px #00DF00;
|
||||
}
|
||||
.white{
|
||||
color: white;
|
||||
text-shadow: 0 0 20px rgba(255,255,255,0.5);
|
||||
}
|
||||
.cyan {
|
||||
color: #00E3E3;
|
||||
text-shadow: 0 0 20px #00E3E3;
|
||||
}
|
||||
.yellow {
|
||||
color: #E7E700;
|
||||
text-shadow: 0 0 20px #E7E700;
|
||||
}
|
||||
.magenta {
|
||||
color: #E100E1;
|
||||
text-shadow: 0 0 20px #E100E1;
|
||||
}
|
||||
ul,
|
||||
ol {
|
||||
list-style: none;
|
||||
}
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css">
|
||||
<link href="css/style.css" rel="stylesheet" type="text/css">
|
||||
<title>xinu.me</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content" id="content-node">
|
||||
<div class="fuzz"></div>
|
||||
<div class="logo-area">
|
||||
<pre class="logo">
|
||||
_
|
||||
__ _(_)_ __ _ _ _ __ ___ ___
|
||||
\ \/ / | '_ \| | | | | '_ ` _ \ / _ \
|
||||
> <| | | | | |_| | _| | | | | | __/
|
||||
/_/\_\_|_| |_|\__,_|(_)_| |_| |_|\___|
|
||||
|
||||
</pre>
|
||||
<blockquote class="logo-area-quote white">"pequeño sistema UNIX de acceso público"</blockquote>
|
||||
</div>
|
||||
<div class="instructions-wrapper">
|
||||
<div class="instructions">
|
||||
|
||||
<h3>¿Quieres unirte?¡Estaremos encantados de conocerte!</h3>
|
||||
<p>
|
||||
Echa un ojo <a href="inscripcion.html" class="cyan">aquí</a>.
|
||||
</p>
|
||||
|
||||
<h3>Ya estoy en xinu.me, ¿ahora qué?</h3>
|
||||
<p>
|
||||
Nos gustaría que xinu.me tuviese un gran espíritu de comunidad. Mientras redactamos unas
|
||||
normas de netiqueta para los recien llegados...
|
||||
<ol class="green">
|
||||
<li><span class="white">-</span> ¡NO PIRATEES EL GIBSON!</li>
|
||||
<li><span class="white">-</span> Nada de dramas. Se respetuoso. Diviértete. Nos estamos esforzando y estamos todos juntos en esto.</li>
|
||||
</ol>
|
||||
</p>
|
||||
|
||||
<h3>Vale, lo he pillado: no seas un capullo. Pero... ¿cómo hago cosas?</h3>
|
||||
<p>
|
||||
<a href="tutorial.html" class="cyan">Aquí</a> podrás encontrar un pequeño tutorial introductorio con lo más básico.
|
||||
|
||||
</p>
|
||||
|
||||
<h3>Estamos deseando conocerte</h3>
|
||||
<pre>
|
||||
\||/
|
||||
| @___oo
|
||||
/\ /\ / (__,,,,|
|
||||
) /^\) ^\/ _)
|
||||
) /^\/ _)
|
||||
) _ / / _)
|
||||
/\ )/\/ || | )_)
|
||||
< > |(,,) )__)
|
||||
|| / \)___)\
|
||||
| \____( )___) )___
|
||||
\______(_______;;; __;;;
|
||||
</pre>
|
||||
|
||||
<br><span class="green">100% compatible con Lynx. En serio.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var p = document.getElementById("content-node");
|
||||
var p_prime = p.cloneNode(true);
|
||||
document.body.appendChild(p_prime);
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css">
|
||||
<link href="css/style.css" rel="stylesheet" type="text/css">
|
||||
<title>xinu.me</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content" id="content-node">
|
||||
<div class="fuzz"></div>
|
||||
<div class="logo-area">
|
||||
<pre class="logo">
|
||||
_
|
||||
__ _(_)_ __ _ _ _ __ ___ ___
|
||||
\ \/ / | '_ \| | | | | '_ ` _ \ / _ \
|
||||
> <| | | | | |_| | _| | | | | | __/
|
||||
/_/\_\_|_| |_|\__,_|(_)_| |_| |_|\___|
|
||||
|
||||
</pre>
|
||||
<blockquote class="logo-area-quote white">"pequeño sistema UNIX de acceso público"</blockquote>
|
||||
</div>
|
||||
<div class="instructions-wrapper">
|
||||
<div class="instructions">
|
||||
<p>
|
||||
xinu.me no es una red social. Es una comunidad experimental para socializar, desarrollar habilidades digitales y colaborar a través de la shell del sistema.<br>
|
||||
</p>
|
||||
<strong>PRINCIPIOS:</strong>
|
||||
<ul style="margin-top:0px">
|
||||
<li>
|
||||
<strong class="yellow">FUERA DE LA WEB:</strong>
|
||||
Aunque los usuarios puede crear sitios web, cápsulas gemini y contenido gopher, lo interesante pasa en la línea de comandos donde tu controlas quién ve tu contenido.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">DIY:</strong>
|
||||
El entorno UNIX facilita la "fabricación" de tus propias herramientas.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">MINIMALISMO:</strong>
|
||||
xine.me corre sobre un VPS con 1 GB de RAM y 30 GB de disco duro. Usando interfaces basadas en texto se minimiza el consumo de recursos.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">NO COMERCIAL:</strong>
|
||||
Sin cuota de miembro, sin publicidad y nadie crea un perfil con tus movimientos online para venderlo. En xine.me pagas tu cuota de miembro participando en la comunidad, creando cosas molonas, testeando lo que crearon otros miembros y enseñando a otros lo que sabes.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">ASÍNCRONO:</strong>
|
||||
Aunque puedes usar el IRC para la comunicación en tiempo real, mucha de la interacción es asíncrona en el sentido de que puedes ver lo que están haciendo el resto de usuarios, darle unas vueltas y luego comentarlo en el BBS tranquílamente, sin prisa.
|
||||
</li>
|
||||
</ul>
|
||||
<p>
|
||||
Inspirado fuertemente por los principios del <a href="https://tildeverse.org/" class="cyan">"tildeverso"</a> y el servidor tilde <a href="https://rawtext.club/" class="cyan">rawtext.club</a>.
|
||||
</p>
|
||||
<span class="green">Enlaces de interés:</span><br>
|
||||
|
||||
<ol class="green">
|
||||
<li>1. <a href="faq.html" class="cyan">FAQ</a></li>
|
||||
<li>2. <a href="inscripcion.html" class="cyan">Inscríbete</a>!</li>
|
||||
|
||||
</ol>
|
||||
|
||||
<br><span class="green">100% compatible con Lynx. En serio.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var p = document.getElementById("content-node");
|
||||
var p_prime = p.cloneNode(true);
|
||||
document.body.appendChild(p_prime);
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,86 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css">
|
||||
<link href="css/style.css" rel="stylesheet" type="text/css">
|
||||
<title>xinu.me</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content" id="content-node">
|
||||
<div class="fuzz"></div>
|
||||
<div class="logo-area">
|
||||
<pre class="logo">
|
||||
_
|
||||
__ _(_)_ __ _ _ _ __ ___ ___
|
||||
\ \/ / | '_ \| | | | | '_ ` _ \ / _ \
|
||||
> <| | | | | |_| | _| | | | | | __/
|
||||
/_/\_\_|_| |_|\__,_|(_)_| |_| |_|\___|
|
||||
|
||||
</pre>
|
||||
<blockquote class="logo-area-quote white">"pequeño sistema UNIX de acceso público"</blockquote>
|
||||
</div>
|
||||
<div class="instructions-wrapper">
|
||||
<div class="instructions">
|
||||
<p>
|
||||
xinu.me no es una red social. Es una comunidad experimental para socializar, desarrollar habilidades digitales y colaborar a través de la shell del sistema.<br>
|
||||
</p>
|
||||
<strong>PRINCIPIOS:</strong>
|
||||
<ul style="margin-top:0px">
|
||||
<li>
|
||||
<strong class="yellow">FUERA DE LA WEB:</strong>
|
||||
Aunque los usuarios puede crear sitios web, cápsulas gemini y contenido gopher, lo interesante pasa en la línea de comandos donde tu controlas quién ve tu contenido.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">DIY:</strong>
|
||||
El entorno UNIX facilita la "fabricación" de tus propias herramientas.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">MINIMALISMO:</strong>
|
||||
xine.me corre sobre un VPS con 1 GB de RAM y 30 GB de disco duro. Usando interfaces basadas en texto se minimiza el consumo de recursos.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">NO COMERCIAL:</strong>
|
||||
Sin cuota de miembro, sin publicidad y nadie crea un perfil con tus movimientos online para venderlo. En xine.me pagas tu cuota de miembro participando en la comunidad, creando cosas molonas, testeando lo que crearon otros miembros y enseñando a otros lo que sabes.
|
||||
</li>
|
||||
<li>
|
||||
<strong class="yellow">ASÍNCRONO:</strong>
|
||||
Aunque puedes usar el IRC para la comunicación en tiempo real, mucha de la interacción es asíncrona en el sentido de que puedes ver lo que están haciendo el resto de usuarios, darle unas vueltas y luego comentarlo en el BBS tranquílamente, sin prisa.
|
||||
</li>
|
||||
</ul>
|
||||
<p>
|
||||
Inspirado fuertemente por los principios del <a href="https://tildeverse.org/" class="cyan">"tildeverso"</a> y el servidor tilde <a href="https://rawtext.club/" class="cyan">rawtext.club</a>.
|
||||
</p>
|
||||
<span class="green">Enlaces de interés:</span><br>
|
||||
|
||||
<ol class="green">
|
||||
<li>1. <a href="faq.html" class="cyan">FAQ</a></li>
|
||||
<li>2. <a href="inscripcion.html" class="cyan">Inscríbete</a>!</li>
|
||||
|
||||
</ol>
|
||||
|
||||
<span class="yellow">USUARIOS:</span><br>
|
||||
<ul style="margin-top:0px;">
|
||||
<?php
|
||||
$homes = preg_grep('/^([^.])/', scandir("/home/"));
|
||||
foreach ($homes as $user){
|
||||
if ($user != '.' or $user != ".."){
|
||||
echo '<li><a href="https://xinu.me/~'.$user.'" class="cyan">~'.$user.'</a></li>';
|
||||
}
|
||||
}
|
||||
?>
|
||||
</ul>
|
||||
<br><span class="green">100% compatible con Lynx. En serio.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var p = document.getElementById("content-node");
|
||||
var p_prime = p.cloneNode(true);
|
||||
document.body.appendChild(p_prime);
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css">
|
||||
<link href="css/style.css" rel="stylesheet" type="text/css">
|
||||
<title>xinu.me</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content" id="content-node">
|
||||
<div class="fuzz"></div>
|
||||
<div class="logo-area">
|
||||
<pre class="logo">
|
||||
_
|
||||
__ _(_)_ __ _ _ _ __ ___ ___
|
||||
\ \/ / | '_ \| | | | | '_ ` _ \ / _ \
|
||||
> <| | | | | |_| | _| | | | | | __/
|
||||
/_/\_\_|_| |_|\__,_|(_)_| |_| |_|\___|
|
||||
|
||||
</pre>
|
||||
<blockquote class="logo-area-quote white">"pequeño sistema UNIX de acceso público"</blockquote>
|
||||
</div>
|
||||
<div class="instructions-wrapper">
|
||||
<div class="instructions">
|
||||
<p>
|
||||
Para solicitar una cuenta de usuario en xinu.me envíame un email a serxoz en xinu.me con los siguientes datos:
|
||||
</p>
|
||||
|
||||
<ol class="green">
|
||||
<li>1. Un nombre de <span class="white">usuario</span> que te mole.</li>
|
||||
<li>2. Tu clave ssh <span class="white">pública</span>.</li>
|
||||
<li>3. Tu <span class="white">shell</span> favorita, si es que tienes alguna.</li>
|
||||
</ol>
|
||||
|
||||
<p>
|
||||
Cuentanos también algo de tí, intereses o como has oído hablar de xinu.me
|
||||
</p>
|
||||
|
||||
<br><span class="green">100% compatible con Lynx. En serio.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var p = document.getElementById("content-node");
|
||||
var p_prime = p.cloneNode(true);
|
||||
document.body.appendChild(p_prime);
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,121 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet" type="text/css">
|
||||
<link href="css/style.css" rel="stylesheet" type="text/css">
|
||||
<title>xinu.me</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="content" id="content-node">
|
||||
<div class="fuzz"></div>
|
||||
<div class="logo-area">
|
||||
<pre class="logo">
|
||||
_
|
||||
__ _(_)_ __ _ _ _ __ ___ ___
|
||||
\ \/ / | '_ \| | | | | '_ ` _ \ / _ \
|
||||
> <| | | | | |_| | _| | | | | | __/
|
||||
/_/\_\_|_| |_|\__,_|(_)_| |_| |_|\___|
|
||||
|
||||
</pre>
|
||||
<blockquote class="logo-area-quote white">"pequeño sistema UNIX de acceso público"</blockquote>
|
||||
</div>
|
||||
<div class="instructions-wrapper">
|
||||
<div class="instructions">
|
||||
|
||||
<h3>¡Bienvenido!</h3>
|
||||
<p>
|
||||
¿Nuevo con la línea de comandos y todo la movida web? ¡Estás de suerte! Aquí encontrarás un pequeño tutorial básico al estilo "Hola Mundo".
|
||||
</p>
|
||||
|
||||
<h3>Iniciando sesión</h3>
|
||||
<pre>
|
||||
_______________________________________
|
||||
/ Bienvenido a xinu.me! Un lugar para \
|
||||
\ alojar tus páginas web. /
|
||||
---------------------------------------
|
||||
\ ^__^
|
||||
\ (oo)\_______
|
||||
(__)\ )\/\
|
||||
||----w |
|
||||
|| ||
|
||||
</pre>
|
||||
<p>
|
||||
<ol class="green">
|
||||
<li>1. En un Mac abre la aplicación Terminal, en un Windows necesitas un cliente SSH.
|
||||
<a href="https://www.putty.org/" class="cyan">PuTTY</a> es una buena opción.</li>
|
||||
<li>2. Teclea: <span class="white">ssh tuusuariomolón@xinu.me</span> y pulsa la tecla "Entrar".</li>
|
||||
<li>3. Teclea <span class="white">tuclave</span> y pulsa la tecla "Entrar".</li>
|
||||
|
||||
</ol>
|
||||
</p>
|
||||
|
||||
<h3>Encuentra tu archivo index.hml</h3>
|
||||
<p>
|
||||
Hay varios comandos básicos que querrás aprender, pero para este tutorial solo necesitarás unos pocos:
|
||||
</p>
|
||||
<ol class="green">
|
||||
<li><span class="white">ls</span> sirve para listar los archivos en el directorio actual.</li>
|
||||
<li><span class="white">cd</span> sirve para cambiar de directorio.</li>
|
||||
<li><span class="white">nano</span> es un editor de línea de comandos.</li>
|
||||
</ol>
|
||||
|
||||
<ol class="green">
|
||||
<li>1. Teclea: <span class="white">ls</span> y pulsa "Entrar" para ver donde estás. Deberías
|
||||
ver un directorio llamado "public_html".</li>
|
||||
<li>2. Teclea: <span class="white">cd public_html</span> y pulsa "Entrar" para moverte a ese directorio.</li>
|
||||
<li>3. Teclea: <span class="white">ls</span> y pulsa "Entrar" para ver donde estás. Deberías
|
||||
ver tu archivo index.html.</li>
|
||||
</ol>
|
||||
|
||||
<h3>Edita tu archivo index.html</h3>
|
||||
<ol class="green">
|
||||
<li>1. Teclea: <span class="white">nano index.html</span> y pulsa "Entrar" para abrir tu archivo
|
||||
index.html y empezar a editarlo.</li>
|
||||
<li>2. Edita tu archivo, quiera o no quiera :D</li>
|
||||
<li>3. Cuando acabes, usa <span class="white">CTRL+X</span> para cerrar el archivo.</li>
|
||||
<li>4. Te preguntará si quieres guardarlo; responde <span class="white">y</span> y pulsa "Entrar"
|
||||
para volver a la línea de comandos.</li>
|
||||
<li>5. Refresca tu página https://xinu.me/~<span class="white">tuusuariomolón</span> en tu navegador y verás tu nuevo sitio web. </li>
|
||||
</ol>
|
||||
|
||||
<h3>Actualiza la vista de tu editor</h3>
|
||||
<p>
|
||||
Te pueden haber pillado con la guardia baja mientras editabas algún archivo y algún mensaje
|
||||
aleatorio de chat la ha liado con tu vista. No la ha liado realmente y tu página HTML no
|
||||
se ha editado pero necesitas refrescar la vista de tu editor.
|
||||
Para ello:
|
||||
<ol class="green">
|
||||
<li>1. <span class="white">CTRL+L</span> refrescará tu vista.</li>
|
||||
</ol>
|
||||
</p>
|
||||
|
||||
<h3>Charlar</h3>
|
||||
<p>
|
||||
Mientras estás en la línea de comandos puedes participar en el chat. Si hay algún chat o bien,
|
||||
si tienes alguna duda.
|
||||
</p>
|
||||
<ol class="green">
|
||||
<li>1. Teclea: <span class="white">wall</span> y pulsa "Entrar" para decirle a tu shell que
|
||||
estás listo para chatear.</li>
|
||||
<li>2. Teclea tu mensaje y pulsa "Entrar".</li>
|
||||
<li>3. Teclea <span class="white">CTRL+D</span> para enviar el mensaje o <span class="white">CTRL+C</span> si quieres cancelarlo.</li>
|
||||
<li>4. ¡Diviértete!</li>
|
||||
</ol>
|
||||
|
||||
<br><span class="green">100% compatible con Lynx. En serio.</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
/*
|
||||
var p = document.getElementById("content-node");
|
||||
var p_prime = p.cloneNode(true);
|
||||
document.body.appendChild(p_prime);
|
||||
*/
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue