adoralaura/shopping-list
1
0
Fork 0
mirror of https://github.com/tim-krehan/shopping-list.git synced 2024-11-23 22:30:41 +01:00
Code Issues Projects Releases Packages Wiki Activity

add custom checkboxes to list to fit with themes #2

Browse source
This commit is contained in:
Tim Krehan 2019-07-03 11:44:44 +02:00
parent 8c07907cc2
commit 0b77acc68d
4 changed files with 36 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
config/config.php
View file

@ -1,6 +1,9 @@
<?php
$CONFIG = array (
'installed' => false,
'installed' => true,
'host' => 'localhost',
'database' => 'list',
'username' => 'list',
'passwd' => 'Erfolg100%',
);
?>
?>

8
cont/list.php
View file

@ -33,7 +33,12 @@
}
print_r("<div class='list-row $div_item_row_classes $div_item_row_color_classes'>");
print_r("<div class='$div_item_checkbox_classes'><input type='checkbox' class='$input_item_checkbox_classes' data-color='$color_theme' data-id='$item->ID' $checked></div>");
print_r("<div class='$div_item_checkbox_classes'>");
print_r("<div class='custom-control custom-checkbox'>");
print_r("<input type='checkbox' class='$input_item_checkbox_classes custom-control-input' data-color='$color_theme' id='$item->ID-checkbox' data-id='$item->ID' $checked>");
print_r("<label class='custom-control-label' for='$item->ID-checkbox'></label>");
print_r("</div>");
print_r("</div>");
print_r("<div class='list-row-amount $div_item_quantity_classes' data-amount='$item->Anzahl' data-unit='$item->Einheit'>$item->Anzahl $item->Einheit</div>");
print_r("<div class='list-row-name $div_item_name_classes'>$item->Name</div>");
print_r("<div class='$div_item_menu dropdown'>");
@ -70,6 +75,5 @@
<button class="btn btn-outline-secondary" type="submit" id="button-addon2"><i class="fas fa-plus"></i></button>
</div>
</div>
</form>
</div>

32
js/list.js
View file

@ -16,7 +16,7 @@ function highlightNewEntry(){
if(match!=null){
var newID = match[1];
var checkBox = $(`[data-id='${newID}']`);
var newRow = checkBox.parent().parent();
var newRow = checkBox.parent().parent().parent();
newRow.removeClass($(checkBox).data("color"));
newRow.addClass("alert-primary");
setTimeout(function () {
@ -111,28 +111,28 @@ function checkItem() {
},
success: function () {
var color = $(dataIdSelector).data("color");
$(dataIdSelector).parent().parent().removeClass("bg-danger");
$(dataIdSelector).parent().parent().find(".dropdown-menu-button").removeClass("btn-danger");
$(dataIdSelector).parent().parent().parent().removeClass("bg-danger");
$(dataIdSelector).parent().parent().parent().find(".dropdown-menu-button").removeClass("btn-danger");
if($(dataIdSelector).prop("checked")){
$(dataIdSelector).parent().parent().removeClass(color);
$(dataIdSelector).parent().parent().addClass("bg-success");
$(dataIdSelector).parent().parent().parent().removeClass(color);
$(dataIdSelector).parent().parent().parent().addClass("bg-success");
}
else{
$(dataIdSelector).parent().parent().removeClass("bg-success");
$(dataIdSelector).parent().parent().addClass(color);
$(dataIdSelector).parent().parent().parent().removeClass("bg-success");
$(dataIdSelector).parent().parent().parent().addClass(color);
}
},
error: function () {
$(dataIdSelector).parent().parent().addClass("bg-danger");
$(dataIdSelector).parent().parent().data("toggle", "popover");
$(dataIdSelector).parent().parent().data("container", "body");
$(dataIdSelector).parent().parent().data("placement", "top");
$(dataIdSelector).parent().parent().data("html", true);
$(dataIdSelector).parent().parent().data("trigger", "focus");
$(dataIdSelector).parent().parent().data("content", "Dieses Element konnte nicht gespeichert werden.<br />Bitte die Seite Aktualisieren");
$(dataIdSelector).parent().parent().attr("title", "Fehler!");
$(dataIdSelector).parent().parent().popover('show');
$(dataIdSelector).parent().parent().parent().addClass("bg-danger");
$(dataIdSelector).parent().parent().parent().data("toggle", "popover");
$(dataIdSelector).parent().parent().parent().data("container", "body");
$(dataIdSelector).parent().parent().parent().data("placement", "top");
$(dataIdSelector).parent().parent().parent().data("html", true);
$(dataIdSelector).parent().parent().parent().data("trigger", "focus");
$(dataIdSelector).parent().parent().parent().data("content", "Dieses Element konnte nicht gespeichert werden.<br />Bitte die Seite Aktualisieren");
$(dataIdSelector).parent().parent().parent().attr("title", "Fehler!");
$(dataIdSelector).parent().parent().parent().popover('show');
}
});
}

15
style/themes/sketchy.css
View file

@ -7095,27 +7095,26 @@ select.form-control {
[type="checkbox"] {
position: relative;
-webkit-appearance: none;
appearance: none;
cursor: pointer; }
[type="checkbox"]:before {
content: "";
/* position: absolute; */
/* left: -1.2em; */
/* top: -0.9em; */
position: absolute;
left: -1.2em;
top: -0.9em;
display: inline-block;
width: 15px;
height: 16px;
border: 2px solid #fff;
border: 2px solid #333;
border-radius: 2px 8px 2px 4px / 5px 3px 5px 3px; }
[type="checkbox"]:checked:after {
content: "x";
position: absolute;
left: 3px;
/* top: -0.48em; */
left: -0.64em;
top: -0.48em;
font-size: 1.5rem;
line-height: 0.5;
color: #fff; }
color: #333; }
[type="checkbox"]:disabled:before {
border: 2px solid #aaa; }