Skip to content

Commit abc402c

Browse files
author
Daniel Hoyos Q
committed
🚀 más avances
1 parent c98c66d commit abc402c

File tree

12 files changed

+195
-43
lines changed

12 files changed

+195
-43
lines changed

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
"devDependencies": {
2020
"@vitejs/plugin-vue": "^4.1.0",
2121
"prettier": "^2.8.6",
22-
"sass": "^1.59.3",
22+
"sass": "^1.60.0",
2323
"vite": "^4.2.1"
2424
}
2525
}

‎recursos/scss/_constantes.scss

+1
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
--pergamino: #ebd78d;
1010
--tinta: #2b2d42;
1111
--hierro: #676768;
12+
--oro: #ffd700;
1213
--alma1: #00aaaa;
1314
--alma2: #cef8f5;
1415
--slime1: ;

‎src/Aplicacion.vue

+3
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,9 @@ function cambiarVista(nuevaVista) {
2828
html,
2929
body,
3030
h1,
31+
h2,
32+
h3,
33+
li,
3134
ul {
3235
margin: 0;
3336
padding: 0;

‎src/componentes/Inicio/Aventura.vue

+92-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,97 @@
11
<script setup></script>
22

33
<template>
4-
<img id="" src="/recursos/imagenes/Inicio.jpg" />
4+
<img id="fondoPrincipal" src="/recursos/imagenes/Inicio.jpg" />
5+
<div id="contenedorPrincipal">
6+
<div id="contenedorTitulo">
7+
<img id="tituloPrincipal" src="/recursos/imagenes/Boton4-0s.png" />
8+
<h2 id="textoTitulo">El Camino</h2>
9+
</div>
10+
<div id="contenedorBoton">
11+
<RouterLink to="/Transicion">
12+
<img id="botonInicio" src="/recursos/imagenes/Boton3-0s.png" />
13+
<span id="textoBoton"> Iniciar trayecto </span>
14+
</RouterLink>
15+
</div>
16+
</div>
517
</template>
618

7-
<style lang="scss" scoped></style>
19+
<style lang="scss" scoped>
20+
@import '../../../recursos/scss/constantes';
21+
22+
html,
23+
body,
24+
h1,
25+
h2,
26+
h3,
27+
div,
28+
span {
29+
padding: 0;
30+
margin: 0;
31+
}
32+
33+
#fondoPrincipal {
34+
z-index: -1;
35+
position: fixed;
36+
top: 0;
37+
left: 0;
38+
width: 100vw;
39+
height: 100vh;
40+
}
41+
42+
#contenedorPrincipal {
43+
display: flex;
44+
flex-direction: column;
45+
justify-content: center;
46+
align-items: center;
47+
}
48+
49+
#contenedorTitulo {
50+
position: relative;
51+
top: 1em;
52+
53+
:hover {
54+
#textoTitulo {
55+
color: #cef8f5;
56+
}
57+
}
58+
}
59+
60+
#tituloPrincipal {
61+
width: 45em;
62+
height: 15em;
63+
}
64+
#textoTitulo {
65+
font-family: 'Alquimia';
66+
font-size: 10em;
67+
position: absolute;
68+
top: 0.25em;
69+
left: 0.4em;
70+
color: #00aaaa;
71+
}
72+
73+
#contenedorBoton {
74+
position: relative;
75+
top: 0.5em;
76+
:hover {
77+
#textoBoton {
78+
color: #676768;
79+
}
80+
}
81+
}
82+
83+
#botonInicio {
84+
position: relative;
85+
width: 15em;
86+
height: 5em;
87+
}
88+
89+
#textoBoton {
90+
font-family: 'Alquimia';
91+
font-size: 2em;
92+
color: #2b2d42;
93+
position: absolute;
94+
top: 1em;
95+
left: 1em;
96+
}
97+
</style>

‎src/componentes/MenuPrincipal/Menu.vue

