Desarrollado breadcrumb flotante

This commit is contained in:
imnavajas
2024-01-13 23:13:44 +01:00
parent d7a1c7f756
commit 2ef4db18f2
5 changed files with 83 additions and 34 deletions

View File

@ -23,7 +23,7 @@ CI_ENVIRONMENT = development
#--------------------------------------------------------------------
#app.baseURL = 'https://sk-dev.imnavajas.es'
app.baseURL = 'https://sk-jjo.imnavajas.es'
app.baseURL = 'https://sk-imn.imnavajas.es'
# app.baseURL = 'https://sk-imn.imnavajas.es'
# app.baseURL = "http://safekat.test/"
# app.forceGlobalSecureRequests = false

View File

@ -1,4 +1,6 @@
<?php if (isset($breadcrumb)) { ?>
<div id="bc-card" class="card sticky-breadcrumb border border-secondary mb-3">
<div class="card-header header-elements">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<?php
@ -12,8 +14,20 @@
?>
</ol>
</nav>
<div id="bc-save-div" class="card-header-elements ms-auto" style="display: none">
<button id="bc-save"
type="button"
class="btn btn-sm btn-primary waves-effect waves-light"
>
<?= lang('Basic.global.Save') ?>
</button>
</div>
</div>
</div>
<?php
} else { ?>
<div class="card bg-secondary sticky-breadcrumb border border-secondary mb-3">
<div class="card-header header-elements">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item active">
@ -21,4 +35,35 @@
</li>
</ol>
</nav>
</div>
</div>
<?php } ?>
<?= $this->section('additionalInlineJs') ?>
function showBreadCrumbSaveButton(showIt = false){
if(showIt === true){
$('#bc-save-div').show();
$('#bc-card').addClass('bg-warning');
} else if(showIt === false){
$('#bc-save-div').hide();
$('#bc-card').removeClass('bg-warning');
}
}
// SOLO PARA TEST
$(document).on("keypress", function(event) {
if (event.keyCode === 112) {
event.preventDefault();
showBreadCrumbSaveButton(true);
}
});
$('#bc-save').on( "click", function() {
showBreadCrumbSaveButton(false);
alert('click action on save button');
} );
///
<?= $this->endSection() ?>

View File

@ -92,7 +92,6 @@ if (!empty($token) && $tfa == false) {
<script src="<?= site_url('themes/vuexy/vendor/js/helpers.js') ?>"></script>
<script src="<?= site_url('themes/vuexy/js/config.js') ?>"></script>
</head>
<body>
@ -118,11 +117,6 @@ if (!empty($token) && $tfa == false) {
</div>
<div class="navbar-nav-right d-flex align-items-center" id="navbar-collapse">
<div class="navbar-nav align-items-center">
<a class="nav-link style-switcher-toggle hide-arrow" href="javascript:void(0);">
<i class="ti ti-sm"></i>
</a>
</div>
<ul class="navbar-nav flex-row align-items-center ms-auto">
@ -270,6 +264,7 @@ if (!empty($token) && $tfa == false) {
<!--/ User -->
</ul>
</div>
</nav>
<!-- / Navbar -->
@ -278,12 +273,15 @@ if (!empty($token) && $tfa == false) {
<!-- Content -->
<div class="container-fluid flex-grow-1 container-p-y">
<h5 class="py-3 mb-4">
<?php include "breadcrumbs.php" ?>
</h5>
<?= $this->renderSection('content') ?>
<?php
// Include breadcrumbs block
include "breadcrumbs.php"
?>
<?=
// Render the content section
$this->renderSection('content')
?>
</div>
<!-- / Content -->

View File

@ -114,3 +114,9 @@
text-align: center;
margin-top: 1rem;
}
.sticky-breadcrumb {
position: sticky;
top: 90px;
z-index: 1020;
}

View File

@ -3985,7 +3985,7 @@ textarea.form-control-lg {
.breadcrumb {
--bs-breadcrumb-padding-x: 0;
--bs-breadcrumb-padding-y: 0;
--bs-breadcrumb-margin-bottom: 1rem;
/* --bs-breadcrumb-margin-bottom: 1rem; IMN */
--bs-breadcrumb-bg: transparent;
--bs-breadcrumb-border-radius: ;
--bs-breadcrumb-divider-color: #4b465c;