ProVM/totalsport
3
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Afinaciones

Browse Source
This commit is contained in:
Aldarien
2020-04-10 14:39:18 -04:00
parent 692c001cd5
commit a1311ee250
14 changed files with 150 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
bootstrap/web/config.php
View File

@ -61,7 +61,8 @@ return [
'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/icons.woff2', 'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/icons.woff2',
'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/outline-icons.woff', 'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/outline-icons.woff',
'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/outline-icons.woff2', 'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/outline-icons.woff2',
'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;900&display=swap' 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;900&display=swap',
'https://fonts.googleapis.com/css2?family=Raleway:wght@800&display=swap'
] ]
] ]
] ]

12
common/Controller/Web/Home.php
View File

@ -20,7 +20,7 @@ class Home {
]; ];
$clientes = []; $clientes = [];
for ($i = 0; $i < 20; $i ++) { for ($i = 0; $i < 20; $i ++) {
$clientes[$i] = '<div class="ui fluid placeholder"><div class="rectangular image"></div>' . $i . '</div>'; $clientes[$i] = '<div class="ui fluid placeholder"><div class="circular image"></div>' . $i . '</div>';
} }
$testimonios = $this->loadData($container, 'testimonios'); $testimonios = $this->loadData($container, 'testimonios');
@ -29,13 +29,11 @@ class Home {
if (!isset($evento->image)) { if (!isset($evento->image)) {
$evento->image = '<div class="ui fluid placeholder"><div class="rectangular image"></div></div>'; $evento->image = '<div class="ui fluid placeholder"><div class="rectangular image"></div></div>';
} }
if (!isset($evento->servicio)) {
$evento->servicio = mt_rand(0, count($servicios) - 1);
}
} }
/*$eventos = [
(object) [
'titulo' => '2da Corrida Famliar Inclusiva DIMERC',
'image' => '<div class="ui fluid placeholder"><div class="rectangular image"></div></div>'
]
];*/
return $view->render($response, 'home', compact('banner', 'servicios', 'frase', 'clientes', 'testimonios', 'eventos')); return $view->render($response, 'home', compact('banner', 'servicios', 'frase', 'clientes', 'testimonios', 'eventos'));
} }

9
public/assets/styles/header.css
View File

@ -1,9 +0,0 @@
#page_logo {
font-family: Raleway, sans-serif;
font-weight: 800;
font-size: 2.2rem;
color: #404041;
}
#page_logo .orange {
color: #F26721;
}

6
public/assets/styles/home.css
View File

@ -41,9 +41,9 @@
#clientes .header:first-child { #clientes .header:first-child {
padding-bottom: 1rem; padding-bottom: 1rem;
} }
#clientes .ci { #clientes #img_clientes .row {
display: flex; padding-top: 0;
align-items: center padding-bottom: 0;
} }
#testimonios { #testimonios {

12
public/assets/styles/main.css
View File

