index_productos_sobremi_contato_2.0

Schimizzi · Sep 4, 2023 · 95f411e · 95f411e
1 parent d833e3c
commit 95f411e
Show file tree

Hide file tree

Showing 6 changed files with 106 additions and 5 deletions.
diff --git a/css/style.css b/css/style.css
@@ -38,7 +38,23 @@ body {
 .img_carousel img {
     border-radius: 20px;
 }
+/* CONTATO */
+.sobre_mi {
+    color: #000;
+    padding: 5px 10%;
+    text-align: center;
+    font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
+    font-size: 1.5rem;
+    text-shadow: -2px -2px 0 #fafafa, 2px -2px 0 #fafafa, -2px 2px 0 #fafafa, 2px 2px 0 #fafafa;
+}
+.titulo_mi {
+    text-align: center;
+    text-shadow: -3px -3px 0 #fafafa, 3px -3px 0 #fafafa, -3px 3px 0 #fafafa, 3px 3px 0 #fafafa;
+}
 
-.formulario {
-
-}
+.fondo_body {
+    background-image: url("../img/fondo_sobremi.jpg"); 
+    background-size: cover; 
+    background-position: center; 
+    background-repeat: no-repeat; 
+}
diff --git a/html/contacto.html b/html/contacto.html
@@ -29,6 +29,9 @@
                     <li class="nav-item">
                         <a class="nav-link" href="productos.html">Productos</a>
                     </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="sobremi.html">Sobre Mi</a>
+                    </li>
                     <li class="nav-item">
                         <a class="nav-link" href="contacto.html">Contacto</a>
                     </li>
@@ -38,7 +41,7 @@
     </header>
 
     <!-- Formulario -->
-    <div class="container text-center">
+    <div class="container text-center pt-5">
         <div class="row align-items-center">
             <div class="col">
                 <form class="formulario">

diff --git a/html/productos.html b/html/productos.html
@@ -27,7 +27,10 @@
                         <a class="nav-link active" aria-current="page" href="../index.html">Inicio</a>
                     </li>
                     <li class="nav-item">
-                        <a class="nav-link" href="/html/productos.html">Productos</a>
+                        <a class="nav-link" href="productos.html">Productos</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="sobremi.html">Sobre Mi</a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link" href="contacto.html">Contacto</a>

diff --git a/html/sobremi.html b/html/sobremi.html
@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
+    <link rel="stylesheet" href="../css/style.css">
+    <title>Sobre mi</title>
+</head>
+
+<body class="fondo_body">
+    <!--Navbar bootstrap-->
+    <header class="navbar navbar-expand-lg bg-body-tertiary indexz">
+        <div class="container-fluid">
+            <a class="navbar-brand" href="index.html"><img class="logo_gracie" src="../img/logo_bat.png" alt="Gracie"></a>
+            <p class="titulo_gracie">Gracie Artesanías</p>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
+                aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <nav class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item">
+                        <a class="nav-link active" aria-current="page" href="../index.html">Inicio</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="productos.html">Productos</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="sobremi.html">Sobre Mi</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="contacto.html">Contacto</a>
+                    </li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+
+    <h1 class="titulo_mi">¡Hola a todos!</h1>
+    <p class="sobre_mi"> 
+
+        Hoy quiero hablarles un poco sobre mí, Graciela. Soy una mujer de 60 años que tiene una pasión ardiente por las
+        artesanías y las manualidades. Desde que tengo memoria, siempre he encontrado felicidad en crear cosas con mis
+        propias manos. Ya sea con cuero, pintando, o experimentando con diferentes materiales, la creatividad es mi vía
+        de escape. <br>
+
+        Pero no crean que soy una persona que se queda quieta. A pesar de mi edad, sigo siendo una trabajadora
+        incansable. Me gusta mantenerme ocupada, ya sea con proyectos en casa o en mi lugar de trabajo. La ética laboral
+        es algo que me inculcaron desde joven y lo llevo con orgullo a lo largo de mi vida. <br>
+
+        Pero no todo es trabajo y seriedad. Soy una persona divertida y siempre estoy dispuesta a sacar una sonrisa a
+        quienes me rodean. El sentido del humor es una parte importante de mi vida, y disfruto compartir chistes y
+        anécdotas graciosas. <br>
+
+        El entusiasmo es otra de mis características distintivas. Me emociono fácilmente por las cosas, grandes o
+        pequeñas. Puedo encontrar la belleza y la emoción en las situaciones más simples, y eso me llena de energía
+        positiva. <br>
+
+        Además de todo esto, soy madre de dos hijos maravillosos. Criar a mis hijos ha sido una de las experiencias más
+        gratificantes de mi vida. Siempre he tratado de ser una madre amorosa y dedicada, y estoy orgullosa de los
+        adultos increíbles en los que se han convertido. <br>
+
+        En resumen, soy una amante de las artesanías, una trabajadora incansable, una amiga divertida y entusiasta, y
+        una madre orgullosa. Mi vida está llena de color y creatividad, y me siento afortunada de poder compartirla con
+        todos ustedes. ¡Gracias por conocerme!</p>
+    <!--script bootstrap -->
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm"
+        crossorigin="anonymous"></script>
+
+</body>
+
+</html>
diff --git a/img/fondo_sobremi.jpg b/img/fondo_sobremi.jpg
diff --git a/index.html b/index.html
@@ -30,6 +30,9 @@
                     <li class="nav-item">
                         <a class="nav-link" href="html/productos.html">Productos</a>
                     </li>
+                    <li class="nav-item">
+                        <a class="nav-link" href="html/sobremi.html">Sobre Mi</a>
+                    </li>
                     <li class="nav-item">
                         <a class="nav-link" href="html/contacto.html">Contacto</a>
                     </li>