+13-7
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,12 @@ defineProps({
77

88
<template>
99
<div id="contenedor">
10-
<div id="contenedorTitulo">
11-
<h1 id="titulo">El Camino</h1>
12-
<img id="imagenTitulo" src="/recursos/imagenes/Boton1-0s.png" />
13-
</div>
10+
<RouterLink to="/">
11+
<div id="contenedorTitulo">
12+
<h2 id="titulo">El Camino</h2>
13+
<img id="imagenTitulo" src="/recursos/imagenes/Boton1-0s.png" />
14+
</div>
15+
</RouterLink>
1416
<img id="fondo" src="/recursos/imagenes/Menu.png" />
1517
<ul id="menu">
1618
<!--<li class="botones" @click="cambiarVista('Aventura')">
@@ -78,8 +80,12 @@ ul {
7880
left: 0.2em;
7981
font-family: 'Alquimia';
8082
font-size: 2.5vw;
81-
color: var(--tinta);
83+
color: #2b2d42;
8284
z-index: 3;
85+
86+
:visited {
87+
color: #2b2d42;
88+
}
8389
}
8490
#imagenTitulo {
8591
width: 10.5vw;
@@ -89,7 +95,7 @@ ul {
8995
9096
.botones {
9197
font-family: 'Alquimia';
92-
color: var(--tinta);
98+
color: #2b2d42;
9399
padding: 0;
94100
border: none;
95101
background: none;
@@ -106,7 +112,7 @@ ul {
106112
cursor: pointer;
107113
108114
li {
109-
color: var(--tinta);
115+
color: #2b2d42;
110116
111117
&:hover {
112118
span {

‎src/componentes/MenuPrincipal/Principal.vue

+7-7
Original file line numberDiff line numberDiff line change
@@ -55,9 +55,9 @@ defineProps({
5555
}
5656
}
5757
#contenedorPrincipal {
58-
margin-left: 30vw;
59-
width: 70vw;
60-
height: 100vh;
58+
margin-left: 40em;
59+
width: 70em;
60+
height: 70em;
6161
display: flex;
6262
position: absolute;
6363
top: 0;
@@ -88,14 +88,14 @@ defineProps({
8888
}
8989
9090
#imagenTitulo {
91-
width: 18vw;
92-
height: 12vh;
91+
width: 20em;
92+
height: 7.5em;
9393
9494
&.Portafolio {
95-
width: 20vw;
95+
width: 25em;
9696
}
9797
&.Alma {
98-
width: 20vw;
98+
width: 25em;
9999
}
100100
}
101101

‎src/componentes/MenuPrincipal/Vistas/Creditos.vue

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script setup></script>
22

33
<template>
4-
<div id="miAlma">
5-
<h2 id="elFuturo">El Futuro Digital</h2>
6-
<span id="laTecnologia"> </span>
4+
<div id="milyun">
5+
<h2 id="graciasEternas">Agradecimientos</h2>
6+
<span id="todosAyudaron"> </span>
77
<img id="contenedorTexto" src="/recursos/imagenes/Test.png" />
88
</div>
99
</template>

‎src/componentes/MenuPrincipal/Vistas/SobreMI.vue

+14-14
Original file line numberDiff line numberDiff line change
@@ -29,46 +29,46 @@
2929
align-items: center;
3030
}
3131
#cuadro {
32-
margin-top: 5vh;
32+
margin-top: 2.5em;
3333
display: block;
3434
border-style: groove;
3535
border-color: #ebd78d;
36-
width: 15vw;
37-
height: 15vw;
38-
border: 15px groove #ebd78d;
36+
width: 17.5em;
37+
height: 17.5em;
38+
border: 1em groove #ebd78d;
3939
}
4040
#avatar {
41-
width: 15vw;
42-
height: 15vw;
41+
width: 17.5em;
42+
height: 17.5em;
4343
border-style: ridge;
4444
border-color: #ebd78d;
4545
border: 1em;
4646
}
4747
4848
#miHistoria {
49-
margin-top: 5vh;
50-
width: 50vw;
49+
margin-top: 2.5em;
50+
width: 70em;
5151
position: relative;
5252
}
5353
#losCopitos {
5454
font-family: 'Alquimia';
55-
font-size: 4em;
55+
font-size: 5em;
5656
color: #cef8f5;
5757
position: absolute;
58-
top: 0;
59-
left: 2.2em;
58+
top: 0.2;
59+
left: 2em;
6060
}
6161
6262
#lasOrejitas {
6363
font-family: 'kiwi';
6464
font-size: 2em;
6565
position: absolute;
66-
top: 2.5em;
66+
top: 3em;
6767
}
6868
6969
#contenedorTexto {
70-
width: 55vw;
71-
height: 70vh;
70+
width: 75em;
71+
height: 50em;
7272
margin-left: -2em;
7373
}
7474
</style>

‎src/vistas/Inicio.vue

+7-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import Aventura from '../componentes/Inicio/Aventura.vue';
44

55
<template>
66
<div class="inicio">
7-
<h1 class="cabeza">Inicio de el camino</h1>
7+
<h1 class="cabeza">Inicio de el camino...</h1>
88
<Aventura />
99
</div>
1010
</template>
@@ -13,5 +13,11 @@ import Aventura from '../componentes/Inicio/Aventura.vue';
1313
@import '../../recursos/scss/constantes';
1414
1515
.cabeza {
16+
font-family: 'Alquimia';
17+
color: #cef8f5;
18+
position: absolute;
19+
bottom: 0;
20+
right: 1em;
21+
opacity: 50%;
1622
}
1723
</style>

‎src/vistas/MenuPrincipal.vue

+15-1
Original file line numberDiff line numberDiff line change
@@ -4,12 +4,17 @@ import Menu from '../componentes/MenuPrincipal/Menu.vue';
44
import Principal from '../componentes/MenuPrincipal/Principal.vue';
55
import GuardaEscobas from '../componentes/GuardaEscobas.vue';
66
7+
function cambiarVista(nuevaVista) {
8+
//console.log(nuevaVista);
9+
vista.value = nuevaVista;
10+
}
11+
712
const vista = ref('Sobre Mi');
813
</script>
914

1015
<template>
1116
<div class="MenuPrincipal">
12-
<h1>El Camino se divide...</h1>
17+
<!--<h1 class="cabeza">El Camino se divide...</h1>-->
1318
<Menu :cambiarVista="cambiarVista" />
1419
<Principal :vista="vista" />
1520
<GuardaEscobas />
@@ -18,4 +23,13 @@ const vista = ref('Sobre Mi');
1823

1924
<style lang="scss" scoped>
2025
@import '../../recursos/scss/constantes';
26+
27+
.cabeza {
28+
font-family: 'Alquimia';
29+
color: #cef8f5;
30+
position: absolute;
31+
bottom: 0;
32+
right: 0em;
33+
opacity: 50%;
34+
}
2135
</style>

‎src/vistas/Transicion.vue

+35-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,43 @@
1-
<script setup></script>
1+
<script setup>
2+
import Escena from '../componentes/Transición/Escena.vue';
3+
</script>
24

35
<template>
4-
<div class="Transicion">
5-
<h1>El camino sigue...</h1>
6+
<div class="transicion">
7+
<h1 class="cabeza">El camino sigue...</h1>
8+
<RouterLink to="/menu-principal">
9+
<img id="botonContinuar" src="/recursos/imagenes/Boton2-0s.png" />
10+
<span id="textoBoton"> Adentrarse </span>
11+
</RouterLink>
612
</div>
13+
<Escena />
714
</template>
815

916
<style lang="scss" scoped>
1017
@import '../../recursos/scss/constantes';
18+
19+
.transicion {
20+
background-color: #2b2d42;
21+
position: absolute;
22+
width: 100vw;
23+
height: 100vh;
24+
}
25+
26+
.cabeza {
27+
font-family: 'Alquimia';
28+
color: #cef8f5;
29+
position: absolute;
30+
bottom: 0;
31+
right: 1em;
32+
opacity: 50%;
33+
}
34+
35+
#textoBoton {
36+
font-family: 'Alquimia';
37+
font-size: 3em;
38+
color: #cef8f5;
39+
position: absolute;
40+
top: 0.75em;
41+
left: 0.25em;
42+
}
1143
</style>

