fix css and datepicker

main
Michael Weimann 3 years ago
parent c3045e07ce
commit 86606c8055
No known key found for this signature in database
GPG Key ID: 34F0524D4DA694A1

@ -68,7 +68,7 @@ function form_date($name, $label, $value, $start_date = '', $end_date = '')
$end_date = is_numeric($end_date) ? date('Y-m-d', $end_date) : '';
return form_element($label, '
<div class="input-group date" id="' . $dom_id . '" data-min-date="' . $start_date . '" data-max-date="' . $end_date . '">
<div class="input-group date" id="' . $dom_id . '" data-min-date="' . $start_date . '" data-max-date="' . $end_date . '" data-target-input="nearest">
<input type="date" placeholder="YYYY-MM-DD" name="' . $name . '" class="form-control" value="' . htmlspecialchars($value) . '" autocomplete="off">'
. '<span class="input-group-text">' . icon('grid-3x3-gap-fill') . '</span>
</div>

@ -204,10 +204,7 @@ class ShiftCalendarRenderer
$rendered_until += ShiftCalendarRenderer::SECONDS_PER_ROW;
}
$bg = '';
if (theme_type() === 'light') {
$bg = 'bg-light';
}
$bg = 'bg-' . theme_type();
return div('lane', [
div('header ' . $bg, $lane->getHeader()),

@ -98,8 +98,16 @@ $(function () {
*/
$(function () {
$([
{'select': $('.input-group.date'), 'format': 'YYYY-MM-DD'},
{'select': $('.input-group.datetime'), 'format': 'YYYY-MM-DD HH:mm'},
{
'select': $('.input-group.date'),
'format': 'YYYY-MM-DD',
'extraFormats': []
},
{
'select': $('.input-group.datetime'),
'format': 'YYYY-MM-DD HH:mm',
'extraFormats': ['YYYY-MM-DDTHH:mm']
},
]).each(function (_, element) {
element.select.each(function () {
var elem = $(this);
@ -108,6 +116,7 @@ $(function () {
maxDate: '',
locale: $('html').attr('lang'),
format: element.format,
extraFormats: element.extraFormats,
widgetPositioning: {horizontal: 'auto', vertical: 'bottom'},
icons: {
time: 'bi bi-clock',
@ -116,29 +125,29 @@ $(function () {
down: 'bi bi-arrow-down'
}
};
$.extend(opts, elem.data());
if (opts.minDate.length === 0) {
delete opts.minDate;
}
if (opts.maxDate.length === 0) {
delete opts.maxDate;
}
elem.children('input').attr('type', 'text');
elem.children().on('click', function (ev) {
ev.stopImmediatePropagation();
if (typeof elem.data('datetimepicker') === 'undefined') {
elem.datetimepicker(opts);
elem.data('datetimepicker').show();
// close on click anywhere outside
$(document).on('click', () => {
elem.data('datetimepicker').hide()
})
} else {
elem.children().on('click', (ev) => {
ev.stopImmediatePropagation();
elem.data('datetimepicker').toggle();
}
});
});
});
});

@ -23,6 +23,7 @@ $(document).ready(function () {
});
headers.css({
'top': Math.max(0, $(window).scrollTop() - top
- 13
+ topReference.offset().top)
+ 'px'
});

@ -106,6 +106,7 @@ table a > .icon-icon_angel {
margin-bottom: 0;
}
.input-group.date,
.input-group.datetime,
.input-group.time {
.bootstrap-datetimepicker-widget {

@ -8,37 +8,22 @@
<script type="text/javascript" src="assets/vendor.js"></script>
</head>
<body>
<div class="navbar navbar-default navbar-fixed-top">
<div class="navbar navbar-light bg-light fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">
<span class="icon-icon_angel"></span> <strong class="visible-lg-inline">%APP_NAME%</strong>
</a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<ul class="nav navbar-nav"></ul>
<ul class="nav navbar-nav navbar-right">
</ul>
</div>
</div>
</div>
<div class="container-fluid">
<div class="row">
<div class="jumbotron">
<div class="container text-center">
<h1>
<h1 class="mb-4">
<span class="bi bi-scissors"></span>
<span class="bi bi-wrench"></span>
<span class="bi bi-cloud-lightning-rain"></span>
</h1>
<div class="col-md-6">
<div class="row">
<div class="col-xl-6">
<h2>
The <span class="icon-icon_angel"></span> <strong>%APP_NAME%</strong> is in maintenance mode.
</h2>
@ -49,7 +34,7 @@
...DHCP decided to give me another ip address.
</p>
</div>
<div class="col-md-6">
<div class="col-xl-6">
<iframe width="560" height="315"
src="https://www.youtube.com/embed/0aV_vHcunSQ?rel=0"
frameborder="0" allowfullscreen>
@ -57,10 +42,9 @@
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="text-center footer">
<div class="text-center footer my-5">
<a href="https://github.com/engelsystem/engelsystem/issues">Bugs / Features</a>
· <a href="https://github.com/engelsystem/engelsystem/">Development Platform</a>
</div>

@ -260,6 +260,26 @@
</label>
</div>
</div>
<div class="row">
<div class="col-md-3 col-lg-2">
<label class="form-label">Date</label>
<div class="input-group date" data-target-input="nearest">
<input type="date" placeholder="YYYY-MM-DD" name="design-date" class="form-control" value="2021-09-15">
<span class="input-group-text">
<span class="bi bi-grid-3x3-gap-fill"></span>
</span>
</div>
</div>
<div class="col-md-3 col-lg-2">
<label class="form-label">Datetime</label>
<div class="input-group datetime" data-target-input="nearest">
<input type="datetime-local" placeholder="YYYY-MM-DD HH:MM" name="design-datetime" class="form-control" value="2021-09-15T13:37">
<span class="input-group-text">
<span class="bi bi-grid-3x3-gap-fill"></span>
</span>
</div>
</div>
</div>
</div>
</div>

Loading…
Cancel
Save