@ -2,6 +2,16 @@ body, .ui {
font-family: Roboto, sans-serif !important; font-family: Roboto, sans-serif !important;
} }
#page_logo {
font-family: Raleway, sans-serif;
font-weight: 800;
font-size: 2.2rem;
color: #404041;
}
#page_logo .orange {
color: #F26721;
}
footer { footer {
flex: none; flex: none;
color: white; color: white;
@ -9,7 +19,7 @@ footer {
font-family: Roboto; font-family: Roboto;
} }
footer .dark-grey { footer .dark-grey {
background-color: grey; background-color: #404041;
} }
footer .grid { footer .grid {
margin: 0 !important; margin: 0 !important;

66
resources/views/home/clientes.blade.php
View File

@ -3,29 +3,33 @@
CLIENTES CLIENTES
</div> </div>
<div class="ui grid"> <div class="ui grid">
<div class="column ci"> <div class="two column row">
<i class="left chevron big icon" id="left_arrow"></i> <div class="left alined column ci">
</div> <i class="left chevron big icon" id="left_arrow"></i>
<div class="fourteen wide column"> </div>
<div class="ui center aligned stackable grid" id="img_clientes"> <div class="right aligned column ci">
<div class="row"> <i class="right chevron big icon" id="right_arrow"></i>
@for ($i = 0; $i < min(10, count($clientes)); $i += 2)
<div class="three wide column">
{!!$clientes[$i]!!}
</div>
@endfor
</div>
<div class="row">
@for ($i = 1; $i < min(10, count($clientes)); $i += 2)
<div class="three wide column">
{!!$clientes[$i]!!}
</div>
@endfor
</div>
</div> </div>
</div> </div>
<div class="column ci"> <div class="one column row">
<i class="right chevron big icon" id="right_arrow"></i> <div class="column">
<div class="ui center aligned grid" id="img_clientes">
<div class="row">
@for ($i = 0; $i < min(12, count($clientes)); $i += 2)
<div class="five wide tablet two wide computer column">
{!!$clientes[$i]!!}
</div>
@endfor
</div>
<div class="row">
@for ($i = 1; $i < min(12, count($clientes)); $i += 2)
<div class="five wide tablet two wide computer column">
{!!$clientes[$i]!!}
</div>
@endfor
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -38,34 +42,36 @@
@endforeach @endforeach
] ]
var current = 0 var current = 0
var rows = 2
var cols = 6
function decreaseClientes() { function decreaseClientes() {
$('#img_clientes').find('.row').find('.column:last-child').remove() $('#img_clientes').find('.row').find('.column:last-child').remove()
current -= 2 current -= rows
if (current < -8) { if (current < - cols * rows) {
current = clientes.length - 10 current = clientes.length - (cols - 1) * rows
} }
n = current n = current
if (n < 0) { if (n < 0) {
n = clientes.length + n n = clientes.length + n
} }
$('#img_clientes').find('.row:first-child').prepend( $('#img_clientes').find('.row:first-child').prepend(
$('<div></div>').attr('class', 'three wide column').append(clientes[n]) $('<div></div>').attr('class', 'five wide tablet two wide computer column').append(clientes[n])
) )
$('#img_clientes').find('.row:last-child').prepend( $('#img_clientes').find('.row:last-child').prepend(
$('<div></div>').attr('class', 'three wide column').append(clientes[n + 1]) $('<div></div>').attr('class', 'five wide tablet two wide computer column').append(clientes[n + 1])
) )
} }
function increaseClientes() { function increaseClientes() {
$('#img_clientes').find('.row').find('.column:first-child').remove() $('#img_clientes').find('.row').find('.column:first-child').remove()
current += 2 current += 2
if (current > clientes.length - 10) { if (current > clientes.length - cols * rows) {
current = -8 current = - (cols - 1) * rows
} }
$('#img_clientes').find('.row:first-child').append( $('#img_clientes').find('.row:first-child').append(
$('<div></div>').attr('class', 'three wide column').append(clientes[current + 8]) $('<div></div>').attr('class', 'five wide tablet two wide computer column').append(clientes[current + (cols - 1) * rows])
) )
$('#img_clientes').find('.row:last-child').append( $('#img_clientes').find('.row:last-child').append(
$('<div></div>').attr('class', 'three wide column').append(clientes[current + 9]) $('<div></div>').attr('class', 'five wide tablet two wide computer column').append(clientes[current + cols * rows - 1])
) )
} }
$(document).ready(function() { $(document).ready(function() {

4
resources/views/home/contacto.blade.php
View File

@ -8,7 +8,7 @@
</div> </div>
<div class="ui stackable two columns grid"> <div class="ui stackable two columns grid">
<div class="column"> <div class="column">
<form class="ui form" id="formulario" method="post" action="{{$urls->base}}/contacto"> <form class="ui form" id="formulario_contacto" method="post" action="{{$urls->base}}/contacto">
<div class="field"> <div class="field">
<input type="text" name="nombre" placeholder="Nombre" /> <input type="text" name="nombre" placeholder="Nombre" />
</div> </div>
@ -35,7 +35,7 @@
@push('scripts') @push('scripts')
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
$('#formulario').submit(function(e) { $('#formulario_contacto').submit(function(e) {
e.preventDefault() e.preventDefault()
var nombre = $(this).find("[name='nombre']").val() var nombre = $(this).find("[name='nombre']").val()

60
resources/views/home/eventos.blade.php
View File

@ -5,17 +5,17 @@
</div> </div>
<div class="ui centered grid"> <div class="ui centered grid">
<div class="center aligned column"> <div class="center aligned column">
<div class="ui tabular compact menu"> <div class="ui tabular stackable compact menu">
<a class="active item" data-filter="none">Todos</a> <a class="active item servicio" data-filter="none">Todos</a>
@foreach ($servicios as $i => $servicio) @foreach ($servicios as $i => $servicio)
<a class="item" data-filter="{{$i}}">{{$servicio->titulo}}</a> <a class="item servicio" data-filter="{{$i}}">{{$servicio->titulo}}</a>
@endforeach @endforeach
</div> </div>
</div> </div>
</div> </div>
<div class="ui stackable center aligned grid"> <div class="ui center aligned grid" id="eventos_cards">
@foreach ($eventos as $evento) @foreach ($eventos as $evento)
<div class="four wide column"> <div class="eight wide tablet four wide computer column">
<div class="ui basic segment"> <div class="ui basic segment">
{!!$evento->image!!} {!!$evento->image!!}
<div class="ui center aligned header"> <div class="ui center aligned header">
@ -29,3 +29,53 @@
</div> </div>
</div> </div>
</div> </div>
@push('scripts')
<script type="text/javascript">
var eventos = [
@foreach ($eventos as $evento)
{
titulo: '{{$evento->titulo}}',
image: '{!!$evento->image!!}',
empresa: '{{$evento->empresa}}',
servicio: {{$evento->servicio}}
},
@endforeach
];
function changeEventos(filter) {
var grid = $('#eventos_cards')
grid.html('')
$.each(eventos, function(i, el) {
if (filter != 'none' && el.servicio != filter) {
return
}
grid.append(
$('<div></div>').attr('class', 'eight wide tablet four wide computer column').append(
$('<div></div>').attr('class', 'ui basic segment').append(el.image).append(
$('<div></div>').attr('class', 'ui center aligned header').append(el.titulo).append(
$('<br />')
).append(el.empresa)
)
)
)
})
}
var current_tab = 'none'
function changeTab(filter) {
$('.servicio.active').removeClass('active')
$(".servicio[data-filter='" + filter + "']").addClass('active')
current_tab = filter
}
$(document).ready(function() {
$('.servicio').click(function(e) {
e.preventDefault()
var filter = $(this).attr('data-filter')
if (filter == current_tab) {
return
}
changeTab(filter)
changeEventos(filter)
})
})
</script>
@endpush

13
resources/views/home/testimonios.blade.php
View File

@ -32,9 +32,9 @@
}, },
@endforeach @endforeach
] ]
var current = 0 var current_testimonio = 0
function cambiar(id) { function cambiar(id) {
if (id == current) { if (id == current_testimonio) {
return return
} }
$('#testimonio').html('').append( $('#testimonio').html('').append(
@ -42,15 +42,18 @@
).append( ).append(
$('<div></div>').attr('class', 'ui header').html(testimonios[id].emisor) $('<div></div>').attr('class', 'ui header').html(testimonios[id].emisor)
) )
$('#marcador').find(".icon[data-id='" + current + "']").addClass('outline') $('#marcador').find(".icon[data-id='" + current_testimonio + "']").addClass('outline')
$('#marcador').find(".icon[data-id='" + id + "']").removeClass('outline') $('#marcador').find(".icon[data-id='" + id + "']").removeClass('outline')
current = id $('#marcador').find('.icon.outline').css('cursor', 'pointer')
$('#marcador').find('.icon:not(.outline)').css('cursor', 'default')
current_testimonio = id
} }
$(document).ready(function() { $(document).ready(function() {
$('#marcador').find('.icon').css('cursor', 'pointer').click(function() { $('#marcador').find('.icon').click(function() {
var id = $(this).attr('data-id') var id = $(this).attr('data-id')
cambiar(id) cambiar(id)
}) })
$('#marcador').find('.icon.outline').css('cursor', 'pointer')
}) })
</script> </script>
@endpush @endpush

6
resources/views/layout/footer.blade.php
View File

@ -3,13 +3,13 @@
<div class="ui inverted container main"> <div class="ui inverted container main">
<div class="ui stackable grid"> <div class="ui stackable grid">
<div class="three columns row"> <div class="three columns row">
<div class="column"> <div class="middle aligned column">
@include('layout.footer.contacto') @include('layout.footer.contacto')
</div> </div>
<div class="column"> <div class="middle aligned column">
@include('layout.footer.ubicacion') @include('layout.footer.ubicacion')
</div> </div>
<div class="column"> <div class="middle aligned column">
@include('layout.footer.redes') @include('layout.footer.redes')
</div> </div>
</div> </div>

2
resources/views/layout/footer/contacto.blade.php
View File

@ -1,5 +1,5 @@
<div style="text-align: center;"> <div style="text-align: center;">
<a href="{{$urls->base}}/contacto"> <a href="{{$urls->base}}#contacto">
<i class="big icon icon-contacto"></i> <i class="big icon icon-contacto"></i>
<p> <p>
<strong> <strong>

17
resources/views/layout/footer/redes.blade.php
View File

@ -0,0 +1,17 @@
<div class="ui stackable five columns center aligned grid">
<div class="column">
<i class="youtube big icon"></i>
</div>
<div class="column">
<i class="instagram big icon"></i>
</div>
<div class="column">
<i class="facebook big icon"></i>
</div>
<div class="column">
<i class="linkedin big icon"></i>
</div>
<div class="column">
<i class="twitter big icon"></i>
</div>
</div>

4
resources/views/layout/footer/ubicacion.blade.php
View File

@ -1,5 +1,5 @@
<div style="text-align: center;"> <div style="text-align: center;">
<a href="{{$urls->base}}/contacto"> <a href="{{$urls->base}}#contacto">
<i class="big icon icon-ubicacion"></i> <i class="big icon icon-ubicacion"></i>
<p> <p>
<strong> <strong>
@ -7,7 +7,7 @@
</strong> </strong>
</p> </p>
</a> </a>
<a href="{{$urls->base}}/contacto"> <a href="{{$urls->base}}#contacto">
<p> <p>
Av. Nueva Providencia 1945, Of. 919, Av. Nueva Providencia 1945, Of. 919,
<br /> <br />

15
resources/views/layout/menu.blade.php
View File

@ -1,21 +1,16 @@
<nav class="ui massive stackable center aligned text fluid three item grey menu"> <nav class="ui massive stackable center aligned text three item grey menu">
<nav class="three item stackable menu"> <div class="left three item menu">
<a class="item" href="{{$urls->base}}#servicios">Servicios</a> <a class="item" href="{{$urls->base}}#servicios">Servicios</a>
<a class="item" href="{{$urls->base}}#nosotros">Nosotros</a> <a class="item" href="{{$urls->base}}#nosotros">Nosotros</a>
<a class="item" href="{{$urls->base}}#clientes">Clientes</a> <a class="item" href="{{$urls->base}}#clientes">Clientes</a>
</nav> </div>
<a class="item" href="{{$urls->base}}"> <a class="item" href="{{$urls->base}}">
<div class="ui header" id="page_logo"> <div class="ui header" id="page_logo">
Total<span class="orange">Sport</span> Total<span class="orange">Sport</span>
</div> </div>
</a> </a>
<nav class="two item stackable menu"> <div class="right two item menu">
<a class="item" href="{{$urls->base}}#eventos">Eventos</a> <a class="item" href="{{$urls->base}}#eventos">Eventos</a>
<a class="item" href="{{$urls->base}}#contacto">Contacto</a> <a class="item" href="{{$urls->base}}#contacto">Contacto</a>
</nav> </div>
</nav> </nav>
@push('styles')
<link rel="stylesheet" type="text/css" href="{{$urls->styles}}/header.css" />
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@800&display=swap" />
@endpush