but hey, it's pure CSS magic.
-->
<ul id="menu">
- <a href="/index"><li>Salud</li></a>
+ <a href="/"><li>Salud</li></a>
<a href="/topology"><li>Visualizador</li></a>
<a href="/stats"><li>Estadisticas</li></a>
<a href="/starter"><li>Inicializador</li></a>
<a href="/access"><li>Acceso</li></a>
<a href="/topologyMaker"><li>Crear topologia</li></a>
- <a href="https://localhost:8080/" target="_blank"><li>Pagina local</li></a>
+ <a style= "display: flex;" href="https://localhost:8080/" target="_blank"><li>Pagina local</li> <img id="ctl00_XXX" src="https://upload.wikimedia.org/wikipedia/commons/4/44/Icon_External_Link.svg" style="width:0.8em; height:0.8em; border-width:0px;" /></a>
</ul>
</div>
<form class="form-inline">
} = require('express');
const router = new Router();
-let alumnos = [];
+//renders de las paginas web
router.get("/", (req, res) => {
- res.render("index", {
- alumnos
- })
+ res.render("index")
});
-router.get("/flex", (req, res) => {
- res.render("flex")
+router.get("/access", (req, res) => {
+ res.render("access")
});
+router.get("/starter", (req, res) => {
+ res.render("starter")
+});
+
+router.get("/stats", (req, res) => {
+ res.render("stats")
+});
+router.get("/topology", (req, res) => {
+ res.render("topology")
+});
+
+router.get("/topologyMaker", (req, res) => {
+ res.render("topologyMaker")
+});
+//en lo adelante se encuentran las peticiones de datos
router.get('/free', (req, res) => {
var sys = require('sys')
var exec = require('child_process').exec;
+++ /dev/null
-<!DOCTYPE html>
-<html>
-
-<head>
- <title>Oscar Rodriguez</title>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <style>
- * {
- box-sizing: border-box;
- }
-
- /* Style the body */
- body {
- font-family: Helvetica;
- margin: 0;
- padding: 0;
- }
-
- /* Header/logo Title */
- .header {
- position: relative;
- width: 100;
- height: 50vh;
- justify-content: center;
- align-items: center;
- overflow: hidden;
- padding: 60px;
- text-align: center;
- color: white;
-
- }
-
- .header::before {
- content: '';
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 90%;
- background: linear-gradient(45deg, #ff0081, #1abc9c);
- border-radius: 0 0 70% 70%/0 0 80% 80%;
-
- }
-
- .header::after {
- content: '';
- position: absolute;
- top: 10px;
- left: 10px;
- width: 100%;
- height: 90%;
- z-index: -1;
- background: linear-gradient(45deg, #ff8156, #1abc9c);
- border-radius: 0 0 70% 70%/0 0 80% 80%;
- }
-
- .header h1,
- .header img {
- position: relative;
- z-index: 1;
- margin: 0;
- max-width: 50rem;
- text-align: center;
- padding: 0;
- }
-
- .header img {
- margin-top: -1em;
- width: 20vmax;
- clip-path: circle(40% at 50% 50%);
-
-
- }
-
- /* Style the top navigation bar */
- .navbar {
- display: flex;
- background-color: #333;
- }
-
- /* Style the navigation bar links */
- .navbar a {
- color: white;
- padding: 14px 20px;
- text-decoration: none;
- text-align: center;
- }
-
- /* Change color on hover */
- .navbar a:hover {
- background-color: #ddd;
- color: black;
- }
-
- /* Column container */
- .row {
- display: flex;
- flex-wrap: wrap;
- }
-
- /* Create two unequal columns that sits next to each other */
- /* Sidebar/left column */
- .side {
- flex: 30%;
- background-color: #f1f1f1;
- padding: 1.4em;
- }
-
- /* Main column */
- .main {
- flex: 70%;
- background-color: #deffde;
- padding: 1.2em;
- }
-
- /* Fake image, just for this example */
- .fakeimg {
- background-color: #aaa;
- width: 100%;
- padding: 1.2em;
- }
-
- /* Footer */
- .footer {
- padding: 20px;
- text-align: center;
- background:
- linear-gradient(45deg, rgba(50, 70, 40, 0.9) 40%, rgba(0, 0, 0, 0)0%, rgba(20, 57, 90, 1) 60%, rgba(0, 0, 0, 0)0%);
- }
-
- /* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
- @media screen and (max-width: 700px) {
-
- .row,
- .navbar {
- flex-direction: column;
- }
-
- }
- </style>
-</head>
-
-<body>
- <!-- Navigation Bar -->
- <div class="navbar">
- <a href="#">Link</a>
- <a href="#">Link</a>
- <a href="#">Link</a>
- <a href="#">Link</a>
- </div>
-
- <!-- Header -->
- <div class="header">
- <h1>Oscar J. Rodriguez B.</h1>
- <img
- src="https://scontent-lhr3-1.cdninstagram.com/v/t51.2885-15/e35/57262952_386137918906120_2475495091722910682_n.jpg?_nc_ht=scontent-lhr3-1.cdninstagram.com&se=7&oh=7e906d85b42ba3e63cae32ede44d2361&oe=5DF78AC7&ig_cache_key=MjAyNTAyODcyODQ5Nzk3MTY2Mg%3D%3D.2"
- alt="">
- </div>
-
- <!-- The flexible grid (content) -->
- <div class="row">
- <div class="side">
- <h2>About Me</h2>
- <h5>Photo of me:</h5>
- <div class="fakeimg" style="height:200px;">Image</div>
- <p>Some text about me in culpa qui officia deserunt mollit anim..</p>
- <h3>More Text</h3>
- <p>Lorem ipsum dolor sit ame.</p>
- <div class="fakeimg" style="height:60px;">Image</div><br>
- <div class="fakeimg" style="height:60px;">Image</div><br>
- <div class="fakeimg" style="height:60px;">Image</div>
- </div>
- <div class="main">
- <h2>TITLE HEADING</h2>
- <h5>Title description, Dec 7, 2017</h5>
- <div class="fakeimg" style="height:200px;">Image</div>
- <p>Some text..</p>
- <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
- <br>
- <h2>TITLE HEADING</h2>
- <h5>Title description, Sep 2, 2017</h5>
- <div class="fakeimg" style="height:200px;">Image</div>
- <p>Some text..</p>
- <p>Sunt in culpa qui officia deserunt mollit anim id est laborum consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco.</p>
- </div>
- </div>
-
- <!-- Footer -->
- <div class="footer">
- <h2>Footer</h2>
- </div>
-
-</body>
-
-</html>
\ No newline at end of file