ADUANASOFT/MVE
10
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Sidebars - animaciones

Browse Source
This commit is contained in:
Alexeer
2025-07-18 12:21:26 -06:00
parent 1900091b99
commit 37dcfffd7b
69 changed files with 1282 additions and 710 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
views/preferencias/catalogos.php
View File

@@ -70,6 +70,11 @@
.spinner-border { display: inline-block; width: 1rem; height: 1rem; vertical-align: text-bottom; border: 0.125em solid currentColor; border-right-color: transparent;
border-radius: 50%; animation: spinner-border 0.75s linear infinite; }
.spinner-border-sm { width: 0.875rem; height: 0.875rem; border-width: 0.125em; }
.fade-in-up { animation: fadeInUp 0.8s ease-out; }
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(30px); }
to { opacity: 1; transform: translateY(0); }
}
</style>
</head>
<body>
@@ -91,7 +96,7 @@
</div>
<?php endif; ?>
<div class="card shadow-sm p-4 mb-4 bg-white card-hover position-relative h-auto">
<div class="card shadow-sm p-4 mb-4 bg-white card-hover position-relative h-auto fade-in-up">
<!-- Switch general de notificaciones -->
<div class="section-divider">
<div class="form-check form-switch">

29
views/preferencias/dashboard_preferencias.php
View File

@@ -62,6 +62,27 @@
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); transition: left 0.5s; }
.btn-animated:hover::before { left: 100%; }
.alert { border: none; border-radius: 12px; background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); }
.btn-indigo { background-color: #6610f2; color: white; }
.btn-indigo:hover { background-color: #520dc2; color: white; }
.text-indigo { color: #520dc2; }
.btn-orange { background-color: orangeRed; color: white; }
.btn-orange:hover { background-color: #ff3600; color: white; }
.text-orange { color: orangeRed; }
.btn-teal { background-color: #4dd4ac ; color: white; }
.btn-teal:hover { background-color: #20c997; color: black; }
.text-teal { color: #4dd4ac; }
.btn-lime { background-color: #84cc16; color: white; }
.text-lime { color: #84cc16; }
.btn-lime:hover { background-color: #65a30d; color: black; }
.btn-cyan { background-color: #06b6d4; color: white; }
.text-cyan { color: #06b6d4; }
.btn-cyan:hover { background-color: #0891b2; color: white; }
.btn-violet { background-color: #8b5cf6; color: white; }
.text-violet { color: #8b5cf6; }
.btn-violet:hover { background-color: #7c3aed; color: white; }
.btn-lila { background-color: #c4b5fd; /* violeta claro */ color: white; border: none; }
.btn-lila:hover { background-color: #a78bfa; /* tono ligeramente más fuerte */ color: white; }
.text-lila { color: #c4b5fd; }
</style>
</head>
<body>
@@ -74,14 +95,14 @@
<div class="col-md-4 animate__animated animate__fadeInUp" style="animation-delay: 0.1s;">
<div class="card shadow-sm p-3 card-hover position-relative h-100">
<div class="card-body p-0 d-flex flex-column">
<h5 class="text-primary mb-3">
<h5 class="text-teal mb-3">
<i class="fas fa-bell me-2"></i>
Notificaciones
</h5>
<p class="text-muted small flex-grow-1 mb-4">
Gestiona y configura las notificaciones del sistema para mantenerte informado.
</p>
<button class="btn btn-primary btn-sm mt-auto w-100 btn-animated"
<button class="btn btn-teal btn-sm mt-auto w-100 btn-animated"
onclick="navigateWithAnimation(this, '/IMPORTADORES/preferencias/notificaciones')">
<i class="fas fa-cog me-2"></i>
Configurar Notificaciones
@@ -94,14 +115,14 @@
<div class="col-md-4 animate__animated animate__fadeInUp" style="animation-delay: 0.2s;">
<div class="card shadow-sm p-3 card-hover position-relative h-100">
<div class="card-body p-0 d-flex flex-column">
<h5 class="text-success mb-3">
<h5 class="text-lime mb-3">
<i class="fas fa-list me-2"></i>
Catálogos
</h5>
<p class="text-muted small flex-grow-1 mb-4">
Personaliza la visualización de tus catálogos y organiza tu contenido.
</p>
<button class="btn btn-success btn-sm mt-auto w-100 btn-animated"
<button class="btn btn-lime btn-sm mt-auto w-100 btn-animated"
onclick="navigateWithAnimation(this, '/IMPORTADORES/preferencias/catalogos')">
<i class="fas fa-palette me-2"></i>
Personalizar Catálogos

7
views/preferencias/notificaciones.php
View File

@@ -45,6 +45,11 @@
.day-preset .btn { margin-right: 10px; margin-bottom: 5px; }
.form-check-input:checked { background-color: #0d6efd; border-color: #0d6efd; }
.btn-outline-primary.active { background-color: #0d6efd; border-color: #0d6efd; color: white; }
.fade-in-up { animation: fadeInUp 0.8s ease-out; }
@keyframes fadeInUp {
from { opacity: 0; transform: translateY(30px); }
to { opacity: 1; transform: translateY(0); }
}
</style>
</head>
<body>
@@ -67,7 +72,7 @@
</div>
<?php endif; ?>
<div class="card shadow-sm p-4 mb-4 bg-white card-hover position-relative h-auto">
<div class="card shadow-sm p-4 mb-4 bg-white card-hover position-relative h-auto fade-in-up">
<!-- Switch general de notificaciones -->
<div class="section-divider">
<div class="form-check form-switch">