mirror/Part-DB.Part-DB-server
1
0
Fork 1
mirror of https://github.com/Part-DB/Part-DB-server.git synced 2025-06-21 01:25:55 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improved mobile view for part edit and sidebar.

Browse source
This commit is contained in:
Jan Böhmer 2020-01-04 21:42:44 +01:00
parent 9a7223a301
commit 3caac22a0e
16 changed files with 43 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

16
assets/css/app.css
View file

@ -81,8 +81,7 @@ body {
top: 56px;
right: 0;
left: 0;
background-color: inherit;
/* z-index: 1000; */
z-index: 1000;
width: inherit;
overflow-x: hidden;
overflow-y: auto;
@ -93,11 +92,16 @@ body {
padding: 7px 15px 50px;
margin-top: -10px;
/* Fill window */
height: 100%;
/** Hide scrollbar in Firefox and Edge **/
-ms-overflow-style: none;
overflow: -moz-scrollbars-none;
/* Use standard version for hiding the scrollbar */
scrollbar-width: none;
background-color: var(--light);
}
.sidebar-container {
@ -105,6 +109,11 @@ body {
padding-top: 5px;
background-color: #F8F8F8;
}
/* Hide devices menu */
#treeBox-devices {
display: none;
}
}
/* Hide scrollbar */
@ -645,7 +654,8 @@ BS 4 overrides
}
}
.form-group > label {
.form-group > label,
.form-group > .col-form-label {
font-weight: bold;
}

1
assets/js/app.js
View file

@ -103,7 +103,6 @@ window.ajaxUI = ajaxUI;
require('../ts_src/event_listeners');
//Register darkmode (we must do it here, TS does not support ES6 constructor...
try {
//The browser needs to support mix blend mode

2
package.json
View file

@ -30,7 +30,7 @@
"clipboard": "^2.0.4",
"copy-webpack-plugin": "^5.0.4",
"corejs-typeahead": "^1.2.1",
"darkmode-js": "^1.5.3",
"darkmode-js": "1.5.3",
"datatables.net-bs4": "^1.10.19",
"datatables.net-buttons-bs4": "^1.5.4",
"datatables.net-colreorder-bs4": "^1.5.1",

4
templates/Form/extendedBootstrap4_layout.html.twig
View file

@ -7,11 +7,11 @@
{% block form_label_class -%}
col-3
col-sm-3
{%- endblock form_label_class %}
{% block form_group_class -%}
col-9
col-sm-9
{%- endblock form_group_class %}
{%- block choice_widget_options -%}

2
templates/Parts/edit/_orderdetails.html.twig
View file

@ -1,6 +1,6 @@
{% form_theme form with ['Parts/edit/edit_form_styles.html.twig', "bootstrap_4_layout.html.twig"] %}
<table class="table table-striped table-sm" id="orderdetails_table" data-prototype="{% if form.orderdetails.vars.prototype is defined %}{{ form_widget(form.orderdetails.vars.prototype)|e('html_attr') }}{% endif %}">
<table class="table table-striped table-sm table-responsive-md" id="orderdetails_table" data-prototype="{% if form.orderdetails.vars.prototype is defined %}{{ form_widget(form.orderdetails.vars.prototype)|e('html_attr') }}{% endif %}">
<tbody>
{% for detail in form.orderdetails %}
{{ form_widget(detail, {'disable_delete' : not is_granted('orderdetails.delete', part)}) }}

2
templates/Parts/info/_attachments_info.html.twig
View file

@ -1,6 +1,6 @@
{% import "helper.twig" as helper %}
<table class="table table-striped table-hover">
<table class="table table-striped table-hover table-responsive-sm">
<thead>
<tr>
<th></th>

2
templates/Parts/info/_extended_infos.html.twig
View file

@ -1,6 +1,6 @@
{% import "helper.twig" as helper %}
<table class="table table-striped table-hover table-sm w-100">
<table class="table table-striped table-hover table-sm w-100 table-responsive-sm">
<tbody>
<tr> {# Creation date #}
<td>{% trans %}createdAt{% endtrans %}</td>

4
templates/Parts/info/_main_infos.html.twig
View file

@ -1,10 +1,10 @@
{% import "helper.twig" as helper %}
<div class="row">
<div class="col-md-3 col-lg-4">
<div class="col-md-3 col-lg-4 col-3 mt-auto mb-auto">
{% include "Parts/info/_picture.html.twig" %}
</div>
<div class="col-md-9 col-lg-8">
<div class="col-md-9 col-lg-8 col-7">
<h5 class="text-muted pt-2" title="{% trans %}manufacturer.label{% endtrans %}">
{% if part.manufacturer %}
{% if part.manufacturer.id is not null %}

2
templates/Parts/info/_order_infos.html.twig
View file

@ -1,5 +1,5 @@
<div class="table-responsive">
<table class="table table-striped table-header table-hover">
<table class="table table-striped table-header table-hover table-responsive-sm">
<thead>
<tr>
<th>{% trans %}part.supplier.name{% endtrans %}</th>

3
templates/Parts/info/_part_lots.html.twig
View file

@ -1,13 +1,12 @@
{% import "helper.twig" as helper %}
<table class="table table-striped table-hover">
<table class="table table-striped table-hover table-responsive-sm">
<thead>
<tr>
<th>{% trans %}part_lots.description{% endtrans %}</th>
<th>{% trans %}part_lots.storage_location{% endtrans %}</th>
<th>{% trans %}part_lots.amount{% endtrans %}</th>
<th></th> {# Tags row #}
<th></th>
</tr>
</thead>

2
templates/Parts/info/show_part_info.html.twig
View file

@ -19,7 +19,7 @@
{% include "Parts/info/_main_infos.html.twig" %}
</div>
<div class="col-md-3">
<div class="col-md-3 offset-3 offset-md-0">
{% include "Parts/info/_sidebar.html.twig" %}
</div>

22
templates/Users/_2fa_settings.html.twig
View file

@ -35,15 +35,15 @@
{{ form_start(google_form, { 'attr': google_form_attr}) }}
{% if not tfa_google.enabled %}
<div class="offset-3">
<div class="offset-sm-3">
<h6>{% trans %}tfa_google.disabled_message{% endtrans %}</h6>
</div>
<div class="offset-3 row">
<div class="col-3">
<div class="offset-sm-3 row">
<div class="col-sm-3">
<canvas class="qrcode" data-content="{{ tfa_google.qrContent }}"></canvas>
</div>
<div class="col-9 my-auto">
<div class="col-sm-9 my-auto">
<ol class="">
<li>{% trans %}tfa_google.step.download{% endtrans %}</li>
<li>{% trans %}tfa_google.step.scan{% endtrans %}</li>
@ -53,7 +53,7 @@
</div>
</div>
<div class="offset-3">
<div class="offset-sm-3">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#manualSetupCollapse" aria-expanded="false" aria-controls="manualSetupCollapse">
{% trans %}tfa_google.manual_setup{% endtrans %}
</button>
@ -70,7 +70,7 @@
{{ form_row(google_form.google_confirmation) }}
{% else %}
<div class="offset-3">
<div class="offset-sm-3">
<h6>{% trans %}tfa_google.enabled_message{% endtrans %}</h6>
</div>
{% endif %}
@ -79,7 +79,7 @@
</div>
<div class="tab-pane fade" id="tfa-backup" role="tabpanel" aria-labelledby="backup-tab">
{% if user.backupCodes is empty %}
<div class="offset-3">
<div class="offset-sm-3">
<h6>{% trans %}tfa_backup.disabled{% endtrans %}</h6>
<span>{% trans %}tfa_backup.explanation{% endtrans %}</span>
</div>
@ -87,19 +87,19 @@
{% set backup_form_attr = { 'data-delete-form': true,
'data-title': 'tfa_backup.reset_codes.confirm_title' | trans, 'data-message': 'tfa_backup.reset_codes.confirm_message' | trans} %}
{{ form_start(backup_form, { 'attr': backup_form_attr}) }}
<div class="offset-3">
<div class="offset-sm-3">
<h6>{% trans %}tfa_backup.enabled{% endtrans %}</h6>
<span>{% trans %}tfa_backup.explanation{% endtrans %}</span>
</div>
<div class="offset-3 mt-2">
<div class="offset-sm-3 mt-2">
<p class="mb-0"><b>{% trans %}tfa_backup.remaining_tokens{% endtrans %}:</b> {{ user.backupCodes | length }}</p>
<p><b>{% trans %}tfa_backup.generation_date{% endtrans %}:</b> {{ user.backupCodesGenerationDate | format_datetime }}</p>
</div>
<div class="offset-3">
<div class="offset-sm-3">
<a href="{{ url('show_backup_codes') }}" target="_blank" data-no-ajax class="btn btn-primary">{% trans %}tfa_backup.show_codes{% endtrans %}</a>
</div>
<div class="offset-3 mt-2">
<div class="offset-sm-3 mt-2">
{{ form_widget(backup_form.reset_codes) }}
</div>
{{ form_end(backup_form) }}

4
templates/Users/user_info.html.twig
View file

@ -8,8 +8,8 @@
{% block card_content %}
<div class="card-body row">
<div class="col-md-2">
<div class="img-thumbnail">
<img class="img-fluid img-rounded" alt="User avatar" src="{{ avatar }}">
<div class="mx-auto">
<img class="img-fluid img-thumbnail img-rounded " alt="User avatar" src="{{ avatar }}">
</div>
</div>
<div class="col-md-5">

2
templates/_sidebar.html.twig
View file

@ -29,7 +29,7 @@
<div id="tree-categories" data-tree-search="#tree-category-search"></div>
</li>
<li id="treeBox-devices">
<li id="treeBox-devices" class="d-sm-none d-md-block">
<div class="input-group input-group-sm mb-2 mt-2">
<div class="input-group-prepend">
<button class="btn btn-light dropdown-toggle" type="button"

2
templates/security/login.html.twig
View file

@ -61,6 +61,6 @@
</form>
{% if allow_email_pw_reset %}
<a class="offset-2" href="{{ url('pw_reset_request') }}">{% trans %}pw_reset.password_forget{% endtrans %}</a>
<a class="offset-sm-2" href="{{ url('pw_reset_request') }}">{% trans %}pw_reset.password_forget{% endtrans %}</a>
{% endif %}
{% endblock %}

8
yarn.lock
View file

@ -2207,10 +2207,10 @@ d@1, d@^1.0.1:
es5-ext "^0.10.50"
type "^1.0.1"
darkmode-js@^1.5.3:
version "1.5.4"
resolved "https://registry.yarnpkg.com/darkmode-js/-/darkmode-js-1.5.4.tgz#c15d981b518d1a50f6ebecc362434d11e8fa38ce"
integrity sha512-Wr//3IDfHLnLIPsC6f9+26BG3dH7sqtJ/kIKaeR8yGCW6Nm7vTiEvUA3lm7eiUwqt+yXyPHrnfpanWo+rEtp7Q==
darkmode-js@1.5.3:
version "1.5.3"
resolved "https://registry.yarnpkg.com/darkmode-js/-/darkmode-js-1.5.3.tgz#89a5b72681d58a9b11b079fdeba7abc7c7b75ee9"
integrity sha512-Az6X5E6RJ72TQls1v3wIWuknb6J7XjRReMMOpMM8SXXbeO4bxGKJeJDtf7GdcIgmiTQ/cPqqObpr7LRzsAJDow==
datatables.net-bs4@^1.10.15, datatables.net-bs4@^1.10.19:
version "1.10.20"