[BS5] add responsive tabs and more

This commit is contained in:
FreddleSpl0it
2022-06-06 20:38:24 +02:00
parent f13530d8a1
commit cb6a5d4069
67 changed files with 786 additions and 409 deletions

View File

@@ -1,13 +1,17 @@
<div role="tabpanel" class="tab-pane fade" id="tab-bcc" role="tabpanel" aria-labelledby="tab-bcc">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.bcc_maps }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-bcc" data-bs-toggle="collapse" aria-controls="collapse-tab-bcc">
{{ lang.mailbox.bcc_maps }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.bcc_maps }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-acl="{{ acl.bcc_maps }}" data-bs-toggle="modal" data-bs-target="#addBCCModalAdmin"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_bcc_entry }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_bcc_table" data-table="bcc_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-bcc" class="card-body collapse" data-bs-parent="#mail-content">
<p class="text-muted">{{ lang.mailbox.bcc_info|raw }}</p>
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="bcc_table" class="table table-striped dt-responsive w-100"></table>
@@ -29,15 +33,19 @@
</div>
</div>
</div>
<div class="card{% if mailcow_cc_role != 'admin' %} hidden{% endif %}">
<div class="card mb-4{% if mailcow_cc_role != 'admin' %} d-none{% endif %}">
<div class="card-header d-flex">
{{ lang.mailbox.recipient_maps }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-bcc-filters" data-bs-toggle="collapse" aria-controls="collapse-tab-bcc-filters">
{{ lang.mailbox.recipient_maps }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.recipient_maps }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addRecipientMapModalAdmin"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_recipient_map_entry }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_recipient_map_table" data-table="recipient_map_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-bcc-filters" class="card-body collapse" data-bs-parent="#mail-content">
<p class="text-muted">{{ lang.mailbox.recipient_map_info }}</p>
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="recipient_map_table" class="table table-striped dt-responsive w-100"></table>

View File

@@ -1,13 +1,17 @@
<div role="tabpanel" class="tab-pane fade" id="tab-domain-aliases" role="tabpanel" aria-labelledby="tab-domain-aliases">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.domain_aliases }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-domain-aliases" data-bs-toggle="collapse" aria-controls="ollapse-tab-domain-aliases">
{{ lang.mailbox.domain_aliases }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.domain_aliases }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-acl="{{ acl.alias_domains }}" data-bs-toggle="modal" data-bs-target="#addAliasDomainModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_domain_alias }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_aliasdomain_table" data-table="aliasdomain_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-domain-aliases" class="card-body collapse" data-bs-parent="#mail-content">
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="aliasdomain_table" class="table table-striped dt-responsive w-100"></table>
<div class="mass-actions-mailbox">

View File

@@ -1,7 +1,11 @@
<div role="tabpanel" class="tab-pane fade show active" id="tab-domains" role="tabpanel" aria-labelledby="tab-domains">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.domains }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-domains" data-bs-toggle="collapse" aria-controls="collapse-tab-domains">
{{ lang.mailbox.domains }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.domains }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
{% if mailcow_cc_role == 'admin' %}
<button class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addDomainModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_domain }}</button>
@@ -9,7 +13,7 @@
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_domain_table" data-table="domain_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-domains" class="card-body collapse show" data-bs-parent="#mail-content">
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="domain_table" class="table table-striped dt-responsive w-100"></table>
<div class="mass-actions-mailbox">

View File

@@ -1,13 +1,17 @@
<div role="tabpanel" class="tab-pane fade" id="tab-filters" role="tabpanel" aria-labelledby="tab-filters">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.filters }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-filters" data-bs-toggle="collapse" aria-controls="collapse-tab-filters">
{{ lang.mailbox.filters }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.filters }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-acl="{{ acl.filters }}" data-bs-toggle="modal" data-bs-target="#addFilterModalAdmin"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_filter }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_filter_table" data-table="filter_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-filters" class="card-body collapse" data-bs-parent="#mail-content">
<p class="text-muted">{{ lang.mailbox.sieve_info|raw }}</p><br>
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="filter_table" class="table table-striped dt-responsive w-100"></table>

View File

@@ -1,9 +1,12 @@
<div role="tabpanel" class="tab-pane fade" id="tab-mailbox-defaults" role="tabpanel" aria-labelledby="tab-mailbox-defaults">
<div class="card">
<div class="card-header">
{{ lang.mailbox.mailbox_defaults }}
<div class="card mb-4">
<div class="card-header d-flex">
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-mailbox-defaults" data-bs-toggle="collapse" aria-controls="collapse-tab-mailbox-defaults">
{{ lang.mailbox.mailbox_defaults }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.mailbox_defaults }} <span class="badge bg-info table-lines"></span></span>
</div>
<div class="card-body text-muted">
<div id="collapse-tab-mailbox-defaults" class="card-body collapse text-muted" data-bs-parent="#mail-content">
{{ lang.mailbox.mailbox_defaults_info }}
</div>
</div>

View File

@@ -1,17 +1,21 @@
<div role="tabpanel" class="tab-pane fade" id="tab-mailboxes" role="tabpanel" aria-labelledby="tab-mailboxes">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.mailboxes }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-mailboxes" data-bs-toggle="collapse" aria-controls="collapse-tab-mailboxes">
{{ lang.mailbox.mailboxes }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.mailboxes }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addMailboxModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_mailbox }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_mailbox_table" data-table="mailbox_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-mailboxes" class="card-body collapse" data-bs-parent="#mail-content">
<div class="mass-actions-mailbox d-none d-sm-flex" data-actions-header="true"></div>
<table id="mailbox_table" class="table table-striped dt-responsive w-100"></table>
<div class="mass-actions-mailbox">
<div class="btn-group d-block d-md-none">
<div class="btn-group d-flex d-md-none">
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="mailbox" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary dropdown-toggle" data-bs-toggle="dropdown" href="#">{{ lang.mailbox.quick_actions }}</a>
<ul class="dropdown-menu">

