carrusel, componenteLibros, componenteTitulo

imagenes falta
nav sin funcionamiento
2020-08-07 23:50:24 -05:00 · 2020-08-06 03:42:12 -05:00 · 2020-08-05 16:07:27 -05:00
20 changed files with 576 additions and 59 deletions
@@ -2456,9 +2456,9 @@
      "dev": true
    },
    "bootstrap": {
-      "version": "4.5.0",
-      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.0.tgz",
-      "integrity": "sha512-Z93QoXvodoVslA+PWNdk23Hze4RBYIkpb5h8I2HY2Tu2h7A0LpAgLcyrhrSUyo2/Oxm2l1fRZPs1e5hnxnliXA=="
+      "version": "4.5.2",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.5.2.tgz",
+      "integrity": "sha512-vlGn0bcySYl/iV+BGA544JkkZP5LB3jsmkeKLFQakCOwCM3AOk7VkldBz4jrzSe+Z0Ezn99NVXa1o45cQY4R6A=="
    },
    "brace-expansion": {
      "version": "1.1.11",
@@ -6459,6 +6459,11 @@
        }
      }
    },
+    "jquery": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.1.tgz",
+      "integrity": "sha512-XwIBPqcMn57FxfT+Go5pzySnm4KWkT1Tv7gjrpT1srtf8Weynl6R273VJ5GjkRb51IzMp5nbaPjJXMWeju2MKg=="
+    },
    "js-message": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.5.tgz",
@@ -7862,6 +7867,11 @@
        "ts-pnp": "^1.1.6"
      }
    },
+    "popper.js": {
+      "version": "1.16.1",
+      "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1.tgz",
+      "integrity": "sha512-Wb4p1J4zyFTbM+u6WuO4XstYx4Ky9Cewe4DWrel7B0w6VVICvPwdOpotjzcf6eD8TsckVnIMNONQyPIUFOUbCQ=="
+    },
    "portfinder": {
      "version": "1.0.28",
      "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz",
@@ -8,8 +8,10 @@
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
-    "bootstrap": "^4.5.0",
+    "bootstrap": "^4.5.2",
    "core-js": "^3.6.5",
+    "jquery": "^3.5.1",
+    "popper.js": "^1.16.1",
    "vue": "^2.6.11",
    "vue-router": "^3.3.4"
  },
@@ -1,17 +1,17 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title><%= htmlWebpackPlugin.options.title %></title>
-  </head>
-  <body>
-    <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width,initial-scale=1.0">
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+  </head>
+  <body>
+    <noscript>
+      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <!-- built files will be auto injected -->
+  </body>
+</html>
@@ -5,7 +5,6 @@
 </template>

 <script>
-
 export default {
  name: "App"
 };
