mirror
/
Cloudlog
kopia lustrzana https://github.com/magicbug/Cloudlog
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

use accordion for header

pull/2843/head
abarrau 2023-12-16 08:05:43 +01:00
rodzic ed11da8833
commit 8d606b7b8d
3 zmienionych plików z 664 dodań i 655 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

66
application/views/user/edit.php
Wyświetl plik

@ -1,5 +1,4 @@
<?php
$icon_elapse = "<span class='elapse-zone-header-icon float-end'><i class='fas fa-caret-down'></i></span>";
$icon_help = "<i class='fa fa-question-circle help-tooltip'></i>";
?>
<div class="container">
@ -32,10 +31,15 @@
<?php $this->load->helper('form'); ?>
<form method="post" action="<?php echo site_url('user/edit')."/".$this->uri->segment(3); ?>" name="users" autocomplete="off">
<div class="accordion user_edit">
<!-- ZONE 1 / USER -->
<div class="elapse-zone-header" data-zone="user_general">General Information <?php echo $icon_elapse; ?></div>
<div class="elapse-zone-body" data-zone="user_general">
<div class="accordion-item">
<h2 class="accordion-header" id="panelsStayOpen-H_user_general">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-B_user_general" aria-expanded="true" aria-controls="panelsStayOpen-B_user_general">
General Information</button>
</h2>
<div id="panelsStayOpen-B_user_general" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-H_user_general">
<div class="accordion-body">
<div class="row">
<!-- Account Information -->
<div class="col-md">
@ -126,10 +130,16 @@
</div>
</div>
</div>
</div>
</div>
<!-- ZONE 2 / Cloudlog -->
<div class="card-header elapse-zone-header" data-zone="cloudlog_general">Cloudlog Settings <?php echo $icon_elapse; ?></div>
<div class="elapse-zone-body" data-zone="cloudlog_general">
<div class="accordion-item">
<h2 class="accordion-header" id="panelsStayOpen-H_cloudlog_general">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-B_cloudlog_general" aria-expanded="true" aria-controls="panelsStayOpen-B_cloudlog_general">
Cloudlog Settings</button>
</h2>
<div id="panelsStayOpen-B_cloudlog_general" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-H_cloudlog_general">
<div class="accordion-body">
<div class="row mb-3">
<!-- Cloudlog Preferences -->
<div class="col-md">
@ -517,10 +527,16 @@
</div>
</div>
</div>
</div>
</div>
<!-- ZONE 3 / Default Value -->
<div class="card-header elapse-zone-header" data-zone="default_value">Default Value <?php echo $icon_elapse; ?></div>
<div class="elapse-zone-body" data-zone="default_value">
<div class="accordion-item">
<h2 class="accordion-header" id="panelsStayOpen-H_default_value">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-B_default_value" aria-expanded="true" aria-controls="panelsStayOpen-B_default_value">
Default Value</button>
</h2>
<div id="panelsStayOpen-B_default_value" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-H_default_value">
<div class="accordion-body">
<div class="row">
<!-- Default -->
<div class="col-md">
@ -578,14 +594,18 @@
</div>
</div>
</div>
<!-- Previsous QSL Type -->
</div>
</div>
</div>
</div>
<!-- ZONE 4 / Validation Synchro -->
<div class="card-header elapse-zone-header" data-zone="confirmation_account">Confirmation Account Setting <?php echo $icon_elapse; ?></div>
<div class="elapse-zone-body" data-zone="confirmation_account">
<div class="accordion-item">
<h2 class="accordion-header" id="panelsStayOpen-H_confirmation_account">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-B_confirmation_account" aria-expanded="true" aria-controls="panelsStayOpen-B_confirmation_account">
Miscellaneous</button>
</h2>
<div id="panelsStayOpen-B_confirmation_account" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-H_confirmation_account">
<div class="accordion-body">
<div class="row">
<!-- Logbook of the World -->
<div class="col-md">
@ -655,10 +675,16 @@
</div>
</div>
</div>
</div>
</div>
<!-- ZONE 5 / Miscellaneous -->
<div class="card-header elapse-zone-header" data-zone="miscellaneous">Miscellaneous <?php echo $icon_elapse; ?></div>
<div class="elapse-zone-body" data-zone="miscellaneous">
<div class="accordion-item">
<h2 class="accordion-header" id="panelsStayOpen-H_miscellaneous">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-B_miscellaneous" aria-expanded="true" aria-controls="panelsStayOpen-B_miscellaneous">
Miscellaneous</button>
</h2>
<div id="panelsStayOpen-B_miscellaneous" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-H_miscellaneous">
<div class="accordion-body">
<div class="row">
<!-- AMSAT Upload -->
<div class="col-md">
@ -708,7 +734,9 @@
</div>
</div>
</div>
</div>
</div>
</div>
<input type="hidden" name="id" value="<?php echo $this->uri->segment(3); ?>" />
<button type="submit" class="btn btn-primary mb-5 mt-3"><i class="fas fa-save"></i> <?php echo lang('account_save_account_changes'); ?></button>
</form>

16
assets/css/general.css
Wyświetl plik

@ -745,21 +745,13 @@ table.dataTable tfoot td {
overflow-x: unset;
}
/* Header zone (elapsable) */
.elapse-zone-header {
margin-top:1rem;
padding:0.5rem 1rem !important;
/* Header zone (accordion) */
.user_edit .accordion-button:not(.collapsed) {
background-color: rgba(255, 255, 255, 0.075)!important;
color: var(--bs-card-cap-color);
padding: var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);
border-radius: var(--bs-card-border-radius);
}
.elapse-zone-header i {
cursor: pointer;
}
.elapse-zone-body {
border: 1px solid rgba(255, 255, 255, 0.075)!important;
padding: 0.5rem !important;
.user_edit .accordion-body {
background-color: transparent;
}
.elapse-zone-body div.small.text-muted {
display:none;

11
assets/js/sections/common.js
Wyświetl plik

@ -574,17 +574,6 @@ function qso_set_eqsl_qslmsg(station_id, force_diff_to_origin=false, object='')
});
}
// [ELAPSE HEADER] function show/hide //
function elapse_zone_header() {
if ($(this).find('i').hasClass('fa-caret-down')) {
$('.elapse-zone-body[data-zone="'+ $(this).closest('.elapse-zone-header').attr('data-zone') +'"]').hide();
$(this).find('i').removeClass('fa-caret-down').addClass('fa-caret-left');
} else {
$('.elapse-zone-body[data-zone="'+ $(this).closest('.elapse-zone-header').attr('data-zone') +'"]').show();
$(this).find('i').removeClass('fa-caret-left').addClass('fa-caret-down');
}
}
// [HELP ICON] function show/hide //
function help_tooltip() {
if ($(this).closest('div').find('div.small.text-muted').is(":hidden")) {