View File

@@ -1,13 +1,17 @@
<div role="tabpanel" class="tab-pane fade" id="tab-mbox-aliases" role="tabpanel" aria-labelledby="tab-mbox-aliases">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.aliases }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-mbox-aliases" data-bs-toggle="collapse" aria-controls="collapse-tab-mbox-aliases">
{{ lang.mailbox.aliases }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.aliases }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addAliasModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_alias }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_alias_table" data-table="alias_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-mbox-aliases" class="card-body collapse" data-bs-parent="#mail-content">
<p class="text-muted">{{ lang.mailbox.alias_domain_alias_hint|raw }}</p>
<!-- <div class="mass-actions-mailbox" data-actions-header="true"></div> -->
<table id="alias_table" class="table table-striped dt-responsive w-100"></table>

View File

@@ -1,16 +1,20 @@
<div role="tabpanel" class="tab-pane fade" id="tab-resources" role="tabpanel" aria-labelledby="tab-resources">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.resources }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-resources" data-bs-toggle="collapse" aria-controls="collapse-tab-resources">
{{ lang.mailbox.resources }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.resources }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addResourceModal"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_resource }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_resource_table" data-table="resource_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<p><span class="badge fs-5 bg-success text-muted">{{ lang.mailbox.booking_0_short }}</span> - {{ lang.mailbox.booking_null }}</p>
<p><span class="badge fs-5 bg-warning text-muted">{{ lang.mailbox.booking_lt0_short }}</span> - {{ lang.mailbox.booking_ltnull }}</p>
<p><span class="badge fs-5 bg-danger text-muted">{{ lang.mailbox.booking_custom_short }}</span> - {{ lang.mailbox.booking_custom }}</p>
<div id="collapse-tab-resources" class="card-body collapse" data-bs-parent="#mail-content">
<p><span class="badge fs-6 bg-success">{{ lang.mailbox.booking_0_short }}</span> - {{ lang.mailbox.booking_null }}</p>
<p><span class="badge fs-6 bg-warning">{{ lang.mailbox.booking_lt0_short }}</span> - {{ lang.mailbox.booking_ltnull }}</p>
<p><span class="badge fs-6 bg-danger">{{ lang.mailbox.booking_custom_short }}</span> - {{ lang.mailbox.booking_custom }}</p>
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="resource_table" class="table table-striped dt-responsive w-100"></table>
<div class="mass-actions-mailbox">

View File

@@ -1,13 +1,17 @@
<div role="tabpanel" class="tab-pane fade" id="tab-syncjobs" role="tabpanel" aria-labelledby="tab-syncjobs">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.sync_jobs }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-syncjobs" data-bs-toggle="collapse" aria-controls="collapse-tab-syncjobs">
{{ lang.mailbox.sync_jobs }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.sync_jobs }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button data-acl="{{ acl.syncjobs }}" class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addSyncJobModalAdmin"><i class="bi bi-plus-lg"></i> {{ lang.user.create_syncjob }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_sync_job_table" data-table="sync_job_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-syncjobs" class="card-body collapse" data-bs-parent="#mail-content">
<!-- <div class="mass-actions-mailbox" data-actions-header="true"></div> -->
<table id="sync_job_table" class="table table-striped dt-responsive w-100"></table>
<div class="mass-actions-mailbox">

View File

@@ -1,13 +1,17 @@
<div role="tabpanel" class="tab-pane fade{% if mailcow_cc_role != 'admin' %} d-none{% endif %}" id="tab-tls-policy" role="tabpanel" aria-labelledby="tab-tls-policy">
<div class="card">
<div class="card mb-4">
<div class="card-header d-flex">
{{ lang.mailbox.tls_policy_maps_long }} <span class="badge bg-info table-lines"></span>
<button class="btn d-md-none flex-grow-1 text-start" data-bs-target="#collapse-tab-tls-policy" data-bs-toggle="collapse" aria-controls="collapse-tab-tls-policy">
{{ lang.mailbox.tls_policy_maps_long }} <span class="badge bg-info table-lines"></span>
</button>
<span class="d-none d-md-block">{{ lang.mailbox.tls_policy_maps_long }} <span class="badge bg-info table-lines"></span></span>
<div class="btn-group ms-auto d-none d-sm-flex">
<button class="btn btn-xs btn-success" href="#" data-bs-toggle="modal" data-bs-target="#addTLSPolicyMapAdmin"><i class="bi bi-plus-lg"></i> {{ lang.mailbox.add_tls_policy_map }}</button>
<button class="btn btn-xs btn-secondary refresh_table" data-draw="draw_tls_policy_table" data-table="tls_policy_table">{{ lang.admin.refresh }}</button>
</div>
</div>
<div class="card-body">
<div id="collapse-tab-tls-policy" class="card-body collapse" data-bs-parent="#mail-content">
<p class="text-muted">{{ lang.mailbox.tls_policy_maps_info|raw }}</p>
{#<div class="mass-actions-mailbox" data-actions-header="true"></div>#}
<table id="tls_policy_table" class="table table-striped dt-responsive w-100"></table>