@@ -0,0 +1,61 @@
+<template>
+  <div class="divMaster row my-5">
+    <div
+      id="carouselExampleControls"
+      class="carousel slide col-10 offset-1"
+      data-ride="carousel"
+    >
+      <div class="carousel-inner">
+        <div class="carousel-item active">
+          <img
+            src="https://www.unam.mx/sites/default/files/images/carrusel/bannermxok.jpg"
+            class="d-block w-100 img-fluid"
+            alt="img"
+          />
+        </div>
+        <div class="carousel-item">
+          <img
+            src="https://www.unam.mx/sites/default/files/images/carrusel/bannermxok.jpg"
+            class="d-block w-100 img-fluid"
+            alt="img"
+          />
+        </div>
+        <div class="carousel-item">
+          <img
+            src="https://www.unam.mx/sites/default/files/images/carrusel/bannermxok.jpg"
+            class="d-block w-100 img-fluid"
+            alt="img"
+          />
+        </div>
+      </div>
+      <a
+        class="carousel-control-prev"
+        href="#carouselExampleControls"
+        role="button"
+        data-slide="prev"
+      >
+        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+        <span class="sr-only">Previous</span>
+      </a>
+      <a
+        class="carousel-control-next"
+        href="#carouselExampleControls"
+        role="button"
+        data-slide="next"
+      >
+        <span class="carousel-control-next-icon" aria-hidden="true"></span>
+        <span class="sr-only">Next</span>
+      </a>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style scoped>
+.divMaster {
+  height: auto;
+}
+</style>
@@ -0,0 +1,130 @@
+<template>
+  <div class="divMaster row mb-5">
+    <div class="col-10 offset-1 d-flex flex-wrap justify-content-center">
+      <div
+        class="card m-3"
+        style="width: 12rem;"
+        v-bind:key="libro.id"
+        v-for="libro in Libros"
+      >
+        <router-link :to="{ path: 'home' }" class="textt">
+          <img :src="libro.img" class="card-img-top rounded" alt="libro" />
+          <div class="card-body cd textt">
+            <p class="card-text textt">
+              {{ libro.title }}
+            </p>
+          </div>
+        </router-link>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      Libros: [
+        {
+          id: 0,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 0,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        },
+        {
+          id: 1,
+          title:
+            "Some quick example text to build on the card title and make up the bulk of the cards content.",
+          img:
+            "https://edit.org/img/blog/xwdn-editar-portadas-de-libros-gratis.jpg.pagespeed.ic.PmNhyGc59r.jpg"
+        }
+      ]
+    };
+  }
+};
+</script>
+
+<style scoped>
+.divMaster {
+  height: auto;
+}
+.card {
+  border: none !important;
+  border-bottom: 5px solid #1b3d70 !important;
+}
+a {
+  text-decoration: none !important;
+  color: black;
+}
+</style>
@@ -0,0 +1,64 @@
+<template>
+  <div class="container">
+    <div class="row ">
+      <div class="col-md-6 col-sm-12 py-5">
+        <img v-bind:src="rutaIm" class="libro" />
+      </div>
+      <div class="col-md-6 col-sm-12 py-5 titulo">
+        <b>Titulo:</b>
+        <p>{{ titulo }}</p>
+        <b>Autor: </b>
+        <p>{{ autor }}</p>
+        <b>Paginas: </b>
+        <p>{{ paginas }}</p>
+        <b>ISBN: </b>
+        <p>{{ isbn }}</p>
+        <b>Año de Impresión: </b>
+        <p>{{ edicion }}</p>
+        <b>Precio: </b>
+        <p>{{ precio }}</p>
+
+        <b>Versión:</b>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      titulo: "Competitive programing",
+      autor: "HALIM",
+      paginas: "300",
+      isbn: "POSF-12-43",
+      edicion: "Primera edicion",
+      precio: "$3232.00",
+      rutaIm: `./${__dirname}src/assets/as.jpg`
+    };
+  }
+};
+</script>
+
+<style scoped>
+.titulo {
+  font-size: 1.3rem;
+  text-align: left;
+  color: balck;
+}
+
+.libro {
+  width: 360px;
+  height: 480px;
+  margin-right: auto;
+  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
+}
+@media (max-width: 450px) {
+  .libro {
+    width: 270px;
+    height: 380px;
+    margin-right: auto;
+    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.57);
+  }
+}
+</style>
@@ -1,7 +1,7 @@
 <template>
  <footer class="container-fluid Azul-puma footer py-3 ">
    <container>
-      <div row>
+      <div class="row">
        <button type="button" class="col-md-6 col-sm-12 btn boton-footer uno">
          Comité Editorial
        </button>
@@ -1,24 +0,0 @@
-<template>
-  <div>
-    <Header />
-    <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>
@@ -17,7 +17,7 @@
          v-on:click="toggle()"
        >
          <span
-            class=" navbar-toggler-icon x m-1"
+            class=" navbar-toggler-icon x m-1 text-white"
            style="color:white !important;"
          ></span>
          Menú
@@ -27,22 +27,22 @@
      <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 "
+            <router-link to="#" class="nav-item nav-link text-white "
              ><a> Inicio</a></router-link
            >
          </li>
          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link"
+            <router-link to="#" class="nav-item nav-link text-white"
              ><a>Presentacion</a></router-link
            >
          </li>
          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link"
+            <router-link to="#" class="nav-item nav-link text-white"
              ><a>Libros</a></router-link
            >
          </li>
          <li class="nav-item dropdown">
