File: /var/www/html/eva.sumar.com.py/resources/views/welcome.blade.php
<!DOCTYPE html>
<html lang="es">
<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">
<title>EVA</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body {
background: url(imagenes/fondo-pagina-principal-inicio.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#body {
background-image:
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/estrella.png'),
url('imagenes/nave1.png'),
url('imagenes/nave1.png');
background-repeat: no-repeat;
background-position:
0px 0,
1300px 0,
0px 30%,
1300px 80%,
200px 0,
1000px 100%,
0px 100%,
1300px 0,
100px 100%,
600px 70%,
0px 100%,
1300px 0;
background-size:
30px,
30px,
30px,
30px,
30px,
30px,
30px,
30px,
30px,
30px,
100px,
100px;
animation: 50s para infinite linear;
}
@keyframes para {
100% {
background-position:
1300px 100%,
0px 100%,
1300px 30%,
0px 80%,
200px 100%,
1000px 0,
0px 0%,
1300px 100%,
400px 100%,
1000px 100%,
1300px 100%,
0px 0;
}
}
.preloader {
animation-name: girar;
animation-duration: 20s;
animation-iteration-count: infinite;
}
@keyframes girar {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.p-3{
background-color: white;
border-radius: 10%;
text-align: center;
color: #980B0B;
margin-bottom: 10px;
}
.p-3:hover{
background: rgb(255,30,0);
background: linear-gradient(90deg, rgba(255,30,0,1) 0%, rgba(223,73,53,1) 0%, rgba(255,247,0,1) 100%);
color: white;
transform: scale(1.1);
}
.nav-link{
color:white !important;font-size:16px;font-weight: bold;
}
.p-3 img{
height:150px;
}
@media (max-width: 600px){
.p-3 img{
height:70px;
}
}
</style>
@livewireStyles
</head>
<body>
<div id="body">
<div class="container overflow-hidden">
<div class="row">
<div class="col-12" align="right">
<br><a href="/perfil"><h1 style="color:#fff;text-align:right;font-size: 18px;"><img src="imagenes/astronauta1.png" width="30px"> <b> MI PERFIL</b></h1></a>
</div>
<div class="col-12">
<br><h1 style="color:#fff;text-align:center;font-size: 65px;"><b>ESPACIO SOLAR </b></h1>
</div>
<div class="col-md-12">
<br />
<br />
<br />
</div>
</div>
<div class="row gx-5">
<div class="col">
<a href="/areadeaprendizaje" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/telescopio.png"><br /><br />
<b>CĂPSULAS DE APRENDIZAJE</b><br />
</div></a>
</div>
<div class="col">
<a href="/noticias" style="text-decoration: none;"><div class="p-3 border bg-light"><br />
<img src="imagenes/planeta6.png"><br /><br />
<b>UNIVERSO DE NOTICIAS</b><br />
</div></a>
</div>
<div class="col">
<a href="/espaciocolaborativo"><div class="p-3 border bg-light"><br />
<img src="imagenes/planeya7.png"><br /><br />
<b>ESPACIO COLABORATIVO</b><br />
</div></a>
</div>
</div>
</div>
</div>
<livewire:notificaciones />
<!-- aqui van los script del modal -->
<?php
use App\Models\Modal;
$popup=Modal::first();
?>
@if($popup->estado == 1)
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<center><h5 class="modal-title" id="exampleModalLabel" style="text-align: center !important;">{{$popup->nombre}}</h5></center>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" align="center">
@if($popup->tipo == 'imagen')
<img src="/modal/{{$popup->enlace}}" width="101%"><br>
@elseif($popup->tipo == 'video')
<video src="/modal/{{$popup->enlace}}" controls width="100%"></video><br>
@endif
</div>
<!--<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
</div>-->
</div>
</div>
</div>
<script>
$('#modal').modal('show')
</script>
@endif
@livewireScripts
</body>
</html>