steve
/
mybuddy
mirror of https://github.com/snachodog/mybuddy.git
1
0
Fork 0
Code Issues 3 Packages Projects 1 Releases Wiki Activity

Apply custom style to `.datetimepicker-input`

This commit is contained in:
Christopher C. Wells 2020-01-27 20:40:52 -08:00 committed by Christopher Charbonneau Wells
parent f725dd12f6
commit 475b7abf78
4 changed files with 17 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
babybuddy/static_src/js/babybuddy.js
View File

@ -23,6 +23,7 @@ BabyBuddy.DatetimePicker = function ($, moment) {
return { return {
init: function (element, options) { init: function (element, options) {
var defaultOptions = { var defaultOptions = {
allowInputToggle: true,
buttons: { showToday: true, showClose: true }, buttons: { showToday: true, showClose: true },
defaultDate: 'now', defaultDate: 'now',
format: 'L LT', format: 'L LT',

7
babybuddy/static_src/scss/global.scss
View File

@ -34,3 +34,10 @@
.bootstrap-datetimepicker-widget { .bootstrap-datetimepicker-widget {
color: $gray-400; color: $gray-400;
} }
.datetimepicker-input[readonly] {
background: none;
border: 0;
color: $white;
font-weight: bold;
}

18
babybuddy/templates/babybuddy/form_field.html
View File

@ -18,16 +18,16 @@
</label> </label>
</div> </div>
{% elif field|field_type == "datetimefield" or field|field_type == "datefield" %} {% elif field|field_type == "datetimefield" or field|field_type == "datefield" %}
<div class="input-group date" id="datetimepicker_{{ field.name }}" data-target-input="nearest"> <div class="input-group" id="datetimepicker_{{ field.name }}" data-target-input="nearest">
<div class="input-group-prepend" data-target="#datetimepicker_{{ field.name }}" data-toggle="datetimepicker"> <div class="input-group-prepend" data-target="#datetimepicker_{{ field.name }}" data-toggle="datetimepicker">
<span class="input-group-text"><i class="fa fa-calendar"></i></span> <span class="input-group-text"><i class="fa fa-calendar"></i></span>
</div>
{% if field.errors %}
{{ field|add_class:"form-control is-invalid" }}
{% else %}
{{ field|add_class:"form-control" }}
{% endif %}
</div> </div>
{% if field.errors %}
{{ field|add_class:"datetimepicker-input form-control is-invalid" }}
{% else %}
{{ field|add_class:"datetimepicker-input form-control" }}
{% endif %}
</div>
{% elif 'choice' in field|field_type %} {% elif 'choice' in field|field_type %}
{% if field.errors %} {% if field.errors %}
{{ field|add_class:"custom-select is-invalid" }} {{ field|add_class:"custom-select is-invalid" }}

11
core/forms.py
View File

@ -62,7 +62,6 @@ class ChildForm(forms.ModelForm):
widgets = { widgets = {
'birth_date': forms.DateInput(attrs={ 'birth_date': forms.DateInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_date', 'data-target': '#datetimepicker_date',
}), }),
} }
@ -95,7 +94,6 @@ class DiaperChangeForm(forms.ModelForm):
widgets = { widgets = {
'time': forms.DateTimeInput(attrs={ 'time': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_time', 'data-target': '#datetimepicker_time',
}), }),
} }
@ -112,12 +110,10 @@ class FeedingForm(forms.ModelForm):
widgets = { widgets = {
'start': forms.DateTimeInput(attrs={ 'start': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_start', 'data-target': '#datetimepicker_start',
}), }),
'end': forms.DateTimeInput(attrs={ 'end': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_end', 'data-target': '#datetimepicker_end',
}), }),
} }
@ -155,12 +151,10 @@ class SleepForm(forms.ModelForm):
widgets = { widgets = {
'start': forms.DateTimeInput(attrs={ 'start': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_start', 'data-target': '#datetimepicker_start',
}), }),
'end': forms.DateTimeInput(attrs={ 'end': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_end', 'data-target': '#datetimepicker_end',
}), }),
} }
@ -187,7 +181,6 @@ class TemperatureForm(forms.ModelForm):
widgets = { widgets = {
'time': forms.DateTimeInput(attrs={ 'time': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_time', 'data-target': '#datetimepicker_time',
}), }),
} }
@ -204,7 +197,6 @@ class TimerForm(forms.ModelForm):
widgets = { widgets = {
'start': forms.DateTimeInput(attrs={ 'start': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_start', 'data-target': '#datetimepicker_start',
}) })
} }
@ -227,12 +219,10 @@ class TummyTimeForm(forms.ModelForm):
widgets = { widgets = {
'start': forms.DateTimeInput(attrs={ 'start': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_start', 'data-target': '#datetimepicker_start',
}), }),
'end': forms.DateTimeInput(attrs={ 'end': forms.DateTimeInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_end', 'data-target': '#datetimepicker_end',
}), }),
} }
@ -259,7 +249,6 @@ class WeightForm(forms.ModelForm):
widgets = { widgets = {
'date': forms.DateInput(attrs={ 'date': forms.DateInput(attrs={
'readonly': 'readonly', 'readonly': 'readonly',
'class': 'datetimepicker-input',
'data-target': '#datetimepicker_date', 'data-target': '#datetimepicker_date',
}), }),
} }