‎yarn.lock

+4-4
Original file line numberDiff line numberDiff line change
@@ -440,10 +440,10 @@ rollup@^3.18.0:
440440
optionalDependencies:
441441
fsevents "~2.3.2"
442442

443-
sass@^1.59.3:
444-
version "1.59.3"
445-
resolved "https://registry.yarnpkg.com/sass/-/sass-1.59.3.tgz#a1ddf855d75c70c26b4555df4403e1bbf8e4403f"
446-
integrity sha512-QCq98N3hX1jfTCoUAsF3eyGuXLsY7BCnCEg9qAact94Yc21npG2/mVOqoDvE0fCbWDqiM4WlcJQla0gWG2YlxQ==
443+
sass@^1.60.0:
444+
version "1.60.0"
445+
resolved "https://registry.yarnpkg.com/sass/-/sass-1.60.0.tgz#657f0c23a302ac494b09a5ba8497b739fb5b5a81"
446+
integrity sha512-updbwW6fNb5gGm8qMXzVO7V4sWf7LMXnMly/JEyfbfERbVH46Fn6q02BX7/eHTdKpE7d+oTkMMQpFWNUMfFbgQ==
447447
dependencies:
448448
chokidar ">=3.0.0 <4.0.0"
449449
immutable "^4.0.0"

0 commit comments

Comments
 (0)