act

public/index.html

@@ -13,5 +13,8 @@
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->
+    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.1/js/bootstrap.min.js" integrity="sha384-XEerZL0cuoUbHE4nZReLT7nx9gQrQreJekYhJD9WNWhH8nEW+0c5qq7aIo2Wl30J" crossorigin="anonymous"></script>
   </body>
 </html>

src/App.vue

@@ -1,30 +1,41 @@
-<template>
+<template>
-  <div id="app">
+  <div id="app">
-    <router-view></router-view>
+    <Header />
-  </div>
+    <Nav />
-</template>
+    <router-view></router-view>
-
+    <Footer />
-<script>
+  </div>
-
+</template>
-export default {
+
-  name: "App"
+<script>
-};
+import Header from "./esteticas/header.vue";
-</script>
+import Footer from "./esteticas/footer.vue";
-
+import Nav from "./esteticas/nav.vue";
-<style>
+
-#app {
+export default {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
+  name: "App",
-  -webkit-font-smoothing: antialiased;
+  components: {
-  -moz-osx-font-smoothing: grayscale;
+    Header,
-  text-align: center;
+    Footer,
-  color: #2c3e50;
+    Nav
-  margin-top: 60px;
+  }
-
+};
-  padding: 0;
+</script>
-  margin: 0;
+
-}
+<style>
-
+#app {
-.row {
+  font-family: Avenir, Helvetica, Arial, sans-serif;
-  margin: 0 !important;
+  -webkit-font-smoothing: antialiased;
-}
+  -moz-osx-font-smoothing: grayscale;
-</style>
+  text-align: center;
+  color: #2c3e50;
+  margin-top: 60px;
+
+  padding: 0;
+  margin: 0;
+}
+
+.row {
+  margin: 0 !important;
+}
+</style>

src/components/home.vue

@@ -1,24 +1,5 @@
 <template>
   <div>
-    <Header />
+    <h1>esta es la pagina home</h1>
-    <Nav />
-    <router-view></router-view>
-    <Footer />
   </div>
 </template>
-
-<script>
-import Header from "./../esteticas/header.vue";
-import Nav from "./../esteticas/navPrincipal.vue";
-import Footer from "./../esteticas/footer.vue";
-
-export default {
-  name: "App",
-  components: {
-    Header,
-    Nav,
-    
-    Footer
-  }
-};
-</script>

src/esteticas/footer.vue

@@ -87,3 +87,4 @@ export default {};
   }
 }
 </style>
+>>>>>>> pruebas

src/esteticas/header.vue

@@ -36,14 +36,13 @@
   </container>
 </template>
 
-<style>
+<style >
 .divMaster {
-  height: 7em;
-  margin: 0 auto;
-}
 
-.azulUnam {
+  height: 7em;
-  background-color: #1e3c70;
+/* max-width: 1280px; */
+  height: 7em;
+color: #1e3c70;
 }
 .sizeImg {
   height: 5rem;
@@ -62,6 +61,4 @@
   }
   .logo_acatlan_resp a img {
     height: 5rem;
-  }
+e>
-}
-</style>

src/esteticas/nav.vue

@@ -0,0 +1,156 @@
+<template>
+  <div class="divMaster doradoUnam row">
+    <div class="col-10 offset-1">
+      <nav class="navbar navbar-expand-sm navbar-light  ">
+        <button
+          class="navbar-toggler"
+          type="button"
+          data-toggle="collapse"
+          data-target="#navbarTogglerDemo02"
+          aria-controls="navbarTogglerDemo02"
+          aria-expanded="false"
+          aria-label="Toggle navigation"
+        >
+          <span class="navbar-toggler-icon blanco"></span>
+        </button>
+
+        <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
+          <ul class="navbar-nav mr-auto  mt-0 mt-lg-0">
+            <li class="nav-item">
+              <a class="nav-link text-white" href="#">Inicio</a>
+            </li>
+            <li class="nav-item">
+              <a class="nav-link text-white" href="#">Presentacion</a>
+            </li>
+            <li class="nav-item ">
+              <a
+                class="nav-link dropdown-toggle text-white "
+                id="navbarDropdown"
+                role="button"
+                data-toggle="dropdown"
+                aria-haspopup="true"
+                aria-expanded="false"
+                href="#"
+                >Libros</a
+              >
+              <div
+                class="dropdown-menu azulUnam"
+                aria-labelledby="navbarDropdown"
+              >
+                <a class="dropdown-item text-white" href="#"
+                  >Ciencias Socioeconomicas</a
+                >
+                <div class="dropdown-divider"></div>
+                <a class="dropdown-item text-white" href="#"
+                  >Diseño y Edificacion</a
+                >
+                <div class="dropdown-divider"></div>
+                <a class="dropdown-item text-white" href="#"
+                  >Enseñanza de Idiomas</a
+                >
+                <div class="dropdown-divider"></div>
+                <a class="dropdown-item text-white" href="#"
+                  >Estudios de Posgrado</a
+                >
+                <div class="dropdown-divider"></div>
+                <a class="dropdown-item text-white" href="#">Humanidades</a>
+                <div class="dropdown-divider"></div>
+                <a class="dropdown-item text-white" href="#"
+                  >Matematicas e Ingenieria</a
+                >
+              </div>
+            </li>
+            <li class="nav-item">
+              <a class="nav-link text-white" href="#">Difusion Editorial</a>
+            </li>
+          </ul>
+          <form class="form-inline  my-0 my-lg-0">
+            <div class="input-group input-group-sm mb-0">
+              <input
+                type="text"
+                class="form-control reIzq "
+                placeholder="Buscar"
+                aria-label="Recipient's username"
+                aria-describedby="basic-addon2"
+              />
+              <div class="input-group-append reDer bg-white">
+                <button class="btn  my-0" type="submit">
+                  <svg
+                    width="1em"
+                    height="1em"
+                    viewBox="0 0 16 16"
+                    class="bi bi-search"
+                    fill="currentColor"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      fill-rule="evenodd"
+                      d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
+                    />
+                    <path
+                      fill-rule="evenodd"
+                      d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </form>
+        </div>
+      </nav>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+* {
+  margin: 0;
+  padding: 0;
+}
+
+.divMaster {
+  /* max-width: 1280px; */
+  height: auto;
+  margin: 0 auto;
+}
+nav {
+  padding: 0.5rem 0;
+}
+
+.azulUnam {
+  background-color: #1e3c70;
+}
+.doradoUnam {
+  background-color: #bb8800;
+}
+.blanco {
+  color: white !important;
+}
+
+.dropdown-item:hover {
+  background-color: #bb8800;
+}
+.nav-link:focus {
+  background-color: #1e3c70;
+}
+
+.menuText {
+  display: none;
+}
+
+.reDer {
+  border-top-right-radius: 20px 20px !important;
+  border-bottom-right-radius: 20px 20px !important;
+}
+
+.reIzq {
+  border-top-left-radius: 20px 20px !important;
+  border-bottom-left-radius: 20px 20px !important;
+}
+
+@media (max-width: 450px) {
+  .menuText {
+    display: block;
+  }
+}
+</style>