-            <router-link to="#" class="nav-item nav-link"
+            <router-link to="#" class="nav-item nav-link text-white"
              ><a>Difusión Editorial</a></router-link
            >
          </li>
@@ -0,0 +1,45 @@
+<template>
+  <div class="divMaster">
+    <div class="row">
+      <div class="col-10 offset-1 bor d-flex justify-content-center">
+        <div class="bgAzul">
+          <p class="text-white pTitulo">{{ title }}</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: ["title"]
+};
+</script>
+
+<style>
+.bor {
+  border: none !important;
+  border-bottom: 5px solid #1b3d70 !important;
+}
+.bgAzul {
+  background-color: #1b3d70;
+  width: 40%;
+
+  border-top-right-radius: 20px 20px !important;
+  border-top-left-radius: 20px 20px !important;
+}
+.pTitulo {
+  margin: 0;
+  font-size: 30px;
+}
+
+
+@media screen and (max-width: 400px) {
+  .pTitulo {
+    font-size: 20px;
+  }
+  .bgAzul {
+    width: 60%;
+  }
+}
+</style>
@@ -0,0 +1,168 @@
+<template>
+  <div class="divMaster doradoUnam row d-flex justify-content-center">
+    <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>
+          <span class="mx-2">Menu</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;
+  border-radius:  2rem;
+}
+
+.nav-link{
+  transition: 0.3s;
+}
+
+.dropdown-item{
+  padding: 1rem;
+}
+
+
+.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>
@@ -1,12 +1,13 @@
 import Vue from "vue";
 import App from "./App.vue";
-import "bootstrap/dist/css/bootstrap.css";
-
-Vue.config.productionTip = false;
+import "bootstrap";
+import "bootstrap/dist/css/bootstrap.min.css";

 import VueRouter from "vue-router";
 import { routes } from "./routes";

+Vue.config.productionTip = false;
+
 Vue.use(VueRouter);
 const router = new VueRouter({
  routes
@@ -1,6 +1,9 @@
-import Form from "./components/home.vue";
-import Login from "./components/login.vue";
+import home from "./view/home.vue";
+import login from "./view/login.vue";
+import libroDescripcion from "./view/libroDescripcion.vue";
+
 export const routes = [
-  { path: "/", component: Form, name: "form" },
-  { path: "/panelAdmin", component: Login, name: "Login" }
+  { path: "/", component: home, name: "form" },
+  { path: "/panelAdmin", component: login, name: "Login" },
+  { path: "/desc", component: libroDescripcion, name: "LibroDesc" }
 ];
@@ -0,0 +1,31 @@
+<template>
+  <div>
+    <Header />
+    <Nav />
+    <Carr />
+    <Title title="Recientes" />
+    <Cart />
+    <Footer />
+  </div>
+</template>
+
+<script>
+import Header from "./../components/header.vue";
+import Nav from "./../esteticas/nav.vue";
+import Footer from "./../components/footer.vue";
+import Carr from "../components/carrusel.vue";
+import Cart from "../components/cartLibro.vue";
+import Title from "../components/titulo.vue";
+
+export default {
+  name: "App",
+  components: {
+    Header,
+    Nav,
+    Footer,
+    Carr,
+    Cart,
+    Title
+  }
+};
+</script>
@@ -0,0 +1,27 @@
+<template>
+  <div>
+    <Header />
+    <Nav />
+
+    <p>descripcion</p>
+    <Descrip />
+    <Footer />
+  </div>
+</template>
+
+<script>
+import Header from "./../components/header.vue";
+import Nav from "./../components/navPrincipal.vue";
+import Descrip from "./../components/descripcion.vue";
+import Footer from "./../components/footer.vue";
+
+export default {
+  name: "App",
+  components: {
+    Header,
+    Nav,
+    Descrip,
+    Footer
+  }
+};
+</script>
Author	SHA1	Message	Date
eithan	7d2c85b7c0	carrusel, componenteLibros, componenteTitulo	2020-08-07 23:50:24 -05:00
danielGe	89b388821f	imagenes falta	2020-08-06 03:42:12 -05:00
eithan	660e8fd230	nav sin funcionamiento	2020-08-05 16:07:27 -05:00