fix css and datepicker
This commit is contained in:
Michael Weimann
parent
c3045e07ce
commit
86606c8055
|
|
@ -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) {
|
||||
elem.datetimepicker(opts);
|
||||
|
||||
// close on click anywhere outside
|
||||
$(document).on('click', () => {
|
||||
elem.data('datetimepicker').hide()
|
||||
})
|
||||
|
||||
elem.children().on('click', (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.data('datetimepicker').toggle();
|
||||
}
|
||||
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,59 +8,43 @@
|
|||
<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>
|
||||
<a class="navbar-brand" href="#">
|
||||
<span class="icon-icon_angel"></span> <strong class="visible-lg-inline">%APP_NAME%</strong>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<div class="jumbotron">
|
||||
<div class="container text-center">
|
||||
<h1>
|
||||
<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">
|
||||
<h2>
|
||||
The <span class="icon-icon_angel"></span> <strong>%APP_NAME%</strong> is in maintenance mode.
|
||||
</h2>
|
||||
<p>This may be due to...</p>
|
||||
<p>
|
||||
...archangels closing the gates of heaven. <br>
|
||||
...somebody's stolen the power chord and now the battery is empty. <br>
|
||||
...DHCP decided to give me another ip address.
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<iframe width="560" height="315"
|
||||
src="https://www.youtube.com/embed/0aV_vHcunSQ?rel=0"
|
||||
frameborder="0" allowfullscreen>
|
||||
</iframe>
|
||||
</div>
|
||||
<div class="container text-center">
|
||||
<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="row">
|
||||
<div class="col-xl-6">
|
||||
<h2>
|
||||
The <span class="icon-icon_angel"></span> <strong>%APP_NAME%</strong> is in maintenance mode.
|
||||
</h2>
|
||||
<p>This may be due to...</p>
|
||||
<p>
|
||||
...archangels closing the gates of heaven. <br>
|
||||
...somebody's stolen the power chord and now the battery is empty. <br>
|
||||
...DHCP decided to give me another ip address.
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-xl-6">
|
||||
<iframe width="560" height="315"
|
||||
src="https://www.youtube.com/embed/0aV_vHcunSQ?rel=0"
|
||||
frameborder="0" allowfullscreen>
|
||||
</iframe>
|
||||
</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…
Reference in New Issue