src/esteticas/navPrincipal.vue

@@ -1,174 +0,0 @@
-<template>
-  <nav
-    class="navbar navbar-expand-md navbar-light "
-    style="background-color:#BB8800;"
-  >
-    <div class="container">
-      <nav class=" ">
-        <button
-          class=" navbar-toggler van text-whitee btn-sm"
-          type="button"
-          id="toggle-menu"
-          data-toggle="collapse"
-          data-target="#navbarNav"
-          aria-controls="navbarNav"
-          aria-expanded="false"
-          aria-label="Toggle navigation"
-          v-on:click="toggle()"
-        >
-          <span
-            class=" navbar-toggler-icon x m-1"
-            style="color:white !important;"
-          ></span>
-          Menú
-        </button>
-      </nav>
-
-      <div class="collapse navbar-collapse" id="navbarNav">
-        <ul class="navbar-nav mr-auto  mt-0 mt-lg-0">
-          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link "
-              ><a> Inicio</a></router-link
-            >
-          </li>
-          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link"
-              ><a>Presentacion</a></router-link
-            >
-          </li>
-          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link"
-              ><a>Libros</a></router-link
-            >
-          </li>
-          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link"
-              ><a>Difusión Editorial</a></router-link
-            >
-          </li>
-        </ul>
-        <form class="form-inline  my-0 my-lg-0">
-          <div class="input-group input-group-sm mb-0">
-            <input
-              type="text"
-              class="form-control reIzq "
-              placeholder="Buscar"
-              aria-label="Recipient's username"
-              aria-describedby="basic-addon2"
-            />
-            <div class="input-group-append reDer bg-white">
-              <button class="btn  my-0" type="submit">
-                <svg
-                  width="1em"
-                  height="1em"
-                  viewBox="0 0 16 16"
-                  class="bi bi-search"
-                  fill="currentColor"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    fill-rule="evenodd"
-                    d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
-                  />
-                  <path
-                    fill-rule="evenodd"
-                    d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
-                  />
-                </svg>
-              </button>
-            </div>
-          </div>
-        </form>
-      </div>
-    </div>
-  </nav>
-</template>
-
-<script>
-export default {
-  methods: {
-    toggle: function() {
-      let element = document.getElementById("navbarNav");
-      element.classList.toggle("block");
-      element.classList.add("mystyle");
-    }
-  }
-};
-</script>
-
-<style scoped>
-.reDer {
-  border-top-right-radius: 20px 20px !important;
-  border-bottom-right-radius: 20px 20px !important;
-}
-.reIzq {
-  border-top-left-radius: 20px 20px !important;
-  border-bottom-left-radius: 20px 20px !important;
-}
-body {
-  overflow-x: hidden;
-}
-.mystyle {
-  text-align: left;
-}
-
-.block {
-  display: block;
-}
-a {
-  max-height: 100%;
-}
-.menu {
-  background-color: #bb8800;
-}
-
-.menu nav ul {
-  display: flex;
-  justify-content: space-between;
-  margin: 0 0rem;
-}
-
-.menu nav ul div {
-  display: flex;
-  justify-content: space-between;
-}
-
-.menu nav ul li {
-  list-style: none;
-}
-
-.menu nav ul li a {
-  display: block;
-}
-
-a {
-  color: white;
-  transition: 0.5s;
-  padding-left: 0.3rem;
-  padding-right: 0.3rem;
-}
-
-a:hover {
-  background-color: #1e3c70;
-  color: white;
-}
-
-.active {
-  background-color: #936900;
-}
-
-.van {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.x {
-  color: white;
-}
-
-@media (min-width: 768px) {
-  .van {
-    display: none;
-  }
-}
-</style>