Estilos de botones de editar y borrar en la chismosa

This commit is contained in:
nat 2022-04-07 16:56:58 -03:00
parent 86d2c0e9f6
commit 53b998f1e5
4 changed files with 26 additions and 9 deletions

8
public/css/app.css vendored
View File

@ -6,3 +6,11 @@ p.navbar-item:empty {
color: #cc0f35; color: #cc0f35;
} }
.help {
font-size: 1rem;
}
table.table td {
vertical-align: middle;
}

24
public/js/chismosa.js vendored
View File

@ -1,14 +1,14 @@
Vue.component('chismosa', { Vue.component('chismosa', {
template: ` template: `
<div class="container"> <div class="container">
<table class="table is-fullwidth"> <table class="table is-fullwidth is-striped is-bordered">
<thead> <thead>
<tr> <tr>
<th><abbr title="Producto">Prod</abbr></th> <th><abbr title="Producto">Prod</abbr></th>
<th><abbr title="Cantidad">Cant</abbr></th> <th><abbr title="Cantidad">C</abbr></th>
<th><abbr title="Precio Total">$</abbr></th> <th><abbr title="Precio Total">$</abbr></th>
<th>Editar</th> <th></th>
<th><abbr title="Eliminar">X</abbr></th> <th><abbr title="Eliminar"></abbr></th>
</tr> </tr>
</thead> </thead>
<tfoot> <tfoot>
@ -69,14 +69,22 @@ Vue.component('chismosa', {
Vue.component('producto-row', { Vue.component('producto-row', {
template: ` template: `
<tr> <tr>
<th>{{ this.producto.nombre }}</th> <td>{{ this.producto.nombre }}</td>
<td>{{ this.producto.pivot.cantidad }}</td> <td>{{ this.producto.pivot.cantidad }}</td>
<td>{{ this.producto.pivot.total }}</td> <td>{{ this.producto.pivot.total }}</td>
<td>ACÁ VA BOTON PA EDITAR</td> <td><button class="button is-warning">
<td>ACÁ VA BOTON PA BORRAR</td> <span class="icon">
<i class="fas fa-edit"></i>
</span>
</button></td>
<td><button class="button is-danger">
<span class="icon">
<i class="fas fa-trash-alt"></i>
</span>
</button></td>
</tr> </tr>
`, `,
props: { props: {
producto: Object producto: Object
} }
}) })

View File

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{ config('app.name', 'Compras del MPS') }}</title> <title>{{ config('app.name', 'Compras del MPS') }}</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
</head> </head>
<body> <body>
<section class="section"> <section class="section">

View File

@ -10,7 +10,7 @@
<title>{{ session("subpedido_nombre") ? "Pedido de " . session("subpedido_nombre") . " - " . config('app.name', 'Compras del MPS') : config('app.name', 'Compras del MPS')}}</title> <title>{{ session("subpedido_nombre") ? "Pedido de " . session("subpedido_nombre") . " - " . config('app.name', 'Compras del MPS') : config('app.name', 'Compras del MPS')}}</title>
<!-- Fonts --> <!-- Fonts -->
<script src="https://kit.fontawesome.com/9235d1c676.js" crossorigin="anonymous"></script>
<!-- Styles --> <!-- Styles -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
<link rel="stylesheet" href="{{ asset('css/app.css') }}"> <link rel="stylesheet" href="{{ asset('css/app.css') }}">