juicyshfc.com
Open in
urlscan Pro
54.243.100.250
Public Scan
URL:
https://juicyshfc.com/
Submission: On October 30 via api from BE — Scanned from CA
Submission: On October 30 via api from BE — Scanned from CA
Form analysis 86 forms found in the DOM
Name: reservation-form — https://site.zingmyorder.com/website/sendmail/21678
<form action="https://site.zingmyorder.com/website/sendmail/21678" class="contact-form" id="reservation-form" name="reservation-form">
<label>Subject:</label>
<select class="form-control select2" name="cf_subject" id="cf_subject">
<option disabled="" selected="selected" required="" placeholder="Subject" value="Reservation">Reservation </option>
</select>
<input type="hidden" name="cf_subject" id="cf_subject" value="Reservation">
<input type="hidden" name="cf_tomail" id="cf_tomail">
<input type="hidden" name="cf_page" id="cf_page" value="reservation">
<input type="hidden" name="cf_rm" id="cf_rm" value="">
<div class="form-group">
<input type="text" data-validetta="required" name="cf_name" id="inputName_public36_reservation" class="form-control" placeholder="Your Name">
<span id="err_msg_name_public36_reservation" style="color: red;font-size:15px;"></span>
</div>
<div class="form-group">
<input type="text" data-validetta="required" name="cf_email" id="inputEmail_public36_reservation" class="form-control" placeholder="Your Email Address">
<span id="err_msg_email_public36_reservation" style="color: red;font-size:15px;"></span>
</div>
<div class="form-group">
<input type="text" data-validetta="required" name="cf_phone" id="inputPhone_public36_reservation" class="form-control" placeholder="Phone Number">
<span id="err_msg_phone_public36_reservation" style="color: red;font-size:15px;"></span>
</div>
<div class="form-group">
<input type="text" data-validetta="required" name="cf_guest" id="inputGuest_public36_reservation" class="form-control" placeholder="Number of guest">
<span id="err_msg_guest_public36_reservation" style="color: red;font-size:15px;"></span>
</div>
<div class="form-group">
<input type="date" data-validetta="required" name="cf_date" id="inputDate_public36_reservation" class="form-control" placeholder="Date" min="2024-10-30">
<span id="err_msg_date_public36_reservation" style="color: red;font-size:15px;"></span>
</div>
<div class="form-group">
<input type="time" data-validetta="required" name="cf_time" id="inputTime_public36_reservation" class="form-control" placeholder="Time">
<span id="err_msg_time_public36_reservation" style="color: red;font-size:15px;"></span>
</div>
<div class="form-group">
<textarea class="form-control" name="cf_message" placeholder="Message" rows="4"></textarea>
</div>
<div id="div_hide">
<div class="d-flex align-items-center mb-15">
<div id="div_capt" class="mr-20" style="max-width: 170px;">
<img id="img_captcha_public36_reservation" class="img-fluid" src="https://site.zingmyorder.com/image-captcha">
</div>
<i style="font-size: 17px; cursor: pointer;" class="fa fa-refresh" id="reload_captcha_public36_reservation" value="Reload"></i>
</div>
<div class="form-group">
<input required="" style="margin-top: 10px;" type="text" class="form-control" placeholder="Captcha*" id="captcha_public36_reservation" name="captcha">
<span id="reserve_err_msg_captcha" style="color: red;font-size:15px;"></span>
</div>
</div>
<div class="form-group text-center mt-30">
<button type="submit" id="reserve_btn" class="btn btn-secondary">Submit</button>
</div>
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Upload Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<!-- <label for="">Logo <sup></sup></label> -->
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for logo -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="logo">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#logo").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/logo/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_logo, response);
} else {
rendered = Mustache.render(template_file_logo, response);
}
$('#sortable_logo').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var logo_files = {
"7": {
"title": "Logo",
"caption": "Logo",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/151405233\/logo\/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg",
"desc": null,
"folder": "2024\/10\/24\/151405233\/logo",
"time": "2024-10-24 15:15:05",
"path": "website\/website\/2024\/10\/24\/151405233\/logo\/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg",
"file": "0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg"
}
};
var template_image_logo = $('#template_image_logo').html();
var template_file_logo = $('#template_file_logo').html();
Mustache.parse(template_image_logo);
Mustache.parse(template_file_logo);
var rendered = '';
var i = 1;
$.each(logo_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_logo, value);
} else {
rendered = rendered + Mustache.render(template_file_logo, value);
}
});
$('#sortable_logo').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_logo" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="logo[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="logo[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="logo[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="logo[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_logo" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="logo_{{i}}_title">Title</label>
<input type="text" class="form-control" id="logo_{{i}}_title" type="text" name="logo[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="logo_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="logo_{{i}}_caption" type="text" name="logo[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="logo_{{i}}_url">Url</label>
<input type="text" class="form-control" id="logo_{{i}}_url" type="text" name="logo[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="logo_{{i}}_desc">Description</label>
<textarea class="form-control" id="logo_{{i}}_desc" type="text" name="logo[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="logo[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="logo[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="logo[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="logo[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for logo -->
<input type="hidden" name="logo" value="0">
<div id="sortable_logo" class="image-editor">
<div class="img-box" id="image_box_7">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="logo_7_title">Title</label>
<input type="text" class="form-control" id="logo_7_title" name="logo[7][title]" value="Logo" placeholder="Image Title">
</div>
<div class="form-group">
<label for="logo_7_caption">Caption</label>
<input type="text" class="form-control" id="logo_7_caption" name="logo[7][caption]" value="Logo" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="logo_7_url">Url</label>
<input type="text" class="form-control" id="logo_7_url" name="logo[7][url]" value="Logo" placeholder="Image URL">
</div>
<div class="form-group">
<label for="logo_7_desc">Description</label>
<textarea class="form-control" id="logo_7_desc" type="text" name="logo[7][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="logo[7][folder]" value="2024/10/24/151405233/logo">
<input class="form-control" type="hidden" name="logo[7][time]" value="2024-10-24 15:15:05">
<input class="form-control" type="hidden" name="logo[7][path]" value="website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg">
<input class="form-control" type="hidden" name="logo[7][file]" value="0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_logo');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save Changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="logo-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-logo">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_logo" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_logo" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_logo">
<input class="form-control" type="hidden" name="logo" id="disable_logo" value="[]" disabled="">
<div class="img-box" id="image_box_logo_7" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="logo">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="logo[7][folder]" value="2024/10/24/151405233/logo">
<input class="form-control" type="hidden" name="logo[7][time]" value="2024-10-24 15:15:05">
<input class="form-control" type="hidden" name="logo[7][path]" value="website/website/2024/10/24/151405233/logo/0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg">
<input class="form-control" type="hidden" name="logo[7][file]" value="0FnHZOwdxdGaGUnjfvrdFjkfaK5BhAnhvTbbSojl.jpg">
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_logo" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="logo"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_logo" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="logo" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_logo">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_logo;
var x_logo = 7;
var $modal_logo;
var image_logo;
function destroyCropper() {
if (cropper_logo) {
cropper_logo.destroy();
cropper_logo = null;
image_logo.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_logo", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_logo", function() {
console.log('working');
image_logo = document.getElementById("image_logo");
image_logo.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_logo = new Cropper(image_logo, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_logo", function(e) {
destroyCropper();
$modal_logo = $("#modal_logo");
image_logo = document.getElementById("image_logo");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/logo/file";
var files_logo = e.target.files;
var done = function(url) {
$modal_logo.modal('show');
image_logo.src = url;
};
var reader;
var file;
if (files_logo && files_logo.length > 0) {
file = files_logo[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_logo.on('shown.bs.modal', function() {
// cropper_logo = new Cropper(image_logo, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_logo", function() {
var htm = '';
canvas_logo = cropper_logo.getCroppedCanvas({
width: "86.4",
height: "86.4",
});
if (canvas_logo) {
canvas_logo.toBlob(function(blob_logo) {
blob_logo.quality = 0.8;
url = URL.createObjectURL(blob_logo);
var reader = new FileReader();
reader.readAsDataURL(blob_logo);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_logo, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/logo/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_logo + 1;
htm = '<div class="img-box" id="image_box_logo_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' + xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="logo"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="logo[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="logo[' + x + '][time]"value="' + time_out + '"><input class="form-control" type="hidden" name="logo[' + x +
'][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="logo[' + x + '][file]"value="' + file_out + '"> </div></div>';
$("#upload_img_logo").append(htm);
x_logo = x + 1;
$modal_logo.modal('hide');
cropper_logo.destroy();
cropper_logo = null;
image_logo.src = '';
image_logo = null;
$('#disable_logo').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Logo</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openUploadModal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openCropModal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner Logo</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Logo <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="banner_logo-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-banner_logo">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_banner_logo" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_banner_logo" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_banner_logo">
<input class="form-control" type="hidden" name="banner_logo" id="disable_banner_logo" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_banner_logo" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="banner_logo"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_banner_logo" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="banner_logo" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_banner_logo">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_banner_logo;
var x_banner_logo = 1;
var $modal_banner_logo;
var image_banner_logo;
function destroyCropper() {
if (cropper_banner_logo) {
cropper_banner_logo.destroy();
cropper_banner_logo = null;
image_banner_logo.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_banner_logo", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_banner_logo", function() {
console.log('working');
image_banner_logo = document.getElementById("image_banner_logo");
image_banner_logo.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_banner_logo = new Cropper(image_banner_logo, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_banner_logo", function(e) {
destroyCropper();
$modal_banner_logo = $("#modal_banner_logo");
image_banner_logo = document.getElementById("image_banner_logo");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_logo/file";
var files_banner_logo = e.target.files;
var done = function(url) {
$modal_banner_logo.modal('show');
image_banner_logo.src = url;
};
var reader;
var file;
if (files_banner_logo && files_banner_logo.length > 0) {
file = files_banner_logo[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_banner_logo.on('shown.bs.modal', function() {
// cropper_banner_logo = new Cropper(image_banner_logo, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_banner_logo", function() {
var htm = '';
canvas_banner_logo = cropper_banner_logo.getCroppedCanvas({
width: "250",
height: "250",
});
if (canvas_banner_logo) {
canvas_banner_logo.toBlob(function(blob_banner_logo) {
blob_banner_logo.quality = 0.8;
url = URL.createObjectURL(blob_banner_logo);
var reader = new FileReader();
reader.readAsDataURL(blob_banner_logo);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_banner_logo, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_logo/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_banner_logo + 1;
htm = '<div class="img-box" id="image_box_banner_logo_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' + xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="banner_logo"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="banner_logo[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="banner_logo[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="banner_logo[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="banner_logo[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_banner_logo").append(htm);
x_banner_logo = x + 1;
$modal_banner_logo.modal('hide');
cropper_banner_logo.destroy();
cropper_banner_logo = null;
image_banner_logo.src = '';
image_banner_logo = null;
$('#disable_banner_logo').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner Logo</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Logo <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for banner_logo -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="banner_logo">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#banner_logo").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_logo/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_banner_logo, response);
} else {
rendered = Mustache.render(template_file_banner_logo, response);
}
$('#sortable_banner_logo').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var banner_logo_files = [];
var template_image_banner_logo = $('#template_image_banner_logo').html();
var template_file_banner_logo = $('#template_file_banner_logo').html();
Mustache.parse(template_image_banner_logo);
Mustache.parse(template_file_banner_logo);
var rendered = '';
var i = 1;
$.each(banner_logo_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_banner_logo, value);
} else {
rendered = rendered + Mustache.render(template_file_banner_logo, value);
}
});
$('#sortable_banner_logo').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_banner_logo" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="banner_logo[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="banner_logo[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="banner_logo[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="banner_logo[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_banner_logo" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_logo_{{i}}_title">Title</label>
<input type="text" class="form-control" id="banner_logo_{{i}}_title" type="text" name="banner_logo[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_logo_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="banner_logo_{{i}}_caption" type="text" name="banner_logo[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_logo_{{i}}_url">Url</label>
<input type="text" class="form-control" id="banner_logo_{{i}}_url" type="text" name="banner_logo[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_logo_{{i}}_desc">Description</label>
<textarea class="form-control" id="banner_logo_{{i}}_desc" type="text" name="banner_logo[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_logo[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="banner_logo[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="banner_logo[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="banner_logo[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for banner_logo -->
<input type="hidden" name="banner_logo" value="0">
<div id="sortable_banner_logo" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_banner_logo');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner Logo</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openbannerlogoUploadModal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openbannerlogoCropModal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openinnerbannerUploadModal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openinnerbannerCropModal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for inner_banner_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="inner_banner_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#inner_banner_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/inner_banner_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_inner_banner_image, response);
} else {
rendered = Mustache.render(template_file_inner_banner_image, response);
}
$('#sortable_inner_banner_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var inner_banner_image_files = {
"3": {
"title": "Adobestock 256297332",
"caption": "Adobestock 256297332",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/182027276\/inner_banner_image\/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg",
"desc": null,
"folder": "2024\/10\/24\/182027276\/inner_banner_image",
"time": "2024-10-24 18:24:20",
"path": "website\/websitehome\/2024\/10\/24\/182027276\/inner_banner_image\/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg",
"file": "yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg"
}
};
var template_image_inner_banner_image = $('#template_image_inner_banner_image').html();
var template_file_inner_banner_image = $('#template_file_inner_banner_image').html();
Mustache.parse(template_image_inner_banner_image);
Mustache.parse(template_file_inner_banner_image);
var rendered = '';
var i = 1;
$.each(inner_banner_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_inner_banner_image, value);
} else {
rendered = rendered + Mustache.render(template_file_inner_banner_image, value);
}
});
$('#sortable_inner_banner_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_inner_banner_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_inner_banner_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="inner_banner_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="inner_banner_image_{{i}}_title" type="text" name="inner_banner_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="inner_banner_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="inner_banner_image_{{i}}_caption" type="text" name="inner_banner_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="inner_banner_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="inner_banner_image_{{i}}_url" type="text" name="inner_banner_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="inner_banner_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="inner_banner_image_{{i}}_desc" type="text" name="inner_banner_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="inner_banner_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for inner_banner_image -->
<input type="hidden" name="inner_banner_image" value="0">
<div id="sortable_inner_banner_image" class="image-editor">
<div class="img-box" id="image_box_3">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="inner_banner_image_3_title">Title</label>
<input type="text" class="form-control" id="inner_banner_image_3_title" name="inner_banner_image[3][title]" value="Adobestock 256297332" placeholder="Image Title">
</div>
<div class="form-group">
<label for="inner_banner_image_3_caption">Caption</label>
<input type="text" class="form-control" id="inner_banner_image_3_caption" name="inner_banner_image[3][caption]" value="Adobestock 256297332" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="inner_banner_image_3_url">Url</label>
<input type="text" class="form-control" id="inner_banner_image_3_url" name="inner_banner_image[3][url]" value="Adobestock 256297332" placeholder="Image URL">
</div>
<div class="form-group">
<label for="inner_banner_image_3_desc">Description</label>
<textarea class="form-control" id="inner_banner_image_3_desc" type="text" name="inner_banner_image[3][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="inner_banner_image[3][folder]" value="2024/10/24/182027276/inner_banner_image">
<input class="form-control" type="hidden" name="inner_banner_image[3][time]" value="2024-10-24 18:24:20">
<input class="form-control" type="hidden" name="inner_banner_image[3][path]" value="website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg">
<input class="form-control" type="hidden" name="inner_banner_image[3][file]" value="yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_inner_banner_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="inner_banner_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-inner_banner_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_inner_banner_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_inner_banner_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_inner_banner_image">
<input class="form-control" type="hidden" name="inner_banner_image" id="disable_inner_banner_image" value="[]" disabled="">
<div class="img-box" id="image_box_inner_banner_image_3" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="inner_banner_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="inner_banner_image[3][folder]" value="2024/10/24/182027276/inner_banner_image">
<input class="form-control" type="hidden" name="inner_banner_image[3][time]" value="2024-10-24 18:24:20">
<input class="form-control" type="hidden" name="inner_banner_image[3][path]" value="website/websitehome/2024/10/24/182027276/inner_banner_image/yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg">
<input class="form-control" type="hidden" name="inner_banner_image[3][file]" value="yOSfUDEc2KfnP5nc7gX7dIeFBlWLPdbhaohMrIHB.jpg">
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_inner_banner_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="inner_banner_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_inner_banner_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="inner_banner_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_inner_banner_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_inner_banner_image;
var x_inner_banner_image = 3;
var $modal_inner_banner_image;
var image_inner_banner_image;
function destroyCropper() {
if (cropper_inner_banner_image) {
cropper_inner_banner_image.destroy();
cropper_inner_banner_image = null;
image_inner_banner_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_inner_banner_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_inner_banner_image", function() {
console.log('working');
image_inner_banner_image = document.getElementById("image_inner_banner_image");
image_inner_banner_image.onload = function() {
var params = "1/0.2965";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_inner_banner_image = new Cropper(image_inner_banner_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_inner_banner_image", function(e) {
destroyCropper();
$modal_inner_banner_image = $("#modal_inner_banner_image");
image_inner_banner_image = document.getElementById("image_inner_banner_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/inner_banner_image/file";
var files_inner_banner_image = e.target.files;
var done = function(url) {
$modal_inner_banner_image.modal('show');
image_inner_banner_image.src = url;
};
var reader;
var file;
if (files_inner_banner_image && files_inner_banner_image.length > 0) {
file = files_inner_banner_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_inner_banner_image.on('shown.bs.modal', function() {
// cropper_inner_banner_image = new Cropper(image_inner_banner_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_inner_banner_image", function() {
var htm = '';
canvas_inner_banner_image = cropper_inner_banner_image.getCroppedCanvas({
width: "1519.2",
height: "400",
});
if (canvas_inner_banner_image) {
canvas_inner_banner_image.toBlob(function(blob_inner_banner_image) {
blob_inner_banner_image.quality = 0.8;
url = URL.createObjectURL(blob_inner_banner_image);
var reader = new FileReader();
reader.readAsDataURL(blob_inner_banner_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_inner_banner_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/inner_banner_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_inner_banner_image + 1;
htm = '<div class="img-box" id="image_box_inner_banner_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="inner_banner_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="inner_banner_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="inner_banner_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="inner_banner_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="inner_banner_image[' + x +
'][file]"value="' + file_out + '"> </div></div>';
$("#upload_img_inner_banner_image").append(htm);
x_inner_banner_image = x + 1;
$modal_inner_banner_image.modal('hide');
cropper_inner_banner_image.destroy();
cropper_inner_banner_image = null;
image_inner_banner_image.src = '';
image_inner_banner_image = null;
$('#disable_inner_banner_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Gallery</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Gallery <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for website_gallery -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="website_gallery">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#website_gallery").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/website_gallery/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_website_gallery, response);
} else {
rendered = Mustache.render(template_file_website_gallery, response);
}
$('#sortable_website_gallery').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var website_gallery_files = {
"4": {
"title": "Adobestock 525336314",
"caption": "Adobestock 525336314",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/133509109\/website_gallery\/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg",
"desc": null,
"folder": "2024\/10\/24\/133509109\/website_gallery",
"time": "2024-10-24 13:43:08",
"path": "website\/website\/2024\/10\/24\/133509109\/website_gallery\/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg",
"file": "fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg"
},
"5": {
"title": "Adobestock 222189851",
"caption": "Adobestock 222189851",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/133509109\/website_gallery\/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg",
"desc": null,
"folder": "2024\/10\/24\/133509109\/website_gallery",
"time": "2024-10-24 13:43:09",
"path": "website\/website\/2024\/10\/24\/133509109\/website_gallery\/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg",
"file": "2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg"
},
"6": {
"title": "Adobestock 278725386",
"caption": "Adobestock 278725386",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/133509109\/website_gallery\/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg",
"desc": null,
"folder": "2024\/10\/24\/133509109\/website_gallery",
"time": "2024-10-24 13:43:11",
"path": "website\/website\/2024\/10\/24\/133509109\/website_gallery\/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg",
"file": "pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg"
},
"7": {
"title": "Adobestock 34575120",
"caption": "Adobestock 34575120",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/133509109\/website_gallery\/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg",
"desc": null,
"folder": "2024\/10\/24\/133509109\/website_gallery",
"time": "2024-10-24 13:43:12",
"path": "website\/website\/2024\/10\/24\/133509109\/website_gallery\/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg",
"file": "NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg"
},
"8": {
"title": "Adobestock 389156226",
"caption": "Adobestock 389156226",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/133509109\/website_gallery\/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg",
"desc": null,
"folder": "2024\/10\/24\/133509109\/website_gallery",
"time": "2024-10-24 13:43:13",
"path": "website\/website\/2024\/10\/24\/133509109\/website_gallery\/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg",
"file": "1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg"
},
"9": {
"title": "Adobestock 107510717",
"caption": "Adobestock 107510717",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/133509109\/website_gallery\/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg",
"desc": null,
"folder": "2024\/10\/24\/133509109\/website_gallery",
"time": "2024-10-24 13:43:14",
"path": "website\/website\/2024\/10\/24\/133509109\/website_gallery\/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg",
"file": "lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg"
}
};
var template_image_website_gallery = $('#template_image_website_gallery').html();
var template_file_website_gallery = $('#template_file_website_gallery').html();
Mustache.parse(template_image_website_gallery);
Mustache.parse(template_file_website_gallery);
var rendered = '';
var i = 1;
$.each(website_gallery_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_website_gallery, value);
} else {
rendered = rendered + Mustache.render(template_file_website_gallery, value);
}
});
$('#sortable_website_gallery').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_website_gallery" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="website_gallery[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="website_gallery[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="website_gallery[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="website_gallery[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_website_gallery" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_{{i}}_title">Title</label>
<input type="text" class="form-control" id="website_gallery_{{i}}_title" type="text" name="website_gallery[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_{{i}}_caption" type="text" name="website_gallery[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_{{i}}_url">Url</label>
<input type="text" class="form-control" id="website_gallery_{{i}}_url" type="text" name="website_gallery[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_{{i}}_desc">Description</label>
<textarea class="form-control" id="website_gallery_{{i}}_desc" type="text" name="website_gallery[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="website_gallery[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="website_gallery[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="website_gallery[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for website_gallery -->
<input type="hidden" name="website_gallery" value="0">
<div id="sortable_website_gallery" class="image-editor">
<div class="img-box" id="image_box_4">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_4_title">Title</label>
<input type="text" class="form-control" id="website_gallery_4_title" name="website_gallery[4][title]" value="Adobestock 525336314" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_4_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_4_caption" name="website_gallery[4][caption]" value="Adobestock 525336314" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_4_url">Url</label>
<input type="text" class="form-control" id="website_gallery_4_url" name="website_gallery[4][url]" value="Adobestock 525336314" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_4_desc">Description</label>
<textarea class="form-control" id="website_gallery_4_desc" type="text" name="website_gallery[4][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[4][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[4][time]" value="2024-10-24 13:43:08">
<input class="form-control" type="hidden" name="website_gallery[4][path]" value="website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg">
<input class="form-control" type="hidden" name="website_gallery[4][file]" value="fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg">
</div>
</div>
<div class="img-box" id="image_box_5">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_5_title">Title</label>
<input type="text" class="form-control" id="website_gallery_5_title" name="website_gallery[5][title]" value="Adobestock 222189851" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_5_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_5_caption" name="website_gallery[5][caption]" value="Adobestock 222189851" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_5_url">Url</label>
<input type="text" class="form-control" id="website_gallery_5_url" name="website_gallery[5][url]" value="Adobestock 222189851" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_5_desc">Description</label>
<textarea class="form-control" id="website_gallery_5_desc" type="text" name="website_gallery[5][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[5][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[5][time]" value="2024-10-24 13:43:09">
<input class="form-control" type="hidden" name="website_gallery[5][path]" value="website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg">
<input class="form-control" type="hidden" name="website_gallery[5][file]" value="2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg">
</div>
</div>
<div class="img-box" id="image_box_6">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_6_title">Title</label>
<input type="text" class="form-control" id="website_gallery_6_title" name="website_gallery[6][title]" value="Adobestock 278725386" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_6_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_6_caption" name="website_gallery[6][caption]" value="Adobestock 278725386" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_6_url">Url</label>
<input type="text" class="form-control" id="website_gallery_6_url" name="website_gallery[6][url]" value="Adobestock 278725386" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_6_desc">Description</label>
<textarea class="form-control" id="website_gallery_6_desc" type="text" name="website_gallery[6][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[6][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[6][time]" value="2024-10-24 13:43:11">
<input class="form-control" type="hidden" name="website_gallery[6][path]" value="website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg">
<input class="form-control" type="hidden" name="website_gallery[6][file]" value="pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg">
</div>
</div>
<div class="img-box" id="image_box_7">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_7_title">Title</label>
<input type="text" class="form-control" id="website_gallery_7_title" name="website_gallery[7][title]" value="Adobestock 34575120" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_7_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_7_caption" name="website_gallery[7][caption]" value="Adobestock 34575120" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_7_url">Url</label>
<input type="text" class="form-control" id="website_gallery_7_url" name="website_gallery[7][url]" value="Adobestock 34575120" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_7_desc">Description</label>
<textarea class="form-control" id="website_gallery_7_desc" type="text" name="website_gallery[7][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[7][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[7][time]" value="2024-10-24 13:43:12">
<input class="form-control" type="hidden" name="website_gallery[7][path]" value="website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg">
<input class="form-control" type="hidden" name="website_gallery[7][file]" value="NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg">
</div>
</div>
<div class="img-box" id="image_box_8">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_8_title">Title</label>
<input type="text" class="form-control" id="website_gallery_8_title" name="website_gallery[8][title]" value="Adobestock 389156226" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_8_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_8_caption" name="website_gallery[8][caption]" value="Adobestock 389156226" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_8_url">Url</label>
<input type="text" class="form-control" id="website_gallery_8_url" name="website_gallery[8][url]" value="Adobestock 389156226" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_8_desc">Description</label>
<textarea class="form-control" id="website_gallery_8_desc" type="text" name="website_gallery[8][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[8][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[8][time]" value="2024-10-24 13:43:13">
<input class="form-control" type="hidden" name="website_gallery[8][path]" value="website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg">
<input class="form-control" type="hidden" name="website_gallery[8][file]" value="1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg">
</div>
</div>
<div class="img-box" id="image_box_9">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="website_gallery_9_title">Title</label>
<input type="text" class="form-control" id="website_gallery_9_title" name="website_gallery[9][title]" value="Adobestock 107510717" placeholder="Image Title">
</div>
<div class="form-group">
<label for="website_gallery_9_caption">Caption</label>
<input type="text" class="form-control" id="website_gallery_9_caption" name="website_gallery[9][caption]" value="Adobestock 107510717" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="website_gallery_9_url">Url</label>
<input type="text" class="form-control" id="website_gallery_9_url" name="website_gallery[9][url]" value="Adobestock 107510717" placeholder="Image URL">
</div>
<div class="form-group">
<label for="website_gallery_9_desc">Description</label>
<textarea class="form-control" id="website_gallery_9_desc" type="text" name="website_gallery[9][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="website_gallery[9][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[9][time]" value="2024-10-24 13:43:14">
<input class="form-control" type="hidden" name="website_gallery[9][path]" value="website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg">
<input class="form-control" type="hidden" name="website_gallery[9][file]" value="lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_website_gallery');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Gallery</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Gallery <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="website_gallery-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-website_gallery">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_website_gallery" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_website_gallery" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_website_gallery">
<input class="form-control" type="hidden" name="website_gallery" id="disable_website_gallery" value="[]" disabled="">
<div class="img-box" id="image_box_website_gallery_4" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="website_gallery">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="website_gallery[4][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[4][time]" value="2024-10-24 13:43:08">
<input class="form-control" type="hidden" name="website_gallery[4][path]" value="website/website/2024/10/24/133509109/website_gallery/fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg">
<input class="form-control" type="hidden" name="website_gallery[4][file]" value="fDqP1Xz7myxyUKUcFF4d12WB0ek2qyleKpJZ2eOk.jpg">
</div>
</div>
<div class="img-box" id="image_box_website_gallery_5" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="website_gallery">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="website_gallery[5][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[5][time]" value="2024-10-24 13:43:09">
<input class="form-control" type="hidden" name="website_gallery[5][path]" value="website/website/2024/10/24/133509109/website_gallery/2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg">
<input class="form-control" type="hidden" name="website_gallery[5][file]" value="2z11PK6yw5hLE8gRnFc9kenYOujK8LSjulL8ECa3.jpg">
</div>
</div>
<div class="img-box" id="image_box_website_gallery_6" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="website_gallery">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="website_gallery[6][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[6][time]" value="2024-10-24 13:43:11">
<input class="form-control" type="hidden" name="website_gallery[6][path]" value="website/website/2024/10/24/133509109/website_gallery/pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg">
<input class="form-control" type="hidden" name="website_gallery[6][file]" value="pHkRzyi3MvWvQpWXT79DRMDUasFcEATASAWFEEsx.jpg">
</div>
</div>
<div class="img-box" id="image_box_website_gallery_7" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="website_gallery">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="website_gallery[7][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[7][time]" value="2024-10-24 13:43:12">
<input class="form-control" type="hidden" name="website_gallery[7][path]" value="website/website/2024/10/24/133509109/website_gallery/NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg">
<input class="form-control" type="hidden" name="website_gallery[7][file]" value="NJTA1mMLNkaRaOmR8v5br3EI51byaTLzDXIfINBl.jpg">
</div>
</div>
<div class="img-box" id="image_box_website_gallery_8" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="website_gallery">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="website_gallery[8][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[8][time]" value="2024-10-24 13:43:13">
<input class="form-control" type="hidden" name="website_gallery[8][path]" value="website/website/2024/10/24/133509109/website_gallery/1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg">
<input class="form-control" type="hidden" name="website_gallery[8][file]" value="1RAeCpXtrq3x0A16PYG7pnx0umoV4fDPbs3sqhCX.jpg">
</div>
</div>
<div class="img-box" id="image_box_website_gallery_9" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="website_gallery">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="website_gallery[9][folder]" value="2024/10/24/133509109/website_gallery">
<input class="form-control" type="hidden" name="website_gallery[9][time]" value="2024-10-24 13:43:14">
<input class="form-control" type="hidden" name="website_gallery[9][path]" value="website/website/2024/10/24/133509109/website_gallery/lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg">
<input class="form-control" type="hidden" name="website_gallery[9][file]" value="lhXoX6WbqHlUeW0qswMcBxjsHFLBDt6x9DfidsL0.jpg">
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_website_gallery" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="website_gallery"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_website_gallery" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="website_gallery" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_website_gallery">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_website_gallery;
var x_website_gallery = 9;
var $modal_website_gallery;
var image_website_gallery;
function destroyCropper() {
if (cropper_website_gallery) {
cropper_website_gallery.destroy();
cropper_website_gallery = null;
image_website_gallery.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_website_gallery", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_website_gallery", function() {
console.log('working');
image_website_gallery = document.getElementById("image_website_gallery");
image_website_gallery.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_website_gallery = new Cropper(image_website_gallery, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_website_gallery", function(e) {
destroyCropper();
$modal_website_gallery = $("#modal_website_gallery");
image_website_gallery = document.getElementById("image_website_gallery");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/website_gallery/file";
var files_website_gallery = e.target.files;
var done = function(url) {
$modal_website_gallery.modal('show');
image_website_gallery.src = url;
};
var reader;
var file;
if (files_website_gallery && files_website_gallery.length > 0) {
file = files_website_gallery[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_website_gallery.on('shown.bs.modal', function() {
// cropper_website_gallery = new Cropper(image_website_gallery, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_website_gallery", function() {
var htm = '';
canvas_website_gallery = cropper_website_gallery.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_website_gallery) {
canvas_website_gallery.toBlob(function(blob_website_gallery) {
blob_website_gallery.quality = 0.8;
url = URL.createObjectURL(blob_website_gallery);
var reader = new FileReader();
reader.readAsDataURL(blob_website_gallery);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_website_gallery, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/website_gallery/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_website_gallery + 1;
htm = '<div class="img-box" id="image_box_website_gallery_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="website_gallery"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="website_gallery[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="website_gallery[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="website_gallery[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="website_gallery[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_website_gallery").append(htm);
x_website_gallery = x + 1;
$modal_website_gallery.modal('hide');
cropper_website_gallery.destroy();
cropper_website_gallery = null;
image_website_gallery.src = '';
image_website_gallery = null;
$('#disable_website_gallery').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Gallery</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opengalleryuploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opengallerycropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Gallery</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Gallery Title</label>
<input type="text" name="gallery_title" placeholder="gallery title" value="" class="form-control">
</div>
</div>
<div class="form-group border-0">
<label for="">Gallery <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="gallery-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-gallery">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_gallery" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_gallery" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_gallery">
<input class="form-control" type="hidden" name="gallery" id="disable_gallery" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_gallery" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="gallery"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_gallery" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="gallery" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_gallery">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_gallery;
var x_gallery = 1;
var $modal_gallery;
var image_gallery;
function destroyCropper() {
if (cropper_gallery) {
cropper_gallery.destroy();
cropper_gallery = null;
image_gallery.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_gallery", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_gallery", function() {
console.log('working');
image_gallery = document.getElementById("image_gallery");
image_gallery.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_gallery = new Cropper(image_gallery, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_gallery", function(e) {
destroyCropper();
$modal_gallery = $("#modal_gallery");
image_gallery = document.getElementById("image_gallery");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/gallery/file";
var files_gallery = e.target.files;
var done = function(url) {
$modal_gallery.modal('show');
image_gallery.src = url;
};
var reader;
var file;
if (files_gallery && files_gallery.length > 0) {
file = files_gallery[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_gallery.on('shown.bs.modal', function() {
// cropper_gallery = new Cropper(image_gallery, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_gallery", function() {
var htm = '';
canvas_gallery = cropper_gallery.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_gallery) {
canvas_gallery.toBlob(function(blob_gallery) {
blob_gallery.quality = 0.8;
url = URL.createObjectURL(blob_gallery);
var reader = new FileReader();
reader.readAsDataURL(blob_gallery);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_gallery, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/gallery/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_gallery + 1;
htm = '<div class="img-box" id="image_box_gallery_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' + xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="gallery"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="gallery[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="gallery[' + x + '][time]"value="' + time_out + '"><input class="form-control" type="hidden" name="gallery[' +
x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="gallery[' + x + '][file]"value="' + file_out + '"> </div></div>';
$("#upload_img_gallery").append(htm);
x_gallery = x + 1;
$modal_gallery.modal('hide');
cropper_gallery.destroy();
cropper_gallery = null;
image_gallery.src = '';
image_gallery = null;
$('#disable_gallery').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="d-flex align-items-center mb-3">
<div class="form-check form-switch">
<input class="form-check-input" type="radio" role="switch" name="banner_type" value="video" id="banner_1">
<label class="custom-control-label" style="padding-right:20px;" for="banner_1">Banner Video</label>
</div>
<div class="form-check form-switch" style="padding-right: 20px;">
<input class="form-check-input" type="radio" name="banner_type" role="switch" value="image" checked="" id="banner_2">
<label class="custom-control-label" for="banner_2">Banner Image</label>
</div>
</div>
</div>
<div id="banner_video" style="display: none;">
<div class="form-group border-0">
<div class="form-group">
<label>Banner Video Url</label>
<input type="text" placeholder="example: https://www.youtube.com/watch?v=yourvideoid" class="form-control" name="banner_video" value="">
</div>
</div>
<div class="form-group border-0">
<div class="form-group">
<label>Mobile Banner Video Url</label>
<input type="text" placeholder="example: https://www.youtube.com/watch?v=yourvideoid" class="form-control" name="mobile_banner_video" value="">
</div>
</div>
</div>
<div id="banner_image" style="display: block;" class="dz-clickable">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openbanneruploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span>Upload</span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openbannercropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span>Crop</span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for banner_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="banner_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#banner_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_banner_image, response);
} else {
rendered = Mustache.render(template_file_banner_image, response);
}
$('#sortable_banner_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var banner_image_files = {
"2": {
"title": "Adobestock 479348434",
"caption": "Adobestock 479348434",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/131028504\/banner_image\/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg",
"desc": null,
"folder": "2024\/10\/24\/131028504\/banner_image",
"time": "2024-10-24 13:12:42",
"path": "website\/website\/2024\/10\/24\/131028504\/banner_image\/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg",
"file": "Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg"
},
"3": {
"title": "Adobestock 334907376",
"caption": "Adobestock 334907376",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/131244556\/banner_image\/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg",
"desc": null,
"folder": "2024\/10\/24\/131244556\/banner_image",
"time": "2024-10-24 13:14:47",
"path": "website\/website\/2024\/10\/24\/131244556\/banner_image\/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg",
"file": "y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg"
},
"4": {
"title": "Adobestock 190270812",
"caption": "Adobestock 190270812",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/132127889\/banner_image\/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg",
"desc": null,
"folder": "2024\/10\/24\/132127889\/banner_image",
"time": "2024-10-24 13:24:15",
"path": "website\/website\/2024\/10\/24\/132127889\/banner_image\/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg",
"file": "AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg"
}
};
var template_image_banner_image = $('#template_image_banner_image').html();
var template_file_banner_image = $('#template_file_banner_image').html();
Mustache.parse(template_image_banner_image);
Mustache.parse(template_file_banner_image);
var rendered = '';
var i = 1;
$.each(banner_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_banner_image, value);
} else {
rendered = rendered + Mustache.render(template_file_banner_image, value);
}
});
$('#sortable_banner_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_banner_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="banner_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="banner_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="banner_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="banner_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_banner_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="banner_image_{{i}}_title" type="text" name="banner_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="banner_image_{{i}}_caption" type="text" name="banner_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="banner_image_{{i}}_url" type="text" name="banner_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="banner_image_{{i}}_desc" type="text" name="banner_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="banner_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="banner_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="banner_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for banner_image -->
<input type="hidden" name="banner_image" value="0">
<div id="sortable_banner_image" class="image-editor">
<div class="img-box" id="image_box_2">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_image_2_title">Title</label>
<input type="text" class="form-control" id="banner_image_2_title" name="banner_image[2][title]" value="Adobestock 479348434" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_image_2_caption">Caption</label>
<input type="text" class="form-control" id="banner_image_2_caption" name="banner_image[2][caption]" value="Adobestock 479348434" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_image_2_url">Url</label>
<input type="text" class="form-control" id="banner_image_2_url" name="banner_image[2][url]" value="Adobestock 479348434" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_image_2_desc">Description</label>
<textarea class="form-control" id="banner_image_2_desc" type="text" name="banner_image[2][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_image[2][folder]" value="2024/10/24/131028504/banner_image">
<input class="form-control" type="hidden" name="banner_image[2][time]" value="2024-10-24 13:12:42">
<input class="form-control" type="hidden" name="banner_image[2][path]" value="website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg">
<input class="form-control" type="hidden" name="banner_image[2][file]" value="Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg">
</div>
</div>
<div class="img-box" id="image_box_3">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_image_3_title">Title</label>
<input type="text" class="form-control" id="banner_image_3_title" name="banner_image[3][title]" value="Adobestock 334907376" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_image_3_caption">Caption</label>
<input type="text" class="form-control" id="banner_image_3_caption" name="banner_image[3][caption]" value="Adobestock 334907376" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_image_3_url">Url</label>
<input type="text" class="form-control" id="banner_image_3_url" name="banner_image[3][url]" value="Adobestock 334907376" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_image_3_desc">Description</label>
<textarea class="form-control" id="banner_image_3_desc" type="text" name="banner_image[3][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_image[3][folder]" value="2024/10/24/131244556/banner_image">
<input class="form-control" type="hidden" name="banner_image[3][time]" value="2024-10-24 13:14:47">
<input class="form-control" type="hidden" name="banner_image[3][path]" value="website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg">
<input class="form-control" type="hidden" name="banner_image[3][file]" value="y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg">
</div>
</div>
<div class="img-box" id="image_box_4">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_image_4_title">Title</label>
<input type="text" class="form-control" id="banner_image_4_title" name="banner_image[4][title]" value="Adobestock 190270812" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_image_4_caption">Caption</label>
<input type="text" class="form-control" id="banner_image_4_caption" name="banner_image[4][caption]" value="Adobestock 190270812" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_image_4_url">Url</label>
<input type="text" class="form-control" id="banner_image_4_url" name="banner_image[4][url]" value="Adobestock 190270812" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_image_4_desc">Description</label>
<textarea class="form-control" id="banner_image_4_desc" type="text" name="banner_image[4][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_image[4][folder]" value="2024/10/24/132127889/banner_image">
<input class="form-control" type="hidden" name="banner_image[4][time]" value="2024-10-24 13:24:15">
<input class="form-control" type="hidden" name="banner_image[4][path]" value="website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg">
<input class="form-control" type="hidden" name="banner_image[4][file]" value="AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_banner_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
<div class="form-group border-0">
<label for="">Mobile Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for banner_mobile_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="banner_mobile_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#banner_mobile_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_mobile_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_banner_mobile_image, response);
} else {
rendered = Mustache.render(template_file_banner_mobile_image, response);
}
$('#sortable_banner_mobile_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var banner_mobile_image_files = {
"2": {
"title": "Adobestock 194415110",
"caption": "Adobestock 194415110",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/132418393\/banner_mobile_image\/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg",
"desc": null,
"folder": "2024\/10\/24\/132418393\/banner_mobile_image",
"time": "2024-10-24 13:28:05",
"path": "website\/website\/2024\/10\/24\/132418393\/banner_mobile_image\/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg",
"file": "TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg"
},
"3": {
"title": "Adobestock 190271296",
"caption": "Adobestock 190271296",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/132418393\/banner_mobile_image\/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg",
"desc": null,
"folder": "2024\/10\/24\/132418393\/banner_mobile_image",
"time": "2024-10-24 13:28:07",
"path": "website\/website\/2024\/10\/24\/132418393\/banner_mobile_image\/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg",
"file": "eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg"
},
"4": {
"title": "Adobestock 481385779",
"caption": "Adobestock 481385779",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/132418393\/banner_mobile_image\/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg",
"desc": null,
"folder": "2024\/10\/24\/132418393\/banner_mobile_image",
"time": "2024-10-24 13:28:08",
"path": "website\/website\/2024\/10\/24\/132418393\/banner_mobile_image\/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg",
"file": "vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg"
}
};
var template_image_banner_mobile_image = $('#template_image_banner_mobile_image').html();
var template_file_banner_mobile_image = $('#template_file_banner_mobile_image').html();
Mustache.parse(template_image_banner_mobile_image);
Mustache.parse(template_file_banner_mobile_image);
var rendered = '';
var i = 1;
$.each(banner_mobile_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_banner_mobile_image, value);
} else {
rendered = rendered + Mustache.render(template_file_banner_mobile_image, value);
}
});
$('#sortable_banner_mobile_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_banner_mobile_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_banner_mobile_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_mobile_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="banner_mobile_image_{{i}}_title" type="text" name="banner_mobile_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_mobile_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="banner_mobile_image_{{i}}_caption" type="text" name="banner_mobile_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_mobile_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="banner_mobile_image_{{i}}_url" type="text" name="banner_mobile_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_mobile_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="banner_mobile_image_{{i}}_desc" type="text" name="banner_mobile_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="banner_mobile_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for banner_mobile_image -->
<input type="hidden" name="banner_mobile_image" value="0">
<div id="sortable_banner_mobile_image" class="image-editor">
<div class="img-box" id="image_box_2">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_mobile_image_2_title">Title</label>
<input type="text" class="form-control" id="banner_mobile_image_2_title" name="banner_mobile_image[2][title]" value="Adobestock 194415110" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_mobile_image_2_caption">Caption</label>
<input type="text" class="form-control" id="banner_mobile_image_2_caption" name="banner_mobile_image[2][caption]" value="Adobestock 194415110" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_mobile_image_2_url">Url</label>
<input type="text" class="form-control" id="banner_mobile_image_2_url" name="banner_mobile_image[2][url]" value="Adobestock 194415110" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_mobile_image_2_desc">Description</label>
<textarea class="form-control" id="banner_mobile_image_2_desc" type="text" name="banner_mobile_image[2][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_mobile_image[2][folder]" value="2024/10/24/132418393/banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image[2][time]" value="2024-10-24 13:28:05">
<input class="form-control" type="hidden" name="banner_mobile_image[2][path]" value="website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg">
<input class="form-control" type="hidden" name="banner_mobile_image[2][file]" value="TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg">
</div>
</div>
<div class="img-box" id="image_box_3">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_mobile_image_3_title">Title</label>
<input type="text" class="form-control" id="banner_mobile_image_3_title" name="banner_mobile_image[3][title]" value="Adobestock 190271296" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_mobile_image_3_caption">Caption</label>
<input type="text" class="form-control" id="banner_mobile_image_3_caption" name="banner_mobile_image[3][caption]" value="Adobestock 190271296" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_mobile_image_3_url">Url</label>
<input type="text" class="form-control" id="banner_mobile_image_3_url" name="banner_mobile_image[3][url]" value="Adobestock 190271296" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_mobile_image_3_desc">Description</label>
<textarea class="form-control" id="banner_mobile_image_3_desc" type="text" name="banner_mobile_image[3][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_mobile_image[3][folder]" value="2024/10/24/132418393/banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image[3][time]" value="2024-10-24 13:28:07">
<input class="form-control" type="hidden" name="banner_mobile_image[3][path]" value="website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg">
<input class="form-control" type="hidden" name="banner_mobile_image[3][file]" value="eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg">
</div>
</div>
<div class="img-box" id="image_box_4">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="banner_mobile_image_4_title">Title</label>
<input type="text" class="form-control" id="banner_mobile_image_4_title" name="banner_mobile_image[4][title]" value="Adobestock 481385779" placeholder="Image Title">
</div>
<div class="form-group">
<label for="banner_mobile_image_4_caption">Caption</label>
<input type="text" class="form-control" id="banner_mobile_image_4_caption" name="banner_mobile_image[4][caption]" value="Adobestock 481385779" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="banner_mobile_image_4_url">Url</label>
<input type="text" class="form-control" id="banner_mobile_image_4_url" name="banner_mobile_image[4][url]" value="Adobestock 481385779" placeholder="Image URL">
</div>
<div class="form-group">
<label for="banner_mobile_image_4_desc">Description</label>
<textarea class="form-control" id="banner_mobile_image_4_desc" type="text" name="banner_mobile_image[4][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="banner_mobile_image[4][folder]" value="2024/10/24/132418393/banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image[4][time]" value="2024-10-24 13:28:08">
<input class="form-control" type="hidden" name="banner_mobile_image[4][path]" value="website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg">
<input class="form-control" type="hidden" name="banner_mobile_image[4][file]" value="vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_banner_mobile_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="banner_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-banner_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_banner_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_banner_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_banner_image">
<input class="form-control" type="hidden" name="banner_image" id="disable_banner_image" value="[]" disabled="">
<div class="img-box" id="image_box_banner_image_2" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="banner_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="banner_image[2][folder]" value="2024/10/24/131028504/banner_image">
<input class="form-control" type="hidden" name="banner_image[2][time]" value="2024-10-24 13:12:42">
<input class="form-control" type="hidden" name="banner_image[2][path]" value="website/website/2024/10/24/131028504/banner_image/Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg">
<input class="form-control" type="hidden" name="banner_image[2][file]" value="Nd23F62s0sSEaWUA2GkxgFPPUEoIVKmCAZkSiAAa.jpg">
</div>
</div>
<div class="img-box" id="image_box_banner_image_3" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="banner_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="banner_image[3][folder]" value="2024/10/24/131244556/banner_image">
<input class="form-control" type="hidden" name="banner_image[3][time]" value="2024-10-24 13:14:47">
<input class="form-control" type="hidden" name="banner_image[3][path]" value="website/website/2024/10/24/131244556/banner_image/y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg">
<input class="form-control" type="hidden" name="banner_image[3][file]" value="y5J0Pqm5lRHqqUkmOwuyvtlIODFwcYAczYC46oll.jpg">
</div>
</div>
<div class="img-box" id="image_box_banner_image_4" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="banner_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="banner_image[4][folder]" value="2024/10/24/132127889/banner_image">
<input class="form-control" type="hidden" name="banner_image[4][time]" value="2024-10-24 13:24:15">
<input class="form-control" type="hidden" name="banner_image[4][path]" value="website/website/2024/10/24/132127889/banner_image/AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg">
<input class="form-control" type="hidden" name="banner_image[4][file]" value="AQ8I2NuIhjBjBlbe2irUgipTihOdjq9dam21mKRu.jpg">
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_banner_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="banner_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_banner_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="banner_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_banner_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_banner_image;
var x_banner_image = 4;
var $modal_banner_image;
var image_banner_image;
function destroyCropper() {
if (cropper_banner_image) {
cropper_banner_image.destroy();
cropper_banner_image = null;
image_banner_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_banner_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_banner_image", function() {
console.log('working');
image_banner_image = document.getElementById("image_banner_image");
image_banner_image.onload = function() {
var params = "1/0.5625";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_banner_image = new Cropper(image_banner_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_banner_image", function(e) {
destroyCropper();
$modal_banner_image = $("#modal_banner_image");
image_banner_image = document.getElementById("image_banner_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_image/file";
var files_banner_image = e.target.files;
var done = function(url) {
$modal_banner_image.modal('show');
image_banner_image.src = url;
};
var reader;
var file;
if (files_banner_image && files_banner_image.length > 0) {
file = files_banner_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_banner_image.on('shown.bs.modal', function() {
// cropper_banner_image = new Cropper(image_banner_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_banner_image", function() {
var htm = '';
canvas_banner_image = cropper_banner_image.getCroppedCanvas({
width: "1519.2",
height: "400",
});
if (canvas_banner_image) {
canvas_banner_image.toBlob(function(blob_banner_image) {
blob_banner_image.quality = 0.8;
url = URL.createObjectURL(blob_banner_image);
var reader = new FileReader();
reader.readAsDataURL(blob_banner_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_banner_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_banner_image + 1;
htm = '<div class="img-box" id="image_box_banner_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' + xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="banner_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="banner_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="banner_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="banner_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="banner_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_banner_image").append(htm);
x_banner_image = x + 1;
$modal_banner_image.modal('hide');
cropper_banner_image.destroy();
cropper_banner_image = null;
image_banner_image.src = '';
image_banner_image = null;
$('#disable_banner_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
<div class="form-group border-0">
<label for="">Mobile Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="banner_mobile_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-banner_mobile_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_banner_mobile_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_banner_mobile_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image" id="disable_banner_mobile_image" value="[]" disabled="">
<div class="img-box" id="image_box_banner_mobile_image_2" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="banner_mobile_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="banner_mobile_image[2][folder]" value="2024/10/24/132418393/banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image[2][time]" value="2024-10-24 13:28:05">
<input class="form-control" type="hidden" name="banner_mobile_image[2][path]" value="website/website/2024/10/24/132418393/banner_mobile_image/TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg">
<input class="form-control" type="hidden" name="banner_mobile_image[2][file]" value="TplwUnYEBHYvT3BWk7prqrkKSN7tnAwupXLIPzWq.jpg">
</div>
</div>
<div class="img-box" id="image_box_banner_mobile_image_3" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="banner_mobile_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="banner_mobile_image[3][folder]" value="2024/10/24/132418393/banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image[3][time]" value="2024-10-24 13:28:07">
<input class="form-control" type="hidden" name="banner_mobile_image[3][path]" value="website/website/2024/10/24/132418393/banner_mobile_image/eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg">
<input class="form-control" type="hidden" name="banner_mobile_image[3][file]" value="eB0rEGQ2fUCizQbaJXwHou2XAvVikC3mmJUJ0t0z.jpg">
</div>
</div>
<div class="img-box" id="image_box_banner_mobile_image_4" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="banner_mobile_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="banner_mobile_image[4][folder]" value="2024/10/24/132418393/banner_mobile_image">
<input class="form-control" type="hidden" name="banner_mobile_image[4][time]" value="2024-10-24 13:28:08">
<input class="form-control" type="hidden" name="banner_mobile_image[4][path]" value="website/website/2024/10/24/132418393/banner_mobile_image/vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg">
<input class="form-control" type="hidden" name="banner_mobile_image[4][file]" value="vEWmKeWnaBEn2wJLoyqfagsJKupBfmZ2vsDQjupt.jpg">
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_banner_mobile_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="banner_mobile_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_banner_mobile_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="banner_mobile_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_banner_mobile_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_banner_mobile_image;
var x_banner_mobile_image = 4;
var $modal_banner_mobile_image;
var image_banner_mobile_image;
function destroyCropper() {
if (cropper_banner_mobile_image) {
cropper_banner_mobile_image.destroy();
cropper_banner_mobile_image = null;
image_banner_mobile_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_banner_mobile_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_banner_mobile_image", function() {
console.log('working');
image_banner_mobile_image = document.getElementById("image_banner_mobile_image");
image_banner_mobile_image.onload = function() {
var params = "0.6157/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_banner_mobile_image = new Cropper(image_banner_mobile_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_banner_mobile_image", function(e) {
destroyCropper();
$modal_banner_mobile_image = $("#modal_banner_mobile_image");
image_banner_mobile_image = document.getElementById("image_banner_mobile_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_mobile_image/file";
var files_banner_mobile_image = e.target.files;
var done = function(url) {
$modal_banner_mobile_image.modal('show');
image_banner_mobile_image.src = url;
};
var reader;
var file;
if (files_banner_mobile_image && files_banner_mobile_image.length > 0) {
file = files_banner_mobile_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_banner_mobile_image.on('shown.bs.modal', function() {
// cropper_banner_mobile_image = new Cropper(image_banner_mobile_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_banner_mobile_image", function() {
var htm = '';
canvas_banner_mobile_image = cropper_banner_mobile_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_banner_mobile_image) {
canvas_banner_mobile_image.toBlob(function(blob_banner_mobile_image) {
blob_banner_mobile_image.quality = 0.8;
url = URL.createObjectURL(blob_banner_mobile_image);
var reader = new FileReader();
reader.readAsDataURL(blob_banner_mobile_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_banner_mobile_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/banner_mobile_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_banner_mobile_image + 1;
htm = '<div class="img-box" id="image_box_banner_mobile_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="banner_mobile_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="banner_mobile_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="banner_mobile_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="banner_mobile_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="banner_mobile_image[' + x +
'][file]"value="' + file_out + '"> </div></div>';
$("#upload_img_banner_mobile_image").append(htm);
x_banner_mobile_image = x + 1;
$modal_banner_mobile_image.modal('hide');
cropper_banner_mobile_image.destroy();
cropper_banner_mobile_image = null;
image_banner_mobile_image.src = '';
image_banner_mobile_image = null;
$('#disable_banner_mobile_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Banner Video</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="form-group">
<label>Banner Video Url</label>
<input type="text" placeholder="example: https://www.youtube.com/watch?v=yourvideoid" class="form-control" name="banner_video" value="">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for specialities_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="specialities_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#specialities_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/specialities_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_specialities_image, response);
} else {
rendered = Mustache.render(template_file_specialities_image, response);
}
$('#sortable_specialities_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var specialities_image_files = {
"3": {
"title": "Adobestock 236948807",
"caption": "Adobestock 236948807",
"url": "https:\/\/site.zingmyorder.com\/download\/2024\/10\/24\/181859593\/specialities_image\/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg",
"desc": null,
"folder": "2024\/10\/24\/181859593\/specialities_image",
"time": "2024-10-24 18:20:01",
"path": "website\/website\/2024\/10\/24\/181859593\/specialities_image\/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg",
"file": "5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg"
}
};
var template_image_specialities_image = $('#template_image_specialities_image').html();
var template_file_specialities_image = $('#template_file_specialities_image').html();
Mustache.parse(template_image_specialities_image);
Mustache.parse(template_file_specialities_image);
var rendered = '';
var i = 1;
$.each(specialities_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_specialities_image, value);
} else {
rendered = rendered + Mustache.render(template_file_specialities_image, value);
}
});
$('#sortable_specialities_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_specialities_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="specialities_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="specialities_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="specialities_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="specialities_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_specialities_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="specialities_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="specialities_image_{{i}}_title" type="text" name="specialities_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="specialities_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="specialities_image_{{i}}_caption" type="text" name="specialities_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="specialities_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="specialities_image_{{i}}_url" type="text" name="specialities_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="specialities_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="specialities_image_{{i}}_desc" type="text" name="specialities_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="specialities_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="specialities_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="specialities_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="specialities_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for specialities_image -->
<input type="hidden" name="specialities_image" value="0">
<div id="sortable_specialities_image" class="image-editor">
<div class="img-box" id="image_box_3">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="specialities_image_3_title">Title</label>
<input type="text" class="form-control" id="specialities_image_3_title" name="specialities_image[3][title]" value="Adobestock 236948807" placeholder="Image Title">
</div>
<div class="form-group">
<label for="specialities_image_3_caption">Caption</label>
<input type="text" class="form-control" id="specialities_image_3_caption" name="specialities_image[3][caption]" value="Adobestock 236948807" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="specialities_image_3_url">Url</label>
<input type="text" class="form-control" id="specialities_image_3_url" name="specialities_image[3][url]" value="Adobestock 236948807" placeholder="Image URL">
</div>
<div class="form-group">
<label for="specialities_image_3_desc">Description</label>
<textarea class="form-control" id="specialities_image_3_desc" type="text" name="specialities_image[3][desc]" placeholder="Image Description" rows="5"></textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="specialities_image[3][folder]" value="2024/10/24/181859593/specialities_image">
<input class="form-control" type="hidden" name="specialities_image[3][time]" value="2024-10-24 18:20:01">
<input class="form-control" type="hidden" name="specialities_image[3][path]" value="website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg">
<input class="form-control" type="hidden" name="specialities_image[3][file]" value="5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg">
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_specialities_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Banner Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="specialities_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-specialities_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_specialities_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_specialities_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_specialities_image">
<input class="form-control" type="hidden" name="specialities_image" id="disable_specialities_image" value="[]" disabled="">
<div class="img-box" id="image_box_specialities_image_3" style="padding: 8px">
<div class="img-container">
<a class="box-img" href="https://site.zingmyorder.com/image/original/website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg" target="_blank">
<img src="https://site.zingmyorder.com/image/xs/website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="remove-image" data-content="specialities_image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper">
<input class="form-control" type="hidden" name="specialities_image[3][folder]" value="2024/10/24/181859593/specialities_image">
<input class="form-control" type="hidden" name="specialities_image[3][time]" value="2024-10-24 18:20:01">
<input class="form-control" type="hidden" name="specialities_image[3][path]" value="website/website/2024/10/24/181859593/specialities_image/5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg">
<input class="form-control" type="hidden" name="specialities_image[3][file]" value="5JiNYAtWv3uJPJTM1S78uATKnZ09rk8f3vWa87ug.jpg">
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_specialities_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="specialities_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_specialities_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="specialities_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_specialities_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_specialities_image;
var x_specialities_image = 3;
var $modal_specialities_image;
var image_specialities_image;
function destroyCropper() {
if (cropper_specialities_image) {
cropper_specialities_image.destroy();
cropper_specialities_image = null;
image_specialities_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_specialities_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_specialities_image", function() {
console.log('working');
image_specialities_image = document.getElementById("image_specialities_image");
image_specialities_image.onload = function() {
var params = "1/0.6071";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_specialities_image = new Cropper(image_specialities_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_specialities_image", function(e) {
destroyCropper();
$modal_specialities_image = $("#modal_specialities_image");
image_specialities_image = document.getElementById("image_specialities_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/specialities_image/file";
var files_specialities_image = e.target.files;
var done = function(url) {
$modal_specialities_image.modal('show');
image_specialities_image.src = url;
};
var reader;
var file;
if (files_specialities_image && files_specialities_image.length > 0) {
file = files_specialities_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_specialities_image.on('shown.bs.modal', function() {
// cropper_specialities_image = new Cropper(image_specialities_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_specialities_image", function() {
var htm = '';
canvas_specialities_image = cropper_specialities_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_specialities_image) {
canvas_specialities_image.toBlob(function(blob_specialities_image) {
blob_specialities_image.quality = 0.8;
url = URL.createObjectURL(blob_specialities_image);
var reader = new FileReader();
reader.readAsDataURL(blob_specialities_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_specialities_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.website.model/2024/10/24/182431404/specialities_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_specialities_image + 1;
htm = '<div class="img-box" id="image_box_specialities_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="specialities_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="specialities_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="specialities_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="specialities_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="specialities_image[' + x +
'][file]"value="' + file_out + '"> </div></div>';
$("#upload_img_specialities_image").append(htm);
x_specialities_image = x + 1;
$modal_specialities_image.modal('hide');
cropper_specialities_image.destroy();
cropper_specialities_image = null;
image_specialities_image.src = '';
image_specialities_image = null;
$('#disable_specialities_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openaboutbanneruploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openaboutbannercropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/theme/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/theme/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Review Background Colour</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<label for="theme_color">Background color</label>
<div class="input-group mb-3 colorpicker-element" id="review_bg_color" data-colorpicker-id="1">
<input name="review_bg_color" type="text" class="form-control" value="" style="width: auto;">
<span class="input-group-text colorpicker-input-addon" data-bs-original-title="" title="" tabindex="0"><i style="background: rgb(0, 0, 0);"></i></span>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/theme/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/theme/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Review Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for review_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="review_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#review_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitetheme.model/2024/10/24/182431682/review_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_review_image, response);
} else {
rendered = Mustache.render(template_file_review_image, response);
}
$('#sortable_review_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var review_image_files = [];
var template_image_review_image = $('#template_image_review_image').html();
var template_file_review_image = $('#template_file_review_image').html();
Mustache.parse(template_image_review_image);
Mustache.parse(template_file_review_image);
var rendered = '';
var i = 1;
$.each(review_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_review_image, value);
} else {
rendered = rendered + Mustache.render(template_file_review_image, value);
}
});
$('#sortable_review_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_review_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="review_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="review_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="review_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="review_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_review_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="review_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="review_image_{{i}}_title" type="text" name="review_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="review_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="review_image_{{i}}_caption" type="text" name="review_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="review_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="review_image_{{i}}_url" type="text" name="review_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="review_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="review_image_{{i}}_desc" type="text" name="review_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="review_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="review_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="review_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="review_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for review_image -->
<input type="hidden" name="review_image" value="0">
<div id="sortable_review_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_review_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/theme/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/theme/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Review Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="review_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-review_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_review_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_review_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_review_image">
<input class="form-control" type="hidden" name="review_image" id="disable_review_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_review_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="review_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_review_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="review_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_review_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_review_image;
var x_review_image = 1;
var $modal_review_image;
var image_review_image;
function destroyCropper() {
if (cropper_review_image) {
cropper_review_image.destroy();
cropper_review_image = null;
image_review_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_review_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_review_image", function() {
console.log('working');
image_review_image = document.getElementById("image_review_image");
image_review_image.onload = function() {
var params = "1/0.4444";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_review_image = new Cropper(image_review_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_review_image", function(e) {
destroyCropper();
$modal_review_image = $("#modal_review_image");
image_review_image = document.getElementById("image_review_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitetheme.model/2024/10/24/182431682/review_image/file";
var files_review_image = e.target.files;
var done = function(url) {
$modal_review_image.modal('show');
image_review_image.src = url;
};
var reader;
var file;
if (files_review_image && files_review_image.length > 0) {
file = files_review_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_review_image.on('shown.bs.modal', function() {
// cropper_review_image = new Cropper(image_review_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_review_image", function() {
var htm = '';
canvas_review_image = cropper_review_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_review_image) {
canvas_review_image.toBlob(function(blob_review_image) {
blob_review_image.quality = 0.8;
url = URL.createObjectURL(blob_review_image);
var reader = new FileReader();
reader.readAsDataURL(blob_review_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_review_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitetheme.model/2024/10/24/182431682/review_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_review_image + 1;
htm = '<div class="img-box" id="image_box_review_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' + xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="review_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="review_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="review_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="review_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="review_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_review_image").append(htm);
x_review_image = x + 1;
$modal_review_image.modal('hide');
cropper_review_image.destroy();
cropper_review_image = null;
image_review_image.src = '';
image_review_image = null;
$('#disable_review_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/theme/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/theme/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openreviewimageuploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openreviewimagecropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Update Logo Title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<textarea class="font-editor" name="logo_text" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline" tabindex="-1"
aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1" aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color"> <span
class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream" aria-label="Golden Dream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A" data-title="Chelsea Cucumber"
aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor" data-value="#4A7B8C"
data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor" data-value="#3984C6"
data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor" data-value="#634AA5"
data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="foreColor"
data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502758917" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502758917"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502758917" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502758917"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502758917" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502758917"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502758917" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502758917"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502758917" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku)</small></label><input
id="note-dialog-video-url-173026502758917" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Update Title</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<textarea class="font-editor" name="title" rows="10" style="display: none;"><p></p><p></p><div align="center"></div><br><br><br><p></p></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline" tabindex="-1"
aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1" aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color"> <span
class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream" aria-label="Golden Dream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A" data-title="Chelsea Cucumber"
aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor" data-value="#4A7B8C"
data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor" data-value="#3984C6"
data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor" data-value="#634AA5"
data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="foreColor"
data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p></p>
<p></p>
<div align="center"></div><br><br><br>
<p></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502760218" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502760218"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502760218" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502760218"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502760218" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502760218"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502760218" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502760218"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502760218" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku)</small></label><input
id="note-dialog-video-url-173026502760218" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Update Mobile Title</h5>
</div>
<div class="modal-body">
<textarea class="font-editor" name="mobile_title" rows="10" style="display: none;"><p></p><p></p><div align="center"></div><br><br><br><p></p></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline" tabindex="-1"
aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1" aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color"> <span
class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream" aria-label="Golden Dream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A" data-title="Chelsea Cucumber"
aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor" data-value="#4A7B8C"
data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor" data-value="#3984C6"
data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor" data-value="#634AA5"
data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="foreColor"
data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p></p>
<p></p>
<div align="center"></div><br><br><br>
<p></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502761519" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502761519"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502761519" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502761519"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502761519" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502761519"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502761519" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502761519"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502761519" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku)</small></label><input
id="note-dialog-video-url-173026502761519" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Subtitle</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<textarea class="font-editor" name="subtitle" rows="10"
style="display: none;"><p></p><p></p><div align="center"><img src="https://marketinghub.zingmyorder.com/image/original/restaurant/restaurant/2024/10/24/201635770/seo_image/INevKBck29tKb4M68TJhO61jRXVdrAYJT19AbVC6.png" alt="Zingmyorder" height="120" style="font-size: 1.1rem; text-align: var(--bs-body-text-align); width: 50%;"></div><br><br><br><p></p></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline" tabindex="-1"
aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1" aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color"> <span
class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream" aria-label="Golden Dream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A" data-title="Chelsea Cucumber"
aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor" data-value="#4A7B8C"
data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor" data-value="#3984C6"
data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor" data-value="#634AA5"
data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="foreColor"
data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p></p>
<p></p>
<div align="center"><img src="https://marketinghub.zingmyorder.com/image/original/restaurant/restaurant/2024/10/24/201635770/seo_image/INevKBck29tKb4M68TJhO61jRXVdrAYJT19AbVC6.png" alt="Zingmyorder" height="120"
style="font-size: 1.1rem; text-align: var(--bs-body-text-align); width: 50%;"></div><br><br><br>
<p></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502765420" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502765420"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502765420" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502765420"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502765420" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502765420"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502765420" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502765420"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502765420" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku)</small></label><input
id="note-dialog-video-url-173026502765420" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Mobile Subtitle</h5>
</div>
<div class="modal-body">
<textarea class="font-editor" name="mobile_subtitle" rows="10"
style="display: none;"><p></p><p></p><div align="center"><img src="https://marketinghub.zingmyorder.com/image/original/restaurant/restaurant/2024/10/24/201635770/seo_image/INevKBck29tKb4M68TJhO61jRXVdrAYJT19AbVC6.png" alt="Zingmyorder" height="120" style="font-size: 1.1rem; text-align: var(--bs-body-text-align); width: 50%;"></div><br><br><br><p></p></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline" tabindex="-1"
aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1" aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color"> <span
class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream" aria-label="Golden Dream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A" data-title="Chelsea Cucumber"
aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor" data-value="#4A7B8C"
data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor" data-value="#3984C6"
data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor" data-value="#634AA5"
data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="foreColor"
data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p></p>
<p></p>
<div align="center"><img src="https://marketinghub.zingmyorder.com/image/original/restaurant/restaurant/2024/10/24/201635770/seo_image/INevKBck29tKb4M68TJhO61jRXVdrAYJT19AbVC6.png" alt="Zingmyorder" height="120"
style="font-size: 1.1rem; text-align: var(--bs-body-text-align); width: 50%;"></div><br><br><br>
<p></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502766721" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502766721"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502766721" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502766721"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502766721" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502766721"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502766721" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502766721"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502766721" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku)</small></label><input
id="note-dialog-video-url-173026502766721" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Description</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group">
<label for=""> Name</label>
<textarea class="font-editor" name="description[name]" rows="10" style="display: none;">About Us</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1" aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button
type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color"> <span
class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee"
aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout"
aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper"
aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano"
aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple"
aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink"
aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor"
data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B"
data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">About Us</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502768022" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502768022"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502768022" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502768022"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502768022" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502768022"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502768022" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502768022"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502768022" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502768022" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="">Content</label>
<textarea class="html-editor" placeholder="Page content" name="description[content]"
style="display: none;"><div style="text-align: justify; "><span style="text-align: var(--bs-body-text-align);"><font color="#be2227">At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town!</font></span></div></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C" data-title="Cream Brulee"
aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor" data-value="#B5D6A5" data-title="Sprout"
aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor" data-value="#A5C6CE" data-title="Casper"
aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor" data-value="#9CC6EF" data-title="Perano"
aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor" data-value="#B5A5D6" data-title="Cold Purple"
aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink"
aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="backColor"
data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B"
data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden" aria-label="Eden"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret" aria-label="Claret"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet" aria-label="Electric Violet"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF" data-title="Magenta" aria-label="Magenta"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange" aria-label="Peach Orange"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C" data-title="Cream Brulee"
aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor" data-value="#B5D6A5" data-title="Sprout"
aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor" data-value="#A5C6CE" data-title="Casper"
aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor" data-value="#9CC6EF" data-title="Perano"
aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor" data-value="#B5A5D6" data-title="Cold Purple"
aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD" data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink"
aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite" aria-label="Blue Marguerite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce" aria-label="Puce"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5" data-event="foreColor"
data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A54A7B"
data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green" aria-label="Forest Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden" aria-label="Eden"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue" aria-label="Venice Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite" aria-label="Meteorite"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret" aria-label="Claret"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<div style="text-align: justify; "><span style="text-align: var(--bs-body-text-align);">
<font color="#be2227">At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with
fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle
fried chicken in town!</font>
</span></div>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650272801" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650272801"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650272801" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650272801"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650272801" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650272801"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650272801" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650272801"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650272801" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650272801" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="checkbox" checked="" id="flexCheckDefault">
<label class="form-check-label" for="flexCheckDefault">Save same for about page</label>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update About Page</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for=""> Page Name</label>
<textarea class="font-editor" name="about_page[name]" rows="10" style="display: none;">About Us</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">About Us</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502769223" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502769223"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502769223" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502769223"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502769223" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502769223"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502769223" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502769223"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502769223" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502769223" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for=""> Page Content</label>
<textarea class="html-editor" placeholder="Page content" name="about_page[content]"
style="display: none;"><div style="text-align: justify; "><span style="text-align: var(--bs-body-text-align);"><font color="#be2227">At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town!</font></span></div></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<div style="text-align: justify; "><span style="text-align: var(--bs-body-text-align);">
<font color="#be2227">At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with
fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle
fried chicken in town!</font>
</span></div>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650273202" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650273202"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650273202" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650273202"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650273202" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650273202"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650273202" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650273202"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650273202" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650273202" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<div class="form-check">
<input class="form-check-input" type="checkbox" name="checkbox" checked="" id="flexCheckDefault_01">
<label class="form-check-label" for="flexCheckDefault_01">Save same for about page</label>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="custom1editmodalLabel">Update Page </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Name</label>
<textarea class="font-editor" name="menu_button[name]" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502770424" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502770424"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502770424" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502770424"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502770424" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502770424"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502770424" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502770424"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502770424" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502770424" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Content</label>
<textarea class="html-editor" placeholder="Page content" name="menu_button[content]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650273433" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650273433"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650273433" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650273433"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650273433" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650273433"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650273433" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650273433"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650273433" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650273433" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="custom1editmodalLabel">Update Page </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Name</label>
<textarea class="font-editor" name="custom_page2[name]" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502771725" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502771725"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502771725" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502771725"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502771725" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502771725"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502771725" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502771725"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502771725" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502771725" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Content</label>
<textarea class="html-editor" placeholder="Page content" name="custom_page2[content]" rows="10" style="display: none;">
</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650273594" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650273594"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650273594" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650273594"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650273594" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650273594"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650273594" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650273594"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650273594" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650273594" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="custom3editmodalLabel">Update Page </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Name</label>
<textarea class="font-editor" name="custom_page3[name]" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502772926" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502772926"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502772926" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502772926"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502772926" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502772926"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502772926" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502772926"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502772926" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502772926" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Content</label>
<textarea class="html-editor" placeholder="Page content" name="custom_page3[content]" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650273775" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650273775"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650273775" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650273775"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650273775" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650273775"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650273775" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650273775"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650273775" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650273775" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="custom1editmodalLabel">Update Page </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Name</label>
<textarea class="font-editor" name="custom_page4[name]" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502774227" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502774227"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502774227" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502774227"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502774227" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502774227"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502774227" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502774227"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502774227" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502774227" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Custom Page Content</label>
<textarea class="html-editor" placeholder="Page content" name="custom_page4[content]" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650273976" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650273976"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650273976" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650273976"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650273976" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650273976"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650273976" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650273976"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650273976" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650273976" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Add Phone Number</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<input type="number" name="phone" placeholder="Phone Number" value="" class="form-control" multiple="">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Update Email</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="email" placeholder="Enter Email" value="" class="form-control" multiple="">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/settings/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/settings/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Change Button Name</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<select class="form-control select2" name="order_button_name" id="theme_font">
<option value="Order Pick Up | Delivery">Order Pick Up | Delivery </option>
<option value="Order">Order </option>
<option value="Order Online">Order Online </option>
<option value="Order Pick Up">Order Pick Up </option>
<option value="Order Now">Order Now </option>
<option value="Order To Go">Order To Go </option>
</select>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/settings/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/settings/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Change Name</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="reservation_name" placeholder="Enter Button Name" value="" class="form-control">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/settings/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/settings/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Change Name</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<input type="text" name="reservation_number_name" placeholder="Enter Button Name" value="" class="form-control">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Hours</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<textarea class="html-editor" placeholder="Page content" name="timing_text" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650274127" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650274127"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650274127" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650274127"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650274127" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650274127"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650274127" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650274127"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650274127" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650274127" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/dining/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/dining/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Hours</h5>
<button type="button" class="btn timing-btn btn-group-add" data-related="custom_page3"><i class="fas fa-plus"></i></button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<input type="hidden" name="website_id" value="2022">
<div class="modal-body modal-body-dining">
<div class="col-md-12">
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/dining/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/dining/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Hours</h5>
<button type="button" class="btn btn-success btn-group-add-dining-multi ms-1" data-related="custom_page3"><i class="fas fa-plus"></i></button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<input type="hidden" name="website_id" value="2022">
<div class="modal-body">
<div class="col-md-12">
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/timing/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/timing/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Hours</h5>
<button type="button" class="btn timing-btn btn-group-add-timing" data-related="custom_page3"><i class="fas fa-plus"></i></button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<input type="hidden" name="website_id" value="2022">
<div class="modal-body modal-body-timing">
<div class="col-md-12">
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Monday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7122" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7122][id]" value="7122">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7122][day]" value="Monday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7122][opening]" value="off">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7122][closing]" value="off">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7122" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Tuesday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7123" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7123][id]" value="7123">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7123][day]" value="Tuesday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7123][opening]" value="11:00 AM">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7123][closing]" value="07:00 PM">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7123" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Wednesday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7124" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7124][id]" value="7124">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7124][day]" value="Wednesday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7124][opening]" value="11:00 AM">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7124][closing]" value="07:00 PM">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7124" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Thursday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7125" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7125][id]" value="7125">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7125][day]" value="Thursday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7125][opening]" value="11:00 AM">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7125][closing]" value="07:00 PM">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7125" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Friday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7126" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7126][id]" value="7126">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7126][day]" value="Friday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7126][opening]" value="11:00 AM">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7126][closing]" value="07:00 PM">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7126" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Saturday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7127" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7127][id]" value="7127">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7127][day]" value="Saturday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7127][opening]" value="11:00 AM">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7127][closing]" value="07:00 PM">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7127" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
<div class="dt-day-bk">
<div class="day-section">
<div class="day-name-bk">Sunday</div> <a type="button" class="btn-group-add-timing-multi" data-id="7128" data-related="custom_page3" data-toggle="tooltip" data-placement="top" title="Add new time slot"><i class="fas fa-plus"></i></a>
</div>
<div class="d-flex schedule-bk input-group-with-button">
<input type="hidden" name="timing[7128][id]" value="7128">
<div class="dt-item-bk">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7128][day]" value="Sunday">
</div>
<div class="dt-item-bk">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7128][opening]" value="off">
</div>
<div class="dt-item-bk">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7128][closing]" value="off">
</div>
<div class="dt-item-bk dt-btn-bk">
<label class="opacity-0" for="">Button</label>
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7128" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/timing/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/timing/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="subtitleeditmodalLabel">Update Hours</h5>
<button type="button" class="btn btn-success btn-group-add-timing-multi ms-1" data-related="custom_page3"><i class="fas fa-plus"></i></button>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<input type="hidden" name="website_id" value="2022">
<div class="modal-body">
<div class="col-md-12">
<p>Monday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7122][id]" value="7122">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7122][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7122][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7122][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7122" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
<p>Tuesday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7123][id]" value="7123">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7123][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7123][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7123][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7123" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
<p>Wednesday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7124][id]" value="7124">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7124][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7124][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7124][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7124" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
<p>Thursday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7125][id]" value="7125">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7125][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7125][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7125][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7125" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
<p>Friday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7126][id]" value="7126">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7126][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7126][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7126][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7126" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
<p>Saturday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7127][id]" value="7127">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7127][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7127][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7127][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7127" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
<p>Sunday 2nd Section Hours</p>
<div class="d-flex input-group-with-button-multi">
<input type="hidden" name="timing[7128][id]" value="7128">
<label for="">Day</label>
<input type="text" class="form-control" name="timing[7128][day_multi]" value="">
<label for="">Opening Time</label>
<input type="text" class="form-control" name="timing[7128][opening_multi]" value="">
<label for="">Closing Time</label>
<input type="text" class="form-control" name="timing[7128][closing_multi]" value="">
<div class="d-flex ms-1">
<button type="button" class="btn btn-group-delete" id="deletepage2" data-id="7128" data-related="custom_page2"><i class="fas fa-times"></i></button>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-addlocation" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Edit Location</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/event/store/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/event/store/21678">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Create Event</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row col-no-space">
<div class="col-md-8">
<div class="form-group">
<label for="">Event Title</label>
<input type="text" name="title" placeholder="Title" class="form-control">
<input type="text" hidden="" name="restaurant_id" value="2022" placeholder="Title" class="form-control">
</div>
</div>
<div class="col-md-4">
<div class="form-group">
<label for="">Date <sup></sup></label>
<div class="filter-item">
<input type="date" name="date" required="required" id="datepicker2" autocomplete="off" class="form-control" min="2024-10-30">
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Description</label>
<textarea class="html-editor" placeholder="Description" name="description" rows="10" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue"
aria-label="Tropical Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7"
data-title="Mischka" aria-label="Mischka" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE"
data-title="Twilight" aria-label="Twilight" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5"
data-title="Puce" aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6"
data-event="backColor" data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#634AA5" data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button"
class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873"
data-title="Meteorite" aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842"
data-title="Claret" aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue"
aria-label="Tropical Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7"
data-title="Mischka" aria-label="Mischka" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE"
data-title="Twilight" aria-label="Twilight" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5"
data-title="Puce" aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6"
data-event="foreColor" data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#634AA5" data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button"
class="note-btn note-color-btn" style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873"
data-title="Meteorite" aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842"
data-title="Claret" aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn"
tabindex="-1" aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button></div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650274308" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650274308"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650274308" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650274308"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650274308" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650274308"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650274308" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650274308"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650274308" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650274308" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Hide/Show Events</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="form-group">
<label for="">Hide/Show Events</label>
<select class="form-control select2" name="is_event_show" id="is_event_show">
<option value="1">Show</option>
<option selected="" value="0">Hide</option>
</select>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/settings/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/settings/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Hide/Show Email</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="form-group">
<label for="">Hide/Show Email</label>
<select class="form-control select2" name="email_show" id="email_show">
<option selected="" value="1">Show</option>
<option value="0">Hide</option>
</select>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/event/store/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/event/store/21678">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Add Location</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Location</label>
<input type="text" name="location" placeholder="Add location" class="form-control">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Address</label>
<input type="text" name="address" placeholder="Enter address" class="form-control">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Email</label>
<input type="email" name="email" placeholder="Enter email" class="form-control">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Phone</label>
<input type="number" id="phone" name="phone" placeholder="Enter phone" class="form-control">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Location Id</label>
<input type="text" name="location-id" placeholder="Enter location id" class="form-control">
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Order Link </label>
<input type="url" name="order-link" placeholder="Enter link" class="form-control">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="section1_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-section1_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_section1_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_section1_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_section1_image">
<input class="form-control" type="hidden" name="section1_image" id="disable_section1_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_section1_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="section1_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_section1_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="section1_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_section1_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_section1_image;
var x_section1_image = 1;
var $modal_section1_image;
var image_section1_image;
function destroyCropper() {
if (cropper_section1_image) {
cropper_section1_image.destroy();
cropper_section1_image = null;
image_section1_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_section1_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_section1_image", function() {
console.log('working');
image_section1_image = document.getElementById("image_section1_image");
image_section1_image.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_section1_image = new Cropper(image_section1_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_section1_image", function(e) {
destroyCropper();
$modal_section1_image = $("#modal_section1_image");
image_section1_image = document.getElementById("image_section1_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section1_image/file";
var files_section1_image = e.target.files;
var done = function(url) {
$modal_section1_image.modal('show');
image_section1_image.src = url;
};
var reader;
var file;
if (files_section1_image && files_section1_image.length > 0) {
file = files_section1_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_section1_image.on('shown.bs.modal', function() {
// cropper_section1_image = new Cropper(image_section1_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_section1_image", function() {
var htm = '';
canvas_section1_image = cropper_section1_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_section1_image) {
canvas_section1_image.toBlob(function(blob_section1_image) {
blob_section1_image.quality = 0.8;
url = URL.createObjectURL(blob_section1_image);
var reader = new FileReader();
reader.readAsDataURL(blob_section1_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_section1_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section1_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_section1_image + 1;
htm = '<div class="img-box" id="image_box_section1_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="section1_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="section1_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="section1_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="section1_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="section1_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_section1_image").append(htm);
x_section1_image = x + 1;
$modal_section1_image.modal('hide');
cropper_section1_image.destroy();
cropper_section1_image = null;
image_section1_image.src = '';
image_section1_image = null;
$('#disable_section1_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Upload Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for section1_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="section1_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#section1_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section1_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_section1_image, response);
} else {
rendered = Mustache.render(template_file_section1_image, response);
}
$('#sortable_section1_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var section1_image_files = [];
var template_image_section1_image = $('#template_image_section1_image').html();
var template_file_section1_image = $('#template_file_section1_image').html();
Mustache.parse(template_image_section1_image);
Mustache.parse(template_file_section1_image);
var rendered = '';
var i = 1;
$.each(section1_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_section1_image, value);
} else {
rendered = rendered + Mustache.render(template_file_section1_image, value);
}
});
$('#sortable_section1_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_section1_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="section1_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section1_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section1_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section1_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_section1_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="section1_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="section1_image_{{i}}_title" type="text" name="section1_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="section1_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="section1_image_{{i}}_caption" type="text" name="section1_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="section1_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="section1_image_{{i}}_url" type="text" name="section1_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="section1_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="section1_image_{{i}}_desc" type="text" name="section1_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="section1_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section1_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section1_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section1_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for section1_image -->
<input type="hidden" name="section1_image" value="0">
<div id="sortable_section1_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_section1_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section1editmodalLabel">Update </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Hide/Show Section 1</label>
<select class="form-control select2" name="section1[is_show]" id="is_show">
<option value="0">Hide</option>
<option value="1">Show</option>
</select>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Image</label>
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opensection1uploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opensection1cropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 1 Name</label>
<textarea class="font-editor" name="section1[name]" placeholder="section name" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502776028" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502776028"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502776028" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502776028"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502776028" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502776028"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502776028" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502776028"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502776028" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502776028" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 1 Content</label>
<textarea class="html-editor" placeholder="section content" name="section1[content]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-17302650274469" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-17302650274469"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-17302650274469" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-17302650274469"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-17302650274469" class="note-form-label">Select from files</label><input id="note-dialog-image-file-17302650274469"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-17302650274469" class="note-form-label">Image URL</label><input id="note-dialog-image-url-17302650274469"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-17302650274469" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-17302650274469" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="section1_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-section1_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_section1_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_section1_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_section1_image">
<input class="form-control" type="hidden" name="section1_image" id="disable_section1_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_section1_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="section1_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_section1_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="section1_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_section1_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_section1_image;
var x_section1_image = 1;
var $modal_section1_image;
var image_section1_image;
function destroyCropper() {
if (cropper_section1_image) {
cropper_section1_image.destroy();
cropper_section1_image = null;
image_section1_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_section1_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_section1_image", function() {
console.log('working');
image_section1_image = document.getElementById("image_section1_image");
image_section1_image.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_section1_image = new Cropper(image_section1_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_section1_image", function(e) {
destroyCropper();
$modal_section1_image = $("#modal_section1_image");
image_section1_image = document.getElementById("image_section1_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section2_image/file";
var files_section1_image = e.target.files;
var done = function(url) {
$modal_section1_image.modal('show');
image_section1_image.src = url;
};
var reader;
var file;
if (files_section1_image && files_section1_image.length > 0) {
file = files_section1_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_section1_image.on('shown.bs.modal', function() {
// cropper_section1_image = new Cropper(image_section1_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_section1_image", function() {
var htm = '';
canvas_section1_image = cropper_section1_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_section1_image) {
canvas_section1_image.toBlob(function(blob_section1_image) {
blob_section1_image.quality = 0.8;
url = URL.createObjectURL(blob_section1_image);
var reader = new FileReader();
reader.readAsDataURL(blob_section1_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_section1_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section2_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_section1_image + 1;
htm = '<div class="img-box" id="image_box_section1_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="section1_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="section1_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="section1_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="section1_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="section1_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_section1_image").append(htm);
x_section1_image = x + 1;
$modal_section1_image.modal('hide');
cropper_section1_image.destroy();
cropper_section1_image = null;
image_section1_image.src = '';
image_section1_image = null;
$('#disable_section1_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Upload Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for section2_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="section2_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#section2_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section2_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_section2_image, response);
} else {
rendered = Mustache.render(template_file_section2_image, response);
}
$('#sortable_section2_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var section2_image_files = [];
var template_image_section2_image = $('#template_image_section2_image').html();
var template_file_section2_image = $('#template_file_section2_image').html();
Mustache.parse(template_image_section2_image);
Mustache.parse(template_file_section2_image);
var rendered = '';
var i = 1;
$.each(section2_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_section2_image, value);
} else {
rendered = rendered + Mustache.render(template_file_section2_image, value);
}
});
$('#sortable_section2_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_section2_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="section2_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section2_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section2_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section2_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_section2_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="section2_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="section2_image_{{i}}_title" type="text" name="section2_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="section2_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="section2_image_{{i}}_caption" type="text" name="section2_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="section2_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="section2_image_{{i}}_url" type="text" name="section2_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="section2_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="section2_image_{{i}}_desc" type="text" name="section2_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="section2_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section2_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section2_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section2_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for section2_image -->
<input type="hidden" name="section2_image" value="0">
<div id="sortable_section2_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_section2_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section2editmodalLabel">Update </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Hide/Show Section 2</label>
<select class="form-control select2" name="section2[is_show]" id="is_show">
<option value="0">Hide</option>
<option value="1">Show</option>
</select>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Image</label>
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opensection2uploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opensection2cropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 2 Name</label>
<textarea class="font-editor" name="section2[name]" placeholder="section name" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502777329" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502777329"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502777329" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502777329"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502777329" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502777329"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502777329" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502777329"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502777329" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502777329" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 2 Content</label>
<textarea class="html-editor" placeholder="section content" name="section2[content]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502746710" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502746710"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502746710" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502746710"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502746710" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502746710"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502746710" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502746710"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502746710" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502746710" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="section3_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-section3_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_section3_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_section3_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_section3_image">
<input class="form-control" type="hidden" name="section3_image" id="disable_section3_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_section3_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="section3_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_section3_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="section3_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_section3_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_section3_image;
var x_section3_image = 1;
var $modal_section3_image;
var image_section3_image;
function destroyCropper() {
if (cropper_section3_image) {
cropper_section3_image.destroy();
cropper_section3_image = null;
image_section3_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_section3_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_section3_image", function() {
console.log('working');
image_section3_image = document.getElementById("image_section3_image");
image_section3_image.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_section3_image = new Cropper(image_section3_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_section3_image", function(e) {
destroyCropper();
$modal_section3_image = $("#modal_section3_image");
image_section3_image = document.getElementById("image_section3_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section3_image/file";
var files_section3_image = e.target.files;
var done = function(url) {
$modal_section3_image.modal('show');
image_section3_image.src = url;
};
var reader;
var file;
if (files_section3_image && files_section3_image.length > 0) {
file = files_section3_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_section3_image.on('shown.bs.modal', function() {
// cropper_section3_image = new Cropper(image_section3_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_section3_image", function() {
var htm = '';
canvas_section3_image = cropper_section3_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_section3_image) {
canvas_section3_image.toBlob(function(blob_section3_image) {
blob_section3_image.quality = 0.8;
url = URL.createObjectURL(blob_section3_image);
var reader = new FileReader();
reader.readAsDataURL(blob_section3_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_section3_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section3_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_section3_image + 1;
htm = '<div class="img-box" id="image_box_section3_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="section3_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="section3_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="section3_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="section3_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="section3_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_section3_image").append(htm);
x_section3_image = x + 1;
$modal_section3_image.modal('hide');
cropper_section3_image.destroy();
cropper_section3_image = null;
image_section3_image.src = '';
image_section3_image = null;
$('#disable_section3_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Upload Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for section3_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="section3_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#section3_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section3_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_section3_image, response);
} else {
rendered = Mustache.render(template_file_section3_image, response);
}
$('#sortable_section3_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var section3_image_files = [];
var template_image_section3_image = $('#template_image_section3_image').html();
var template_file_section3_image = $('#template_file_section3_image').html();
Mustache.parse(template_image_section3_image);
Mustache.parse(template_file_section3_image);
var rendered = '';
var i = 1;
$.each(section3_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_section3_image, value);
} else {
rendered = rendered + Mustache.render(template_file_section3_image, value);
}
});
$('#sortable_section3_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_section3_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="section3_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section3_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section3_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section3_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_section3_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="section3_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="section3_image_{{i}}_title" type="text" name="section3_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="section3_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="section3_image_{{i}}_caption" type="text" name="section3_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="section3_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="section3_image_{{i}}_url" type="text" name="section3_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="section3_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="section3_image_{{i}}_desc" type="text" name="section3_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="section3_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section3_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section3_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section3_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for section3_image -->
<input type="hidden" name="section3_image" value="0">
<div id="sortable_section3_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_section3_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section3editmodalLabel">Update </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Hide/Show Section 3</label>
<select class="form-control select2" name="section3[is_show]" id="is_show">
<option value="0">Hide</option>
<option value="1">Show</option>
</select>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Image</label>
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opensection3uploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opensection3cropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 3 Name</label>
<textarea class="font-editor" name="section3[name]" placeholder="section name" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502778630" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502778630"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502778630" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502778630"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502778630" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502778630"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502778630" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502778630"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502778630" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502778630" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 3 Content</label>
<textarea class="html-editor" placeholder="section content" name="section3[content]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502748211" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502748211"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502748211" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502748211"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502748211" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502748211"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502748211" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502748211"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502748211" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502748211" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="section4_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-section4_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_section4_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_section4_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_section4_image">
<input class="form-control" type="hidden" name="section4_image" id="disable_section4_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_section4_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="section4_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_section4_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="section4_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_section4_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_section4_image;
var x_section4_image = 1;
var $modal_section4_image;
var image_section4_image;
function destroyCropper() {
if (cropper_section4_image) {
cropper_section4_image.destroy();
cropper_section4_image = null;
image_section4_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_section4_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_section4_image", function() {
console.log('working');
image_section4_image = document.getElementById("image_section4_image");
image_section4_image.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_section4_image = new Cropper(image_section4_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_section4_image", function(e) {
destroyCropper();
$modal_section4_image = $("#modal_section4_image");
image_section4_image = document.getElementById("image_section4_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section4_image/file";
var files_section4_image = e.target.files;
var done = function(url) {
$modal_section4_image.modal('show');
image_section4_image.src = url;
};
var reader;
var file;
if (files_section4_image && files_section4_image.length > 0) {
file = files_section4_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_section4_image.on('shown.bs.modal', function() {
// cropper_section4_image = new Cropper(image_section4_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_section4_image", function() {
var htm = '';
canvas_section4_image = cropper_section4_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_section4_image) {
canvas_section4_image.toBlob(function(blob_section4_image) {
blob_section4_image.quality = 0.8;
url = URL.createObjectURL(blob_section4_image);
var reader = new FileReader();
reader.readAsDataURL(blob_section4_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_section4_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section4_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_section4_image + 1;
htm = '<div class="img-box" id="image_box_section4_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="section4_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="section4_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="section4_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="section4_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="section4_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_section4_image").append(htm);
x_section4_image = x + 1;
$modal_section4_image.modal('hide');
cropper_section4_image.destroy();
cropper_section4_image = null;
image_section4_image.src = '';
image_section4_image = null;
$('#disable_section4_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Upload Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for section4_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="section4_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#section4_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section4_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_section4_image, response);
} else {
rendered = Mustache.render(template_file_section4_image, response);
}
$('#sortable_section4_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var section4_image_files = [];
var template_image_section4_image = $('#template_image_section4_image').html();
var template_file_section4_image = $('#template_file_section4_image').html();
Mustache.parse(template_image_section4_image);
Mustache.parse(template_file_section4_image);
var rendered = '';
var i = 1;
$.each(section4_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_section4_image, value);
} else {
rendered = rendered + Mustache.render(template_file_section4_image, value);
}
});
$('#sortable_section4_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_section4_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="section4_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section4_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section4_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section4_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_section4_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="section4_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="section4_image_{{i}}_title" type="text" name="section4_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="section4_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="section4_image_{{i}}_caption" type="text" name="section4_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="section4_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="section4_image_{{i}}_url" type="text" name="section4_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="section4_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="section4_image_{{i}}_desc" type="text" name="section4_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="section4_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section4_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section4_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section4_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for section4_image -->
<input type="hidden" name="section4_image" value="0">
<div id="sortable_section4_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_section4_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section4editmodalLabel">Update </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Hide/Show Section 4</label>
<select class="form-control select2" name="section4[is_show]" id="is_show">
<option value="0">Hide</option>
<option value="1">Show</option>
</select>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Image</label>
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opensection4uploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opensection4cropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 4 Name</label>
<textarea class="font-editor" name="section4[name]" placeholder="section name" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502780031" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502780031"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502780031" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502780031"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502780031" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502780031"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502780031" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502780031"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502780031" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502780031" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 4 Content</label>
<textarea class="html-editor" placeholder="section content" name="section4[content]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502749812" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502749812"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502749812" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502749812"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502749812" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502749812"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502749812" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502749812"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502749812" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502749812" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="section5_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-section5_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_section5_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_section5_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_section5_image">
<input class="form-control" type="hidden" name="section5_image" id="disable_section5_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_section5_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="section5_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_section5_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="section5_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_section5_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_section5_image;
var x_section5_image = 1;
var $modal_section5_image;
var image_section5_image;
function destroyCropper() {
if (cropper_section5_image) {
cropper_section5_image.destroy();
cropper_section5_image = null;
image_section5_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_section5_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_section5_image", function() {
console.log('working');
image_section5_image = document.getElementById("image_section5_image");
image_section5_image.onload = function() {
var params = "1/1";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_section5_image = new Cropper(image_section5_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_section5_image", function(e) {
destroyCropper();
$modal_section5_image = $("#modal_section5_image");
image_section5_image = document.getElementById("image_section5_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section5_image/file";
var files_section5_image = e.target.files;
var done = function(url) {
$modal_section5_image.modal('show');
image_section5_image.src = url;
};
var reader;
var file;
if (files_section5_image && files_section5_image.length > 0) {
file = files_section5_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_section5_image.on('shown.bs.modal', function() {
// cropper_section5_image = new Cropper(image_section5_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_section5_image", function() {
var htm = '';
canvas_section5_image = cropper_section5_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_section5_image) {
canvas_section5_image.toBlob(function(blob_section5_image) {
blob_section5_image.quality = 0.8;
url = URL.createObjectURL(blob_section5_image);
var reader = new FileReader();
reader.readAsDataURL(blob_section5_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_section5_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section5_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_section5_image + 1;
htm = '<div class="img-box" id="image_box_section5_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="section5_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="section5_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="section5_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="section5_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="section5_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_section5_image").append(htm);
x_section5_image = x + 1;
$modal_section5_image.modal('hide');
cropper_section5_image.destroy();
cropper_section5_image = null;
image_section5_image.src = '';
image_section5_image = null;
$('#disable_section5_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLongTitle">Upload Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for section5_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="section5_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#section5_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/section5_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_section5_image, response);
} else {
rendered = Mustache.render(template_file_section5_image, response);
}
$('#sortable_section5_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var section5_image_files = [];
var template_image_section5_image = $('#template_image_section5_image').html();
var template_file_section5_image = $('#template_file_section5_image').html();
Mustache.parse(template_image_section5_image);
Mustache.parse(template_file_section5_image);
var rendered = '';
var i = 1;
$.each(section5_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_section5_image, value);
} else {
rendered = rendered + Mustache.render(template_file_section5_image, value);
}
});
$('#sortable_section5_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_section5_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="section5_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section5_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section5_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section5_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_section5_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="section5_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="section5_image_{{i}}_title" type="text" name="section5_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="section5_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="section5_image_{{i}}_caption" type="text" name="section5_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="section5_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="section5_image_{{i}}_url" type="text" name="section5_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="section5_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="section5_image_{{i}}_desc" type="text" name="section5_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="section5_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="section5_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="section5_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="section5_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for section5_image -->
<input type="hidden" name="section5_image" value="0">
<div id="sortable_section5_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_section5_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn frame-modal-btn">Save changes</button>
</div>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section5editmodalLabel">Update </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Hide/Show Section 5</label>
<select class="form-control select2" name="section5[is_show]" id="is_show">
<option value="0">Hide</option>
<option value="1">Show</option>
</select>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Image</label>
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opensection5uploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opensection5cropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 5 Name</label>
<textarea class="font-editor" name="section5[name]" placeholder="section name" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502781332" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502781332"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502781332" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502781332"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502781332" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502781332"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502781332" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502781332"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502781332" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502781332" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 5 Content</label>
<textarea class="html-editor" placeholder="section content" name="section5[content]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502752013" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502752013"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502752013" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502752013"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502752013" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502752013"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502752013" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502752013"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502752013" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502752013" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update </h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Hide/Show Section 6</label>
<select class="form-control select2" name="section6[is_show]" id="is_show">
<option value="0">Hide</option>
<option value="1">Show</option>
</select>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 6 Name</label>
<textarea class="font-editor" name="section6[name]" placeholder="section name" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502782633" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502782633"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502782633" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502782633"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502782633" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502782633"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502782633" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502782633"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502782633" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502782633" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 6 Content left</label>
<textarea class="html-editor" placeholder="section content" name="section6[content_left]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502753814" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502753814"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502753814" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502753814"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502753814" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502753814"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502753814" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502753814"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502753814" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502753814" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 6 Content center</label>
<textarea class="html-editor" placeholder="section content" name="section6[content_center]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502755815" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502755815"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502755815" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502755815"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502755815" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502755815"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502755815" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502755815"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502755815" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502755815" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label for="">Section 6 Content right</label>
<textarea class="html-editor" placeholder="section content" name="section6[content_right]" style="display: none;"></textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-style">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Style"><i class="note-icon-magic"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu dropdown-style" role="list" aria-label="Style">
<a class="note-dropdown-item" href="#" data-value="p" role="listitem" aria-label="p"><p>Normal</p></a><a class="note-dropdown-item" href="#" data-value="blockquote" role="listitem" aria-label="blockquote"><blockquote>Quote</blockquote></a><a class="note-dropdown-item" href="#" data-value="pre" role="listitem" aria-label="pre"><pre>Code</pre></a><a class="note-dropdown-item" href="#" data-value="h1" role="listitem" aria-label="h1"><h1>Header 1</h1></a><a class="note-dropdown-item" href="#" data-value="h2" role="listitem" aria-label="h2"><h2>Header 2</h2></a><a class="note-dropdown-item" href="#" data-value="h3" role="listitem" aria-label="h3"><h3>Header 3</h3></a><a class="note-dropdown-item" href="#" data-value="h4" role="listitem" aria-label="h4"><h4>Header 4</h4></a><a class="note-dropdown-item" href="#" data-value="h5" role="listitem" aria-label="h5"><h5>Header 5</h5></a><a class="note-dropdown-item" href="#" data-value="h6" role="listitem" aria-label="h6"><h6>Header 6</h6></a>
</div>
</div>
</div>
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button></div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-all"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Recent Color" data-backcolor="#FFFF00"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="background-color: rgb(255, 255, 0); color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1"
data-toggle="dropdown" aria-label="More Color"> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Background Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="backColor" data-value="transparent">Transparent</button></div>
<div class="note-holder" data-event="backColor"><!-- back colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="backColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="backColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="backColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="backColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="backColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="backColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="backColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="backColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="backColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="backColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="backColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="backColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="backColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="backColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="backColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="backColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="backColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="backColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="backColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="backColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="backColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="backColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="backColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="backColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="backColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="backColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="backColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="backColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="backColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="backColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="backColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="backColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="backColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="backColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="backColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="backColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="backColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="backColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="backColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="backColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="backColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="backColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="backColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="backColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="backColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="backColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="backColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="backColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="backColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="backColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="backColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="backColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="backColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="backColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="backColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="backColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="backColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="backColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="backColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="backColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="backColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="backColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="backColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="backColorPicker">Select</button><input type="color" id="backColorPicker" class="note-btn note-color-select-btn"
value="#FFFF00" data-event="backColorPalette"></div>
<div class="note-holder-custom" id="backColorPalette" data-event="backColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="backColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-table">
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Table"><i class="note-icon-table"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-table" role="list" aria-label="Table">
<div class="note-dimension-picker">
<div class="note-dimension-picker-mousecatcher" data-event="insertTable" data-value="1x1" style="width: 10em; height: 10em;"></div>
<div class="note-dimension-picker-highlighted"></div>
<div class="note-dimension-picker-unhighlighted"></div>
</div>
<div class="note-dimension-display">1 x 1</div>
</div>
</div>
</div>
<div class="note-btn-group note-insert"><button type="button" class="note-btn" tabindex="-1" aria-label="Link (CTRL+K)"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Video"><i class="note-icon-video"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Picture"><i class="note-icon-picture"></i></button></div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: block;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">
<p><br></p>
</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502757316" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502757316"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502757316" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502757316"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502757316" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502757316"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502757316" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502757316"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-image"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502757316" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502757316" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update Background Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Background Image</label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for about_bg_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="about_bg_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#about_bg_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/about_bg_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_about_bg_image, response);
} else {
rendered = Mustache.render(template_file_about_bg_image, response);
}
$('#sortable_about_bg_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var about_bg_image_files = [];
var template_image_about_bg_image = $('#template_image_about_bg_image').html();
var template_file_about_bg_image = $('#template_file_about_bg_image').html();
Mustache.parse(template_image_about_bg_image);
Mustache.parse(template_file_about_bg_image);
var rendered = '';
var i = 1;
$.each(about_bg_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_about_bg_image, value);
} else {
rendered = rendered + Mustache.render(template_file_about_bg_image, value);
}
});
$('#sortable_about_bg_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_about_bg_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_about_bg_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="about_bg_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="about_bg_image_{{i}}_title" type="text" name="about_bg_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="about_bg_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="about_bg_image_{{i}}_caption" type="text" name="about_bg_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="about_bg_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="about_bg_image_{{i}}_url" type="text" name="about_bg_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="about_bg_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="about_bg_image_{{i}}_desc" type="text" name="about_bg_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="about_bg_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for about_bg_image -->
<input type="hidden" name="about_bg_image" value="0">
<div id="sortable_about_bg_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_about_bg_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update Background Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Background Image</label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="about_bg_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-about_bg_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_about_bg_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_about_bg_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_about_bg_image">
<input class="form-control" type="hidden" name="about_bg_image" id="disable_about_bg_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_about_bg_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="about_bg_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_about_bg_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="about_bg_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_about_bg_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_about_bg_image;
var x_about_bg_image = 1;
var $modal_about_bg_image;
var image_about_bg_image;
function destroyCropper() {
if (cropper_about_bg_image) {
cropper_about_bg_image.destroy();
cropper_about_bg_image = null;
image_about_bg_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_about_bg_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_about_bg_image", function() {
console.log('working');
image_about_bg_image = document.getElementById("image_about_bg_image");
image_about_bg_image.onload = function() {
var params = "1/0.4444";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_about_bg_image = new Cropper(image_about_bg_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_about_bg_image", function(e) {
destroyCropper();
$modal_about_bg_image = $("#modal_about_bg_image");
image_about_bg_image = document.getElementById("image_about_bg_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/about_bg_image/file";
var files_about_bg_image = e.target.files;
var done = function(url) {
$modal_about_bg_image.modal('show');
image_about_bg_image.src = url;
};
var reader;
var file;
if (files_about_bg_image && files_about_bg_image.length > 0) {
file = files_about_bg_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_about_bg_image.on('shown.bs.modal', function() {
// cropper_about_bg_image = new Cropper(image_about_bg_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_about_bg_image", function() {
var htm = '';
canvas_about_bg_image = cropper_about_bg_image.getCroppedCanvas({
width: "1519.2",
height: "454.55",
});
if (canvas_about_bg_image) {
canvas_about_bg_image.toBlob(function(blob_about_bg_image) {
blob_about_bg_image.quality = 0.8;
url = URL.createObjectURL(blob_about_bg_image);
var reader = new FileReader();
reader.readAsDataURL(blob_about_bg_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_about_bg_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/about_bg_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_about_bg_image + 1;
htm = '<div class="img-box" id="image_box_about_bg_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="about_bg_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="about_bg_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="about_bg_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="about_bg_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="about_bg_image[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_about_bg_image").append(htm);
x_about_bg_image = x + 1;
$modal_about_bg_image.modal('hide');
cropper_about_bg_image.destroy();
cropper_about_bg_image = null;
image_about_bg_image.src = '';
image_about_bg_image = null;
$('#disable_about_bg_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update Background Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openbgimageuploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openbgimagecropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update Gallery Background Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Gallery Background Image</label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for gallery_bg_image -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="gallery_bg_image">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#gallery_bg_image").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/gallery_bg_image/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_gallery_bg_image, response);
} else {
rendered = Mustache.render(template_file_gallery_bg_image, response);
}
$('#sortable_gallery_bg_image').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var gallery_bg_image_files = [];
var template_image_gallery_bg_image = $('#template_image_gallery_bg_image').html();
var template_file_gallery_bg_image = $('#template_file_gallery_bg_image').html();
Mustache.parse(template_image_gallery_bg_image);
Mustache.parse(template_file_gallery_bg_image);
var rendered = '';
var i = 1;
$.each(gallery_bg_image_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_gallery_bg_image, value);
} else {
rendered = rendered + Mustache.render(template_file_gallery_bg_image, value);
}
});
$('#sortable_gallery_bg_image').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_gallery_bg_image" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_gallery_bg_image" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="gallery_bg_image_{{i}}_title">Title</label>
<input type="text" class="form-control" id="gallery_bg_image_{{i}}_title" type="text" name="gallery_bg_image[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="gallery_bg_image_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="gallery_bg_image_{{i}}_caption" type="text" name="gallery_bg_image[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="gallery_bg_image_{{i}}_url">Url</label>
<input type="text" class="form-control" id="gallery_bg_image_{{i}}_url" type="text" name="gallery_bg_image[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="gallery_bg_image_{{i}}_desc">Description</label>
<textarea class="form-control" id="gallery_bg_image_{{i}}_desc" type="text" name="gallery_bg_image[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="gallery_bg_image[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for gallery_bg_image -->
<input type="hidden" name="gallery_bg_image" value="0">
<div id="sortable_gallery_bg_image" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_gallery_bg_image');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update Gallery Background Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<div class="form-group">
<label for="">Gallery Background Image</label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="gallery_bg_image-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-gallery_bg_image">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_gallery_bg_image" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_gallery_bg_image" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_gallery_bg_image">
<input class="form-control" type="hidden" name="gallery_bg_image" id="disable_gallery_bg_image" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_gallery_bg_image" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="gallery_bg_image"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_gallery_bg_image" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="gallery_bg_image" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_gallery_bg_image">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_gallery_bg_image;
var x_gallery_bg_image = 1;
var $modal_gallery_bg_image;
var image_gallery_bg_image;
function destroyCropper() {
if (cropper_gallery_bg_image) {
cropper_gallery_bg_image.destroy();
cropper_gallery_bg_image = null;
image_gallery_bg_image.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_gallery_bg_image", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_gallery_bg_image", function() {
console.log('working');
image_gallery_bg_image = document.getElementById("image_gallery_bg_image");
image_gallery_bg_image.onload = function() {
var params = "1/0.4444";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_gallery_bg_image = new Cropper(image_gallery_bg_image, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_gallery_bg_image", function(e) {
destroyCropper();
$modal_gallery_bg_image = $("#modal_gallery_bg_image");
image_gallery_bg_image = document.getElementById("image_gallery_bg_image");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/gallery_bg_image/file";
var files_gallery_bg_image = e.target.files;
var done = function(url) {
$modal_gallery_bg_image.modal('show');
image_gallery_bg_image.src = url;
};
var reader;
var file;
if (files_gallery_bg_image && files_gallery_bg_image.length > 0) {
file = files_gallery_bg_image[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_gallery_bg_image.on('shown.bs.modal', function() {
// cropper_gallery_bg_image = new Cropper(image_gallery_bg_image, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_gallery_bg_image", function() {
var htm = '';
canvas_gallery_bg_image = cropper_gallery_bg_image.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_gallery_bg_image) {
canvas_gallery_bg_image.toBlob(function(blob_gallery_bg_image) {
blob_gallery_bg_image.quality = 0.8;
url = URL.createObjectURL(blob_gallery_bg_image);
var reader = new FileReader();
reader.readAsDataURL(blob_gallery_bg_image);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_gallery_bg_image, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/gallery_bg_image/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_gallery_bg_image + 1;
htm = '<div class="img-box" id="image_box_gallery_bg_image_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="gallery_bg_image"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="gallery_bg_image[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="gallery_bg_image[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="gallery_bg_image[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="gallery_bg_image[' + x +
'][file]"value="' + file_out + '"> </div></div>';
$("#upload_img_gallery_bg_image").append(htm);
x_gallery_bg_image = x + 1;
$modal_gallery_bg_image.modal('hide');
cropper_gallery_bg_image.destroy();
cropper_gallery_bg_image = null;
image_gallery_bg_image.src = '';
image_gallery_bg_image = null;
$('#disable_gallery_bg_image').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="section6editmodalLabel">Update Gallery Background Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="opengallerybguploadmodal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="opengallerybgcropmodal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/theme/update/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/theme/update/21678"><input type="hidden" name="_method"
value="PUT">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Footer</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="col-md-12">
<label for="theme_color">Font color</label>
<div class="input-group colorpicker-element" id="footerfontcolor" data-colorpicker-id="2">
<input name="footer_font_color" type="text" class="form-control" value="#FFFFFF" style="width:auto;">
<span class="input-group-text colorpicker-input-addon" data-bs-original-title="" title="" tabindex="0"><i style="background: rgb(255, 255, 255);"></i></span>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openslidingimg1UploadModal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openslidingimg1CropModal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Background Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for sliding_image1 -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="sliding_image1">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#sliding_image1").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_image1/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_sliding_image1, response);
} else {
rendered = Mustache.render(template_file_sliding_image1, response);
}
$('#sortable_sliding_image1').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var sliding_image1_files = [];
var template_image_sliding_image1 = $('#template_image_sliding_image1').html();
var template_file_sliding_image1 = $('#template_file_sliding_image1').html();
Mustache.parse(template_image_sliding_image1);
Mustache.parse(template_file_sliding_image1);
var rendered = '';
var i = 1;
$.each(sliding_image1_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_sliding_image1, value);
} else {
rendered = rendered + Mustache.render(template_file_sliding_image1, value);
}
});
$('#sortable_sliding_image1').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_sliding_image1" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_sliding_image1" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="sliding_image1_{{i}}_title">Title</label>
<input type="text" class="form-control" id="sliding_image1_{{i}}_title" type="text" name="sliding_image1[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="sliding_image1_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="sliding_image1_{{i}}_caption" type="text" name="sliding_image1[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="sliding_image1_{{i}}_url">Url</label>
<input type="text" class="form-control" id="sliding_image1_{{i}}_url" type="text" name="sliding_image1[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="sliding_image1_{{i}}_desc">Description</label>
<textarea class="form-control" id="sliding_image1_{{i}}_desc" type="text" name="sliding_image1[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="sliding_image1[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for sliding_image1 -->
<input type="hidden" name="sliding_image1" value="0">
<div id="sortable_sliding_image1" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_sliding_image1');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Background Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="sliding_image1-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-sliding_image1">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_sliding_image1" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_sliding_image1" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_sliding_image1">
<input class="form-control" type="hidden" name="sliding_image1" id="disable_sliding_image1" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_sliding_image1" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="sliding_image1"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_sliding_image1" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="sliding_image1" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_sliding_image1">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_sliding_image1;
var x_sliding_image1 = 1;
var $modal_sliding_image1;
var image_sliding_image1;
function destroyCropper() {
if (cropper_sliding_image1) {
cropper_sliding_image1.destroy();
cropper_sliding_image1 = null;
image_sliding_image1.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_sliding_image1", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_sliding_image1", function() {
console.log('working');
image_sliding_image1 = document.getElementById("image_sliding_image1");
image_sliding_image1.onload = function() {
var params = "1/0.2965";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_sliding_image1 = new Cropper(image_sliding_image1, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_sliding_image1", function(e) {
destroyCropper();
$modal_sliding_image1 = $("#modal_sliding_image1");
image_sliding_image1 = document.getElementById("image_sliding_image1");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_image1/file";
var files_sliding_image1 = e.target.files;
var done = function(url) {
$modal_sliding_image1.modal('show');
image_sliding_image1.src = url;
};
var reader;
var file;
if (files_sliding_image1 && files_sliding_image1.length > 0) {
file = files_sliding_image1[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_sliding_image1.on('shown.bs.modal', function() {
// cropper_sliding_image1 = new Cropper(image_sliding_image1, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_sliding_image1", function() {
var htm = '';
canvas_sliding_image1 = cropper_sliding_image1.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_sliding_image1) {
canvas_sliding_image1.toBlob(function(blob_sliding_image1) {
blob_sliding_image1.quality = 0.8;
url = URL.createObjectURL(blob_sliding_image1);
var reader = new FileReader();
reader.readAsDataURL(blob_sliding_image1);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_sliding_image1, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_image1/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_sliding_image1 + 1;
htm = '<div class="img-box" id="image_box_sliding_image1_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="sliding_image1"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="sliding_image1[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="sliding_image1[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="sliding_image1[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="sliding_image1[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_sliding_image1").append(htm);
x_sliding_image1 = x + 1;
$modal_sliding_image1.modal('hide');
cropper_sliding_image1.destroy();
cropper_sliding_image1 = null;
image_sliding_image1.src = '';
image_sliding_image1 = null;
$('#disable_sliding_image1').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openslidingimg2UploadModal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openslidingimg2CropModal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Background Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for sliding_image2 -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="sliding_image2">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#sliding_image2").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_image2/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_sliding_image2, response);
} else {
rendered = Mustache.render(template_file_sliding_image2, response);
}
$('#sortable_sliding_image2').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var sliding_image2_files = [];
var template_image_sliding_image2 = $('#template_image_sliding_image2').html();
var template_file_sliding_image2 = $('#template_file_sliding_image2').html();
Mustache.parse(template_image_sliding_image2);
Mustache.parse(template_file_sliding_image2);
var rendered = '';
var i = 1;
$.each(sliding_image2_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_sliding_image2, value);
} else {
rendered = rendered + Mustache.render(template_file_sliding_image2, value);
}
});
$('#sortable_sliding_image2').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_sliding_image2" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_sliding_image2" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="sliding_image2_{{i}}_title">Title</label>
<input type="text" class="form-control" id="sliding_image2_{{i}}_title" type="text" name="sliding_image2[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="sliding_image2_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="sliding_image2_{{i}}_caption" type="text" name="sliding_image2[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="sliding_image2_{{i}}_url">Url</label>
<input type="text" class="form-control" id="sliding_image2_{{i}}_url" type="text" name="sliding_image2[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="sliding_image2_{{i}}_desc">Description</label>
<textarea class="form-control" id="sliding_image2_{{i}}_desc" type="text" name="sliding_image2[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="sliding_image2[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for sliding_image2 -->
<input type="hidden" name="sliding_image2" value="0">
<div id="sortable_sliding_image2" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_sliding_image2');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Background Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="sliding_image2-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-sliding_image2">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_sliding_image2" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_sliding_image2" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_sliding_image2">
<input class="form-control" type="hidden" name="sliding_image2" id="disable_sliding_image2" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_sliding_image2" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="sliding_image2"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_sliding_image2" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="sliding_image2" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_sliding_image2">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_sliding_image2;
var x_sliding_image2 = 1;
var $modal_sliding_image2;
var image_sliding_image2;
function destroyCropper() {
if (cropper_sliding_image2) {
cropper_sliding_image2.destroy();
cropper_sliding_image2 = null;
image_sliding_image2.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_sliding_image2", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_sliding_image2", function() {
console.log('working');
image_sliding_image2 = document.getElementById("image_sliding_image2");
image_sliding_image2.onload = function() {
var params = "1/0.2965";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_sliding_image2 = new Cropper(image_sliding_image2, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_sliding_image2", function(e) {
destroyCropper();
$modal_sliding_image2 = $("#modal_sliding_image2");
image_sliding_image2 = document.getElementById("image_sliding_image2");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_image2/file";
var files_sliding_image2 = e.target.files;
var done = function(url) {
$modal_sliding_image2.modal('show');
image_sliding_image2.src = url;
};
var reader;
var file;
if (files_sliding_image2 && files_sliding_image2.length > 0) {
file = files_sliding_image2[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_sliding_image2.on('shown.bs.modal', function() {
// cropper_sliding_image2 = new Cropper(image_sliding_image2, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_sliding_image2", function() {
var htm = '';
canvas_sliding_image2 = cropper_sliding_image2.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_sliding_image2) {
canvas_sliding_image2.toBlob(function(blob_sliding_image2) {
blob_sliding_image2.quality = 0.8;
url = URL.createObjectURL(blob_sliding_image2);
var reader = new FileReader();
reader.readAsDataURL(blob_sliding_image2);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_sliding_image2, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_image2/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_sliding_image2 + 1;
htm = '<div class="img-box" id="image_box_sliding_image2_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="sliding_image2"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="sliding_image2[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="sliding_image2[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="sliding_image2[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="sliding_image2[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_sliding_image2").append(htm);
x_sliding_image2 = x + 1;
$modal_sliding_image2.modal('hide');
cropper_sliding_image2.destroy();
cropper_sliding_image2 = null;
image_sliding_image2.src = '';
image_sliding_image2 = null;
$('#disable_sliding_image2').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="upload-box">
<div class="upload-image-bk">
<div class="title-bk" id="openslidingimg3UploadModal">
<img src="https://site.zingmyorder.com/themes/website/assets/img/crop.png" alt="">
<span> Upload </span>
</div>
<div class="desc-bk"> Upload the image without modifications </div>
</div>
<div class="crop-image-bk">
<div class="title-bk" id="openslidingimg3CropModal">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="512" height="512" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve" class="">
<g>
<path d="M20.5 24a.5.5 0 0 1-.5-.5v-18c0-.827-.673-1.5-1.5-1.5H.5a.5.5 0 0 1 0-1h18C19.879 3 21 4.122 21 5.5v18a.5.5 0 0 1-.5.5z" fill="#000000" opacity="1" data-original="#000000"></path>
<path d="M23.5 21h-18A2.502 2.502 0 0 1 3 18.5V.5a.5.5 0 0 1 1 0v18c0 .827.673 1.5 1.5 1.5h18a.5.5 0 0 1 0 1z" fill="#000000" opacity="1" data-original="#000000"></path>
<path
d="M8 11c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2zm0-3a1.001 1.001 0 0 0 0 2 1.001 1.001 0 0 0 0-2zM3.5 18a.5.5 0 0 1-.354-.853l2.79-2.79c.566-.566 1.561-.566 2.127 0L9.5 15.793l4.937-4.937c.564-.566 1.562-.566 2.127 0l4.29 4.29a.5.5 0 0 1-.707.707l-4.29-4.29a.521.521 0 0 0-.713 0l-5.29 5.29a.5.5 0 0 1-.707 0l-1.79-1.79a.521.521 0 0 0-.713 0l-2.79 2.79A.5.5 0 0 1 3.5 18z"
fill="#000000" opacity="1" data-original="#000000"></path>
</g>
</svg>
<span> Crop </span>
</div>
<div class="desc-bk"> Crop Image to fit within the image area </div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save Changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Background Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<!-- Start dropzone for sliding_Image3 -->
<div class="upload-wraper">
<div class="dropzone dropzone-previews dz-clickable" id="sliding_Image3">
<div class="dz-default dz-message"><button class="dz-button" type="button">Drop files here to upload</button></div>
</div>
<script type="text/javascript">
$(function() {
Dropzone.autoDiscover = false;
$("div#sliding_Image3").dropzone({
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_Image3/file",
maxFiles: 10,
acceptedFiles: ".png, .gif, .jpg, .jpeg",
parallelUploads: 1,
maxfilesexceeded: function(file) {
toastr.error('Files exceedes maximum size.', 'Error');
},
sending: function(file, xhr, formData) {
formData.append("_token", $('meta[name="csrf-token"]').attr('content'));
// Laravel expect the token post value to be named _token by default
},
init: function() {
this.on("success", function(file, response) {
response['i'] = ++i;
if (["jpg", "jpeg", "png"].indexOf(response.file.split('.').pop()) >= 0) {
rendered = Mustache.render(template_image_sliding_Image3, response);
} else {
rendered = Mustache.render(template_file_sliding_Image3, response);
}
$('#sortable_sliding_Image3').append(rendered);
toastr.success('Files uploaded successfully.', 'Success');
});
},
complete: function(file) {
this.removeFile(file);
}
});
var sliding_Image3_files = [];
var template_image_sliding_Image3 = $('#template_image_sliding_Image3').html();
var template_file_sliding_Image3 = $('#template_file_sliding_Image3').html();
Mustache.parse(template_image_sliding_Image3);
Mustache.parse(template_file_sliding_Image3);
var rendered = '';
var i = 1;
$.each(sliding_Image3_files, function(index, value) {
i = index;
value['i'] = index;
if (["jpg", "jpeg", "png"].indexOf(value.file.split('.').pop()) >= 0) {
rendered = rendered + Mustache.render(template_image_sliding_Image3, value);
} else {
rendered = rendered + Mustache.render(template_file_sliding_Image3, value);
}
});
$('#sortable_sliding_Image3').html(rendered);
rendered = '';
});
</script>
<!-- End dropzone. -->
<script id="template_file_sliding_Image3" type="x-tmpl-mustache"> <div class="file-box" id="image_box_{{i}}">
<div class="file-container">
<a href="https://site.zingmyorder.com/file/download/{{path}}" target="_blank" >
{{file}}
</a>
<a href="#" class="remove-file">
<i class="fa fa-times"></i>
</a>
</div>
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][file]" value="{{file}}">
</div>
</script>
<!-- End dropzone. -->
<script id="template_image_sliding_Image3" type="x-tmpl-mustache"> <div class="img-box" id="image_box_{{i}}">
<div class="img-container">
<a href="https://site.zingmyorder.com/image/original/{{path}}" target="_blank" >
<img src="https://site.zingmyorder.com/image/xs/{{path}}" class="img-responsive" alt="">
</a>
<div class="btn-container">
<a href="#" class="move-image">
<i class="fa fa-arrows"></i>
</a>
<a href="#" class="edit-image">
<i class="fa fa-pencil"></i>
</a>
<a href="#" class="remove-image">
<i class="fa fa-times"></i>
</a>
</div>
</div>
<div class="edit-wraper" style="display: none">
<div class="row">
<div class="col-sm-3">
<div id="main-img">
<img src="https://site.zingmyorder.com/image/sm/{{path}}" class="img-responsive" alt="">
</div>
</div>
<div class="col-sm-9">
<div class="form-group">
<label for="sliding_Image3_{{i}}_title">Title</label>
<input type="text" class="form-control" id="sliding_Image3_{{i}}_title" type="text" name="sliding_Image3[{{i}}][title]" value="{{caption}}" placeholder="Image Title">
</div>
<div class="form-group">
<label for="sliding_Image3_{{i}}_caption">Caption</label>
<input type="text" class="form-control" id="sliding_Image3_{{i}}_caption" type="text" name="sliding_Image3[{{i}}][caption]" value="{{caption}}" placeholder="Image Caption">
</div>
<div class="form-group">
<label for="sliding_Image3_{{i}}_url">Url</label>
<input type="text" class="form-control" id="sliding_Image3_{{i}}_url" type="text" name="sliding_Image3[{{i}}][url]" value="{{caption}}" placeholder="Image URL">
</div>
<div class="form-group">
<label for="sliding_Image3_{{i}}_desc">Description</label>
<textarea class="form-control" id="sliding_Image3_{{i}}_desc" type="text" name="sliding_Image3[{{i}}][desc]" placeholder="Image Description" rows="5">{{desc}}</textarea>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<button class="btn btn-success btn-close pull-right" type="submit">Save</button>
</div>
</div>
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][folder]" value="{{folder}}">
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][time]" value="{{time}}">
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][path]" value="{{path}}">
<input class="form-control" type="hidden" name="sliding_Image3[{{i}}][file]" value="{{file}}">
</div>
</div>
</script>
<!-- Start image editor for sliding_Image3 -->
<input type="hidden" name="sliding_Image3" value="0">
<div id="sortable_sliding_Image3" class="image-editor"></div>
</div>
<script type="text/javascript">
$(function() {
$(document.body).on('click', ".remove-image", function(e) {
$(this).parents('.img-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".remove-file", function(e) {
$(this).parents('.file-box').remove();
e.preventDefault();
});
$(document.body).on('click', ".btn-close", function(e) {
$(this).parents(".edit-wraper").hide();
e.preventDefault();
})
$(document.body).on('click', ".edit-image", function(e) {
poff = $(this).parents('.upload-wraper').offset();
toff = $(this).offset();
mleft = poff.left - toff.left;
mtop = poff.top - toff.top;
$(this).parents('.img-box').children(".edit-wraper").css('margin-top', mtop - 83);
$(this).parents('.img-box').children(".edit-wraper").css('margin-left', mleft + 67);
$(this).parents('.img-box').children(".edit-wraper").show();
e.preventDefault();
});
var el = document.getElementById('sortable_sliding_Image3');
var sortable = Sortable.create(el, {
handle: ".move-image"
});
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/homeupdate/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-edit" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/homeupdate/21678"><input type="hidden" name="_method"
value="PUT">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Update Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="form-group border-0">
<label for="">Background Image <sup></sup></label>
<div class="dropzone dropzone-previews mt-10">
<div class="row">
<div class="col-lg-12 col-sm-12">
<meta name="csrf-token" content="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
<div class="sliding_Image3-file-cropper cropper-upload-file">
<img src="https://site.zingmyorder.com" alt="" class="d-none img-responsive" id="image-sliding_Image3">
<div class="btn-group upload-btn">
<label class="btn" for="inputImage_sliding_Image3" title="Change Image" "="">
<input type=" file" class="sr-only" id="inputImage_sliding_Image3" accept=".jpg,.jpeg,.png,.gif">
<span class="docs-tooltip" data-toggle="tooltip" data-animation="false" title="Upload new image">
<i class="fa fa-upload"></i>
<span>Click here to Upload</span>
</span>
</label>
</div>
<div class="upload-img d-flex align-content-start flex-wrap" id="upload_img_sliding_Image3">
<input class="form-control" type="hidden" name="sliding_Image3" id="disable_sliding_Image3" value="[]" disabled="">
</div>
</div>
<div class="modal fade" id="modal_sliding_Image3" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true" data-backdrop="static" data-bs-backdrop="static" data-keyboard="false">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="modalLabel">Crop Image</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" data-content="sliding_Image3"></button>
</div>
<div class="modal-body">
<div class="img-container">
<div class="row">
<div class="col-md-8">
<img id="image_sliding_Image3" src="#" loading="lazy" alt="…">
</div>
<div class="col-md-4">
<div class="preview">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="frame-modal-btn btn-close" data-content="sliding_Image3" data-bs-dismiss="modal">Cancel</button>
<button type="button" class="frame-modal-btn" id="crop_sliding_Image3">Crop</button>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
var cropper_sliding_Image3;
var x_sliding_Image3 = 1;
var $modal_sliding_Image3;
var image_sliding_Image3;
function destroyCropper() {
if (cropper_sliding_Image3) {
cropper_sliding_Image3.destroy();
cropper_sliding_Image3 = null;
image_sliding_Image3.src = '';
imageName = "";
}
}
$(document.body).on('hidden.bs.modal', "#modal_sliding_Image3", function() {
destroyCropper();
console.log('Cropper destroyed');
});
$(document.body).on('show.bs.modal', "#modal_sliding_Image3", function() {
console.log('working');
image_sliding_Image3 = document.getElementById("image_sliding_Image3");
image_sliding_Image3.onload = function() {
var params = "1/0.2965";
var aspect = 1;
var ratio = 1;
if (params) {
aspect = params.split('/')[0];
ratio = params.split('/')[1];
}
console.log(aspect, ratio);
cropper_sliding_Image3 = new Cropper(image_sliding_Image3, {
aspectRatio: aspect / ratio,
viewMode: 3,
preview: '.preview'
});
};
});
$(document.body).on("change", "#inputImage_sliding_Image3", function(e) {
destroyCropper();
$modal_sliding_Image3 = $("#modal_sliding_Image3");
image_sliding_Image3 = document.getElementById("image_sliding_Image3");
var upload_url = "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_Image3/file";
var files_sliding_Image3 = e.target.files;
var done = function(url) {
$modal_sliding_Image3.modal('show');
image_sliding_Image3.src = url;
};
var reader;
var file;
if (files_sliding_Image3 && files_sliding_Image3.length > 0) {
file = files_sliding_Image3[0];
imageName = file.name;
if (URL) {
done(URL.createObjectURL(file));
} else if (FileReader) {
reader = new FileReader();
reader.onload = function(e) {
done(reader.result);
};
reader.readAsDataURL(file);
}
}
// $modal_sliding_Image3.on('shown.bs.modal', function() {
// cropper_sliding_Image3 = new Cropper(image_sliding_Image3, {
// aspectRatio: aspect / ratio,
// viewMode: 3,
// preview: '.preview'
// });
// alert('intialize');
// }).on('hidden.bs.modal', function() {
// alert('close');
// destroyCropper();
// });
});
$(document.body).on("click", "#crop_sliding_Image3", function() {
var htm = '';
canvas_sliding_Image3 = cropper_sliding_Image3.getCroppedCanvas({
width: "800",
height: "800",
});
if (canvas_sliding_Image3) {
canvas_sliding_Image3.toBlob(function(blob_sliding_Image3) {
blob_sliding_Image3.quality = 0.8;
url = URL.createObjectURL(blob_sliding_Image3);
var reader = new FileReader();
reader.readAsDataURL(blob_sliding_Image3);
reader.onloadend = function() {
var base64data = reader.result;
var formData = new FormData();
formData.append('file', blob_sliding_Image3, imageName);
$.ajax({
type: "POST",
url: "https://site.zingmyorder.com/client/upload/restaurant.website.websitehome.model/2024/10/24/182431271/sliding_Image3/file",
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: formData,
processData: false,
contentType: false,
success: function(data, textStatus, jqXHR) {
var file_out = data.file;
var folder_out = data.folder;
var path_out = data.path;
var time_out = data.time;
var original_path = "https://site.zingmyorder.com/image/original/" + path_out;
var xs_path = "https://site.zingmyorder.com/image/xs/" + path_out;
x = x_sliding_Image3 + 1;
htm = '<div class="img-box" id="image_box_sliding_Image3_' + x + '" style="padding: 8px"><div class="img-container"><a href="' + original_path + '" target="_blank" class="box-img"><img src="' +
xs_path +
'" class="img-responsive" alt=""></a><div class="btn-container"><a href="#" class="remove-image" data-content="sliding_Image3"><i class="fa fa-times"></i></a></div></div><div class="edit-wraper"><input class="form-control" type="hidden" name="sliding_Image3[' +
x + '][folder]" value="' + folder_out + '"><input class="form-control" type="hidden" name="sliding_Image3[' + x + '][time]"value="' + time_out +
'"><input class="form-control" type="hidden" name="sliding_Image3[' + x + '][path]"value="' + path_out + '"><input class="form-control" type="hidden" name="sliding_Image3[' + x + '][file]"value="' +
file_out + '"> </div></div>';
$("#upload_img_sliding_Image3").append(htm);
x_sliding_Image3 = x + 1;
$modal_sliding_Image3.modal('hide');
cropper_sliding_Image3.destroy();
cropper_sliding_Image3 = null;
image_sliding_Image3.src = '';
image_sliding_Image3 = null;
$('#disable_sliding_Image3').prop('disabled', true);
},
});
}
});
}
});
$(document.body).on('click', ".remove-image", function(e) {
e.preventDefault();
$(this).parents('.img-box').remove();
var field_name = $(this).attr('data-content');
var imgBoxContainer = $("#upload_img_" + field_name);
var imgBoxCountBefore = imgBoxContainer.find(".img-box").length;
if (imgBoxCountBefore == 0) {
$('#disable_' + field_name).prop('disabled', false);
}
});
$(document.body).on('click', ".btn-close", function(e) {
e.preventDefault();
var field_name = $(this).attr('data-content');
$('#modal_' + field_name).modal('hide');
})
});
</script>
</div>
<div class="col-lg-12 col-sm-12">
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="frame-modal-btn">Save changes</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/updatefaq/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-editfaq" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/updatefaq/21678">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Edit FAQ</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="faq_div">
<div class="form-group">
<label for="">Question</label>
<textarea class="font-editor" name="question" rows="10" placeholder="Add question" style="display: none;"> Where is your restaurant located?
</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;"> Where is your restaurant located? </div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502784634" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502784634"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502784634" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502784634"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502784634" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502784634"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502784634" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502784634"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502784634" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502784634" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="">Answer</label>
<textarea class="font-editor" name="answer" rows="10" placeholder="Add answer" style="display: none;">Our restaurant is located at 444 West Bedford Euless Road, Hurst, TX 76053, USA.</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">Our restaurant is located at 444 West Bedford Euless Road, Hurst, TX 76053, USA.</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502785935" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502785935"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502785935" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502785935"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502785935" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502785935"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502785935" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502785935"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502785935" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502785935" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<input type="text" hidden="" name="restaurant_id" value="21678" placeholder="Title" class="form-control">
<input type="text" id="website_id" hidden="" name="website_id" value="2022">
<input type="text" id="faqid" hidden="" name="id" value="152">
<hr>
</div>
</div>
<div class="modal-footer">
<button class="frame-modal-btn faq-delete" type="button" id="152" data-value="152"><i class="fa fa-trash me-1"></i><span>Remove</span></button>
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/updatefaq/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-editfaq" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/updatefaq/21678">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Edit FAQ</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="faq_div">
<div class="form-group">
<label for="">Question</label>
<textarea class="font-editor" name="question" rows="10" placeholder="Add question" style="display: none;"> Do you offer Delivery orders at your restaurant?
</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;"> Do you offer Delivery orders at your restaurant? </div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502787236" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502787236"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502787236" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502787236"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502787236" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502787236"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502787236" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502787236"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502787236" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502787236" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="">Answer</label>
<textarea class="font-editor" name="answer" rows="10" placeholder="Add answer" style="display: none;">Yes. For delivery orders, please order directly from our website to support local restaurants like ours.</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">Yes. For delivery orders, please order directly from our website to support local
restaurants like ours.</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502788537" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502788537"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502788537" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502788537"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502788537" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502788537"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502788537" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502788537"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502788537" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502788537" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<input type="text" hidden="" name="restaurant_id" value="21678" placeholder="Title" class="form-control">
<input type="text" id="website_id" hidden="" name="website_id" value="2022">
<input type="text" id="faqid" hidden="" name="id" value="153">
<hr>
</div>
</div>
<div class="modal-footer">
<button class="frame-modal-btn faq-delete" type="button" id="153" data-value="153"><i class="fa fa-trash me-1"></i><span>Remove</span></button>
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/updatefaq/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-editfaq" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/updatefaq/21678">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Edit FAQ</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="faq_div">
<div class="form-group">
<label for="">Question</label>
<textarea class="font-editor" name="question" rows="10" placeholder="Add question" style="display: none;"> Do you Offer Contact-free delivery?
</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;"> Do you Offer Contact-free delivery? </div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502789938" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502789938"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502789938" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502789938"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502789938" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502789938"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502789938" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502789938"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502789938" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502789938" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="">Answer</label>
<textarea class="font-editor" name="answer" rows="10" placeholder="Add answer" style="display: none;">Yes we can provide contact free delivery via our 3rd party partners if you select that option during checkout from our website.</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">Yes we can provide contact free delivery via our 3rd party partners if you select that
option during checkout from our website.</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502791439" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502791439"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502791439" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502791439"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502791439" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502791439"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502791439" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502791439"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502791439" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502791439" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<input type="text" hidden="" name="restaurant_id" value="21678" placeholder="Title" class="form-control">
<input type="text" id="website_id" hidden="" name="website_id" value="2022">
<input type="text" id="faqid" hidden="" name="id" value="154">
<hr>
</div>
</div>
<div class="modal-footer">
<button class="frame-modal-btn faq-delete" type="button" id="154" data-value="154"><i class="fa fa-trash me-1"></i><span>Remove</span></button>
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>POST https://site.zingmyorder.com/client/website/updatefaq/21678
<form accept-charset="utf-8" class="form-vertical modal-content" id="restaurant-website-editfaq" enctype="multipart/form-data" method="POST" action="https://site.zingmyorder.com/client/website/updatefaq/21678">
<div class="modal-header">
<h5 class="modal-title" id="titleeditmodalLabel">Edit FAQ</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div id="faq_div">
<div class="form-group">
<label for="">Question</label>
<textarea class="font-editor" name="question" rows="10" placeholder="Add question" style="display: none;"> What are your business hours?
</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;"> What are your business hours? </div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502793440" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502793440"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502793440" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502793440"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502793440" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502793440"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502793440" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502793440"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502793440" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502793440" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<label for="">Answer</label>
<textarea class="font-editor" name="answer" rows="10" placeholder="Add answer" style="display: none;">You can find our business hours on the website.</textarea>
<div class="note-editor note-frame">
<div class="note-dropzone">
<div class="note-dropzone-message"></div>
</div>
<div class="note-toolbar" role="toolbar">
<div class="note-btn-group note-font"><button type="button" class="note-btn note-btn-bold" tabindex="-1" aria-label="Bold (CTRL+B)"><i class="note-icon-bold"></i></button><button type="button" class="note-btn note-btn-underline"
tabindex="-1" aria-label="Underline (CTRL+U)"><i class="note-icon-underline"></i></button><button type="button" class="note-btn note-btn-italic" tabindex="-1"
aria-label="Italic (CTRL+I)"><i class="note-icon-italic"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Font Style (CTRL+\)"><i class="note-icon-eraser"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Font Size"><span class="note-current-fontsize">15</span> <span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu note-check dropdown-fontsize" role="list" aria-label="Font Size">
<a class="note-dropdown-item" href="#" data-value="8" role="listitem" aria-label="8"><i class="note-icon-menu-check"></i> 8</a><a class="note-dropdown-item" href="#" data-value="9" role="listitem" aria-label="9"><i class="note-icon-menu-check"></i> 9</a><a class="note-dropdown-item" href="#" data-value="10" role="listitem" aria-label="10"><i class="note-icon-menu-check"></i> 10</a><a class="note-dropdown-item" href="#" data-value="11" role="listitem" aria-label="11"><i class="note-icon-menu-check"></i> 11</a><a class="note-dropdown-item" href="#" data-value="12" role="listitem" aria-label="12"><i class="note-icon-menu-check"></i> 12</a><a class="note-dropdown-item" href="#" data-value="14" role="listitem" aria-label="14"><i class="note-icon-menu-check"></i> 14</a><a class="note-dropdown-item" href="#" data-value="16" role="listitem" aria-label="16"><i class="note-icon-menu-check"></i> 16</a><a class="note-dropdown-item" href="#" data-value="18" role="listitem" aria-label="18"><i class="note-icon-menu-check"></i> 18</a><a class="note-dropdown-item" href="#" data-value="20" role="listitem" aria-label="20"><i class="note-icon-menu-check"></i> 20</a><a class="note-dropdown-item" href="#" data-value="22" role="listitem" aria-label="22"><i class="note-icon-menu-check"></i> 22</a><a class="note-dropdown-item" href="#" data-value="24" role="listitem" aria-label="24"><i class="note-icon-menu-check"></i> 24</a><a class="note-dropdown-item" href="#" data-value="28" role="listitem" aria-label="28"><i class="note-icon-menu-check"></i> 28</a><a class="note-dropdown-item" href="#" data-value="30" role="listitem" aria-label="30"><i class="note-icon-menu-check"></i> 30</a><a class="note-dropdown-item" href="#" data-value="32" role="listitem" aria-label="32"><i class="note-icon-menu-check"></i> 32</a><a class="note-dropdown-item" href="#" data-value="36" role="listitem" aria-label="36"><i class="note-icon-menu-check"></i> 36</a><a class="note-dropdown-item" href="#" data-value="40" role="listitem" aria-label="40"><i class="note-icon-menu-check"></i> 40</a><a class="note-dropdown-item" href="#" data-value="44" role="listitem" aria-label="44"><i class="note-icon-menu-check"></i> 44</a><a class="note-dropdown-item" href="#" data-value="48" role="listitem" aria-label="48"><i class="note-icon-menu-check"></i> 48</a><a class="note-dropdown-item" href="#" data-value="54" role="listitem" aria-label="54"><i class="note-icon-menu-check"></i> 54</a><a class="note-dropdown-item" href="#" data-value="60" role="listitem" aria-label="60"><i class="note-icon-menu-check"></i> 60</a><a class="note-dropdown-item" href="#" data-value="72" role="listitem" aria-label="72"><i class="note-icon-menu-check"></i> 72</a><a class="note-dropdown-item" href="#" data-value="96" role="listitem" aria-label="96"><i class="note-icon-menu-check"></i> 96</a>
</div>
</div>
</div>
<div class="note-btn-group note-color">
<div class="note-btn-group note-color note-color-fore"><button type="button" class="note-btn note-current-color-button" tabindex="-1" aria-label="Text Color"
data-forecolor="#000000"><i class="note-icon-font note-recent-color" style="color: rgb(0, 0, 0);"></i></button><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="More Color">
<span class="note-icon-caret"></span></button>
<div class="note-dropdown-menu" role="list">
<div class="note-palette">
<div class="note-palette-title">Text Color</div>
<div><button type="button" class="note-color-reset btn btn-light btn-default" data-event="removeFormat" data-value="foreColor">Reset to default</button></div>
<div class="note-holder" data-event="foreColor"><!-- fore colors -->
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#000000" data-event="foreColor" data-value="#000000" data-title="Black" aria-label="Black" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#424242" data-event="foreColor" data-value="#424242" data-title="Tundora" aria-label="Tundora" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#636363" data-event="foreColor" data-value="#636363" data-title="Dove Gray" aria-label="Dove Gray" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C9C94" data-event="foreColor" data-value="#9C9C94" data-title="Star Dust" aria-label="Star Dust" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEC6CE" data-event="foreColor" data-value="#CEC6CE" data-title="Pale Slate" aria-label="Pale Slate" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFEFEF" data-event="foreColor" data-value="#EFEFEF" data-title="Gallery" aria-label="Gallery" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7F7F7" data-event="foreColor" data-value="#F7F7F7" data-title="Alabaster" aria-label="Alabaster" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="White" aria-label="White" data-toggle="button"
tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FF0000" data-event="foreColor" data-value="#FF0000" data-title="Red" aria-label="Red" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF9C00" data-event="foreColor" data-value="#FF9C00" data-title="Orange Peel" aria-label="Orange Peel"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFF00" data-event="foreColor" data-value="#FFFF00" data-title="Yellow" aria-label="Yellow"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FF00" data-event="foreColor" data-value="#00FF00" data-title="Green" aria-label="Green"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#00FFFF" data-event="foreColor" data-value="#00FFFF" data-title="Cyan" aria-label="Cyan"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#0000FF" data-event="foreColor" data-value="#0000FF" data-title="Blue" aria-label="Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9C00FF" data-event="foreColor" data-value="#9C00FF" data-title="Electric Violet"
aria-label="Electric Violet" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FF00FF" data-event="foreColor" data-value="#FF00FF"
data-title="Magenta" aria-label="Magenta" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#F7C6CE" data-event="foreColor" data-value="#F7C6CE" data-title="Azalea" aria-label="Azalea" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE7CE" data-event="foreColor" data-value="#FFE7CE" data-title="Karry" aria-label="Karry" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFEFC6" data-event="foreColor" data-value="#FFEFC6" data-title="Egg White" aria-label="Egg White" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6EFD6" data-event="foreColor" data-value="#D6EFD6" data-title="Zanah" aria-label="Zanah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEDEE7" data-event="foreColor" data-value="#CEDEE7" data-title="Botticelli" aria-label="Botticelli" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#CEE7F7" data-event="foreColor" data-value="#CEE7F7" data-title="Tropical Blue" aria-label="Tropical Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6D6E7" data-event="foreColor" data-value="#D6D6E7" data-title="Mischka" aria-label="Mischka"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E7D6DE" data-event="foreColor" data-value="#E7D6DE" data-title="Twilight" aria-label="Twilight"
data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E79C9C" data-event="foreColor" data-value="#E79C9C" data-title="Tonys Pink" aria-label="Tonys Pink"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFC69C" data-event="foreColor" data-value="#FFC69C" data-title="Peach Orange"
aria-label="Peach Orange" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFE79C" data-event="foreColor" data-value="#FFE79C"
data-title="Cream Brulee" aria-label="Cream Brulee" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5D6A5" data-event="foreColor"
data-value="#B5D6A5" data-title="Sprout" aria-label="Sprout" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#A5C6CE" data-event="foreColor"
data-value="#A5C6CE" data-title="Casper" aria-label="Casper" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#9CC6EF" data-event="foreColor"
data-value="#9CC6EF" data-title="Perano" aria-label="Perano" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B5A5D6" data-event="foreColor"
data-value="#B5A5D6" data-title="Cold Purple" aria-label="Cold Purple" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#D6A5BD"
data-event="foreColor" data-value="#D6A5BD" data-title="Careys Pink" aria-label="Careys Pink" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#E76363" data-event="foreColor" data-value="#E76363" data-title="Mandy" aria-label="Mandy" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#F7AD6B" data-event="foreColor" data-value="#F7AD6B" data-title="Rajah" aria-label="Rajah" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFD663" data-event="foreColor" data-value="#FFD663" data-title="Dandelion" aria-label="Dandelion" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#94BD7B" data-event="foreColor" data-value="#94BD7B" data-title="Olivine" aria-label="Olivine" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#73A5AD" data-event="foreColor" data-value="#73A5AD" data-title="Gulf Stream" aria-label="Gulf Stream"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BADDE" data-event="foreColor" data-value="#6BADDE" data-title="Viking" aria-label="Viking"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#8C7BC6" data-event="foreColor" data-value="#8C7BC6" data-title="Blue Marguerite"
aria-label="Blue Marguerite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#C67BA5" data-event="foreColor" data-value="#C67BA5" data-title="Puce"
aria-label="Puce" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#CE0000" data-event="foreColor" data-value="#CE0000" data-title="Guardsman Red" aria-label="Guardsman Red"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#E79439" data-event="foreColor" data-value="#E79439" data-title="Fire Bush" aria-label="Fire Bush"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#EFC631" data-event="foreColor" data-value="#EFC631" data-title="Golden Dream"
aria-label="Golden Dream" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#6BA54A" data-event="foreColor" data-value="#6BA54A"
data-title="Chelsea Cucumber" aria-label="Chelsea Cucumber" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A7B8C" data-event="foreColor"
data-value="#4A7B8C" data-title="Smalt Blue" aria-label="Smalt Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#3984C6" data-event="foreColor"
data-value="#3984C6" data-title="Boston Blue" aria-label="Boston Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#634AA5"
data-event="foreColor" data-value="#634AA5" data-title="Butterfly Bush" aria-label="Butterfly Bush" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn"
style="background-color:#A54A7B" data-event="foreColor" data-value="#A54A7B" data-title="Cadillac" aria-label="Cadillac" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#9C0000" data-event="foreColor" data-value="#9C0000" data-title="Sangria" aria-label="Sangria" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#B56308" data-event="foreColor" data-value="#B56308" data-title="Mai Tai" aria-label="Mai Tai" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#BD9400" data-event="foreColor" data-value="#BD9400" data-title="Buddha Gold" aria-label="Buddha Gold"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#397B21" data-event="foreColor" data-value="#397B21" data-title="Forest Green"
aria-label="Forest Green" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#104A5A" data-event="foreColor" data-value="#104A5A" data-title="Eden"
aria-label="Eden" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#085294" data-event="foreColor" data-value="#085294" data-title="Venice Blue"
aria-label="Venice Blue" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#311873" data-event="foreColor" data-value="#311873" data-title="Meteorite"
aria-label="Meteorite" data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#731842" data-event="foreColor" data-value="#731842" data-title="Claret"
aria-label="Claret" data-toggle="button" tabindex="-1"></button></div>
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#630000" data-event="foreColor" data-value="#630000" data-title="Rosewood" aria-label="Rosewood" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#7B3900" data-event="foreColor" data-value="#7B3900" data-title="Cinnamon" aria-label="Cinnamon" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#846300" data-event="foreColor" data-value="#846300" data-title="Olive" aria-label="Olive" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#295218" data-event="foreColor" data-value="#295218" data-title="Parsley" aria-label="Parsley" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#083139" data-event="foreColor" data-value="#083139" data-title="Tiber" aria-label="Tiber" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#003163" data-event="foreColor" data-value="#003163" data-title="Midnight Blue" aria-label="Midnight Blue"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#21104A" data-event="foreColor" data-value="#21104A" data-title="Valentino" aria-label="Valentino"
data-toggle="button" tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#4A1031" data-event="foreColor" data-value="#4A1031" data-title="Loulou" aria-label="Loulou"
data-toggle="button" tabindex="-1"></button></div>
</div>
</div>
<div><button type="button" class="note-color-select btn btn-light btn-default" data-event="openPalette" data-value="foreColorPicker">Select</button><input type="color" id="foreColorPicker" class="note-btn note-color-select-btn"
value="#000000" data-event="foreColorPalette"></div>
<div class="note-holder-custom" id="foreColorPalette" data-event="foreColor">
<div class="note-color-palette">
<div class="note-color-row"><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button><button type="button" class="note-btn note-color-btn" style="background-color:#FFFFFF" data-event="foreColor" data-value="#FFFFFF" data-title="#FFFFFF" aria-label="#FFFFFF" data-toggle="button"
tabindex="-1"></button></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="note-btn-group note-para"><button type="button" class="note-btn" tabindex="-1" aria-label="Unordered list (CTRL+SHIFT+NUM7)"><i class="note-icon-unorderedlist"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Ordered list (CTRL+SHIFT+NUM8)"><i class="note-icon-orderedlist"></i></button>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Paragraph"><i class="note-icon-align-left"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu" role="list">
<div class="note-btn-group note-align"><button type="button" class="note-btn" tabindex="-1" aria-label="Align left (CTRL+SHIFT+L)"><i class="note-icon-align-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align center (CTRL+SHIFT+E)"><i class="note-icon-align-center"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Align right (CTRL+SHIFT+R)"><i class="note-icon-align-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Justify full (CTRL+SHIFT+J)"><i class="note-icon-align-justify"></i></button>
</div>
<div class="note-btn-group note-list"><button type="button" class="note-btn" tabindex="-1" aria-label="Outdent (CTRL+[)"><i class="note-icon-align-outdent"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Indent (CTRL+])"><i class="note-icon-align-indent"></i></button></div>
</div>
</div>
<div class="note-btn-group"><button type="button" class="note-btn dropdown-toggle" tabindex="-1" data-toggle="dropdown" aria-label="Line Height"><i class="note-icon-text-height"> <span class="note-icon-caret"></span></i></button>
<div class="note-dropdown-menu note-check dropdown-line-height" role="list" aria-label="Line Height">
<a class="note-dropdown-item" href="#" data-value="1.0" role="listitem" aria-label="1.0"><i class="note-icon-menu-check"></i> 1.0</a><a class="note-dropdown-item" href="#" data-value="1.2" role="listitem" aria-label="1.2"><i class="note-icon-menu-check"></i> 1.2</a><a class="note-dropdown-item" href="#" data-value="1.4" role="listitem" aria-label="1.4"><i class="note-icon-menu-check"></i> 1.4</a><a class="note-dropdown-item" href="#" data-value="1.5" role="listitem" aria-label="1.5"><i class="note-icon-menu-check"></i> 1.5</a><a class="note-dropdown-item" href="#" data-value="1.6" role="listitem" aria-label="1.6"><i class="note-icon-menu-check"></i> 1.6</a><a class="note-dropdown-item" href="#" data-value="1.8" role="listitem" aria-label="1.8"><i class="note-icon-menu-check"></i> 1.8</a><a class="note-dropdown-item" href="#" data-value="2.0" role="listitem" aria-label="2.0"><i class="note-icon-menu-check"></i> 2.0</a><a class="note-dropdown-item" href="#" data-value="3.0" role="listitem" aria-label="3.0"><i class="note-icon-menu-check"></i> 3.0</a>
</div>
</div>
</div>
<div class="note-btn-group note-view"><button type="button" class="note-btn btn-fullscreen note-codeview-keep" tabindex="-1" aria-label="Full Screen"><i class="note-icon-arrows-alt"></i></button><button type="button"
class="note-btn btn-codeview note-codeview-keep" tabindex="-1" aria-label="Code View"><i class="note-icon-code"></i></button></div>
</div>
<div class="note-editing-area">
<div class="note-placeholder" style="display: none;">Placeholder</div>
<div class="note-handle">
<div class="note-control-selection">
<div class="note-control-selection-bg"></div>
<div class="note-control-holder note-control-nw"></div>
<div class="note-control-holder note-control-ne"></div>
<div class="note-control-holder note-control-sw"></div>
<div class="note-control-sizing note-control-se"></div>
<div class="note-control-selection-info"></div>
</div>
</div><textarea class="note-codable" aria-multiline="true"></textarea>
<div class="note-editable" contenteditable="true" role="textbox" aria-multiline="true" spellcheck="true" autocorrect="true" style="height: 250px;">You can find our business hours on the website.</div>
</div><output class="note-status-output" role="status" aria-live="polite"></output>
<div class="note-statusbar" role="status">
<div class="note-resizebar" aria-label="resize">
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
<div class="note-icon-bar"></div>
</div>
</div>
<div class="note-modal link-dialog" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Link">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Link</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group"><label for="note-dialog-link-txt-173026502794741" class="note-form-label">Text to display</label><input id="note-dialog-link-txt-173026502794741"
class="note-link-text form-control note-form-control note-input" type="text"></div>
<div class="form-group note-form-group"><label for="note-dialog-link-url-173026502794741" class="note-form-label">To what URL should this link go?</label><input id="note-dialog-link-url-173026502794741"
class="note-link-url form-control note-form-control note-input" type="text" value="http://"></div>
<div class="checkbox sn-checkbox-open-in-new-window"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Open in new window</label></div>
<div class="checkbox sn-checkbox-use-protocol"><label><input role="checkbox" type="checkbox" checked="" aria-checked="true">Use default protocol</label></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-link-btn" value="Insert Link" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-link-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container"><span><a target="_blank"></a> </span>
<div class="note-btn-group note-link"><button type="button" class="note-btn" tabindex="-1" aria-label="Edit"><i class="note-icon-link"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Unlink"><i class="note-icon-chain-broken"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Image">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Image</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group note-group-select-from-files"><label for="note-dialog-image-file-173026502794741" class="note-form-label">Select from files</label><input id="note-dialog-image-file-173026502794741"
class="note-image-input form-control-file note-form-control note-input" type="file" name="files" accept="image/*" multiple="multiple"></div>
<div class="form-group note-group-image-url"><label for="note-dialog-image-url-173026502794741" class="note-form-label">Image URL</label><input id="note-dialog-image-url-173026502794741"
class="note-image-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-image-btn" value="Insert Image" disabled=""></div>
</div>
</div>
<div class="note-popover bottom note-image-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-resize"><button type="button" class="note-btn" tabindex="-1" aria-label="Resize full"><span class="note-fontsize-10">100%</span></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Resize half"><span class="note-fontsize-10">50%</span></button><button type="button" class="note-btn" tabindex="-1" aria-label="Resize quarter"><span class="note-fontsize-10">25%</span></button><button type="button"
class="note-btn" tabindex="-1" aria-label="Original size"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-float"><button type="button" class="note-btn" tabindex="-1" aria-label="Float Left"><i class="note-icon-float-left"></i></button><button type="button" class="note-btn" tabindex="-1"
aria-label="Float Right"><i class="note-icon-float-right"></i></button><button type="button" class="note-btn" tabindex="-1" aria-label="Remove float"><i class="note-icon-rollback"></i></button></div>
<div class="note-btn-group note-remove"><button type="button" class="note-btn" tabindex="-1" aria-label="Remove Image"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-popover bottom note-table-popover" style="display: none;">
<div class="note-popover-arrow"></div>
<div class="popover-content note-children-container">
<div class="note-btn-group note-add"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add row below"><i class="note-icon-row-below"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Add row above"><i class="note-icon-row-above"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Add column left"><i class="note-icon-col-before"></i></button><button type="button"
class="note-btn btn-md" tabindex="-1" aria-label="Add column right"><i class="note-icon-col-after"></i></button></div>
<div class="note-btn-group note-delete"><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete row"><i class="note-icon-row-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1"
aria-label="Delete column"><i class="note-icon-col-remove"></i></button><button type="button" class="note-btn btn-md" tabindex="-1" aria-label="Delete table"><i class="note-icon-trash"></i></button></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Insert Video">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Insert Video</h4>
</div>
<div class="note-modal-body">
<div class="form-group note-form-group row-fluid"><label for="note-dialog-video-url-173026502794741" class="note-form-label">Video URL <small class="text-muted">(YouTube, Vimeo, Vine, Instagram, DailyMotion or
Youku)</small></label><input id="note-dialog-video-url-173026502794741" class="note-video-url form-control note-form-control note-input" type="text"></div>
</div>
<div class="note-modal-footer"><input type="button" href="#" class="btn btn-primary note-btn note-btn-primary note-video-btn" value="Insert Video" disabled=""></div>
</div>
</div>
<div class="note-modal" aria-hidden="false" tabindex="-1" role="dialog" aria-label="Help">
<div class="note-modal-content">
<div class="note-modal-header"><button type="button" class="close" aria-label="Close" aria-hidden="true"><i class="note-icon-close"></i></button>
<h4 class="note-modal-title">Help</h4>
</div>
<div class="note-modal-body" style="max-height: 300px; overflow: scroll;">
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ESC</kbd></label><span>Escape</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>ENTER</kbd></label><span>Insert Paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Z</kbd></label><span>Undo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+Y</kbd></label><span>Redo the last command</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>TAB</kbd></label><span>Tab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>SHIFT+TAB</kbd></label><span>Untab</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+B</kbd></label><span>Set a bold style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+I</kbd></label><span>Set a italic style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+U</kbd></label><span>Set a underline style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+S</kbd></label><span>Set a strikethrough style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+BACKSLASH</kbd></label><span>Clean a style</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+L</kbd></label><span>Set left align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+E</kbd></label><span>Set center align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+R</kbd></label><span>Set right align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+J</kbd></label><span>Set full align</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM7</kbd></label><span>Toggle unordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+SHIFT+NUM8</kbd></label><span>Toggle ordered list</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+LEFTBRACKET</kbd></label><span>Outdent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+RIGHTBRACKET</kbd></label><span>Indent on current paragraph</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM0</kbd></label><span>Change current block's format as a paragraph(P tag)</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM1</kbd></label><span>Change current block's format as H1</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM2</kbd></label><span>Change current block's format as H2</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM3</kbd></label><span>Change current block's format as H3</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM4</kbd></label><span>Change current block's format as H4</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM5</kbd></label><span>Change current block's format as H5</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+NUM6</kbd></label><span>Change current block's format as H6</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+ENTER</kbd></label><span>Insert horizontal rule</span>
<div class="help-list-item"></div><label style="width: 180px; margin-right: 10px;"><kbd>CTRL+K</kbd></label><span>Show Link Dialog</span>
</div>
<div class="note-modal-footer">
<p class="text-center"><a href="http://summernote.org/" target="_blank">Summernote 0.8.18</a> · <a href="https://github.com/summernote/summernote" target="_blank">Project</a> ·
<a href="https://github.com/summernote/summernote/issues" target="_blank">Issues</a></p>
</div>
</div>
</div>
</div>
</div>
<input type="text" hidden="" name="restaurant_id" value="21678" placeholder="Title" class="form-control">
<input type="text" id="website_id" hidden="" name="website_id" value="2022">
<input type="text" id="faqid" hidden="" name="id" value="155">
<hr>
</div>
</div>
<div class="modal-footer">
<button class="frame-modal-btn faq-delete" type="button" id="155" data-value="155"><i class="fa fa-trash me-1"></i><span>Remove</span></button>
<button type="submit" class="frame-modal-btn">Save</button>
</div>
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3">
</form>Name: job-formd — https://site.zingmyorder.com/website/jobmail/21678
<form action="https://site.zingmyorder.com/website/jobmail/21678" class="job-formd" id="job-formd" name="job-formd" enctype="multipart/form-data">
<input type="hidden" name="_token" value="0sg8YczIq9xCesDwiKlgFJNhaO8QgBc5fmZcYFt3"> <input type="hidden" name="cf_tomail" id="cf_tomail">
<input type="hidden" name="cf_page" id="cf_page" value="job">
<input type="hidden" name="cf_rm" id="cf_rm" value="">
<h1 class="test-center">Jobs</h1>
<p> We are hiring! Apply below to become a part of our awesome team and we'll get back to you ASAP! Alternatively if you have questions you can call us. </p>
<input type="text" class="form-control" id="inputName_public36_jobform" name="name" placeholder="Name...">
<span id="err_msg_name_public36_jobform" style="color: red;font-size:15px;"></span>
<br><br>
<input type="tel" class="form-control" id="inputPhone_public36_jobform" name="phone" placeholder="Phone...">
<span id="err_msg_phone_public36_jobform" style="color: red;font-size:15px;"></span>
<br><br>
<input type="email" class="form-control" id="inputEmail_public36_jobform" name="email" placeholder="Email...">
<span id="err_msg_email_public36_jobform" style="color: red;font-size:15px;"></span>
<br><br>
<input type="text" class="form-control" id="experience_public36_jobform" name="experience" placeholder="Years of Experiences" required="">
<span id="err_msg_experience_public36_jobform" style="color: red;font-size:15px;"></span>
<br><br>
<input type="text" class="form-control" id="position_public36_jobform" name="applying-for" placeholder="Interested Job Position Ex.Server,Cook..." required="">
<span id="err_msg_position_public36_jobform" style="color: red;font-size:15px;"></span>
<br><br>
<textarea id="comments" class="form-control" name="comments" rows="4" cols="50" placeholder="Cover Letter..."></textarea><br><br>
<label for="resume">Resume:</label>
<input type="file" id="resume" name="resume" accept=".pdf, .doc, .docx" required=""><br><br>
<div id="div_hide">
<div class="d-flex align-items-center mb-15">
<div id="div_capt" class="mr-20" style="max-width: 170px;">
<img id="img_captcha_public28_jobmail" class="img-fluid" src="https://site.zingmyorder.com/image-captcha">
</div>
<i style="font-size: 17px; cursor: pointer;" class="fa fa-refresh" id="reload_captcha_public28_jobmail" value="Reload"></i>
</div>
<div class="form-group">
<input required="" style="margin-top: 10px;" type="text" class="form-control" placeholder="Captcha*" id="captcha_public36_jobform" name="captcha">
<span id="err_msg_captcha_public36_jobform" style="color: red;font-size:15px;"></span>
</div>
</div>
<div class="form-group text-center mt-30">
<button type="submit" id="jobbtn" class="btn btn-secondary">Submit</button>
</div>
</form>Text Content
* Home * About Us * Menu * Gallery * Contact Order PickUp | Delivery * Home * About Us * Menu * Gallery * Contact Order PickUp | Delivery RESERVATION Subject: Reservation Submit UPLOAD IMAGE Drop files here to upload Title Caption Url Description Save Close Save Changes CROP IMAGE Click here to Upload CROP IMAGE Cancel Crop Close Save changes UPDATE LOGO Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE BANNER LOGO Banner Logo Click here to Upload CROP IMAGE Cancel Crop Save Changes UPDATE BANNER LOGO Banner Logo Drop files here to upload Save Changes UPDATE BANNER LOGO Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE IMAGE Banner Image Drop files here to upload Title Caption Url Description Save Save changes UPDATE IMAGE Banner Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE GALLERY Gallery Drop files here to upload Title Caption Url Description Save Title Caption Url Description Save Title Caption Url Description Save Title Caption Url Description Save Title Caption Url Description Save Title Caption Url Description Save Save changes UPDATE GALLERY Gallery Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE GALLERY Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE GALLERY Gallery Title Gallery Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE BANNER Banner Video Banner Image Banner Video Url Mobile Banner Video Url Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE BANNER Banner Image Drop files here to upload Title Caption Url Description Save Title Caption Url Description Save Title Caption Url Description Save Mobile Banner Image Drop files here to upload Title Caption Url Description Save Title Caption Url Description Save Title Caption Url Description Save Save changes UPDATE BANNER Banner Image Click here to Upload CROP IMAGE Cancel Crop Mobile Banner Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE BANNER VIDEO Banner Video Url Save changes UPDATE IMAGE Banner Image Drop files here to upload Title Caption Url Description Save Save changes UPDATE IMAGE Banner Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE REVIEW BACKGROUND COLOUR Background color Save changes UPDATE IMAGE Review Image Drop files here to upload Save Changes UPDATE IMAGE Review Image Click here to Upload CROP IMAGE Cancel Crop Save Changes UPDATE IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE LOGO TITLE 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save Changes UPDATE TITLE <p></p><p></p><div align="center"></div><br><br><br><p></p> 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues UPDATE MOBILE TITLE <p></p><p></p><div align="center"></div><br><br><br><p></p> 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save Changes UPDATE SUBTITLE <p></p><p></p><div align="center"><img src="https://marketinghub.zingmyorder.com/image/original/restaurant/restaurant/2024/10/24/201635770/seo_image/INevKBck29tKb4M68TJhO61jRXVdrAYJT19AbVC6.png" alt="Zingmyorder" height="120" style="font-size: 1.1rem; text-align: var(--bs-body-text-align); width: 50%;"></div><br><br><br><p></p> 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues UPDATE MOBILE SUBTITLE <p></p><p></p><div align="center"><img src="https://marketinghub.zingmyorder.com/image/original/restaurant/restaurant/2024/10/24/201635770/seo_image/INevKBck29tKb4M68TJhO61jRXVdrAYJT19AbVC6.png" alt="Zingmyorder" height="120" style="font-size: 1.1rem; text-align: var(--bs-body-text-align); width: 50%;"></div><br><br><br><p></p> 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save Changes UPDATE DESCRIPTION Name About Us 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder About Us INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Content <div style="text-align: justify; "><span style="text-align: var(--bs-body-text-align);"><font color="#be2227">At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town!</font></span></div> Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town! INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save same for about page Save changes UPDATE ABOUT PAGE Page Name About Us 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder About Us INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Page Content <div style="text-align: justify; "><span style="text-align: var(--bs-body-text-align);"><font color="#be2227">At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town!</font></span></div> Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town! INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save same for about page Save changes UPDATE PAGE Custom Page Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Custom Page Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes UPDATE PAGE Custom Page Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Custom Page Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes UPDATE PAGE Custom Page Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Custom Page Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes UPDATE PAGE Custom Page Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Custom Page Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes ADD PHONE NUMBER Save UPDATE EMAIL Save CHANGE BUTTON NAME Order Pick Up | Delivery Order Order Online Order Pick Up Order Now Order To Go Save CHANGE NAME Save CHANGE NAME Save UPDATE HOURS Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes UPDATE HOURS Save changes UPDATE HOURS Save changes UPDATE HOURS Monday Day Opening Time Closing Time Button Tuesday Day Opening Time Closing Time Button Wednesday Day Opening Time Closing Time Button Thursday Day Opening Time Closing Time Button Friday Day Opening Time Closing Time Button Saturday Day Opening Time Closing Time Button Sunday Day Opening Time Closing Time Button Save changes UPDATE HOURS Monday 2nd Section Hours Day Opening Time Closing Time Tuesday 2nd Section Hours Day Opening Time Closing Time Wednesday 2nd Section Hours Day Opening Time Closing Time Thursday 2nd Section Hours Day Opening Time Closing Time Friday 2nd Section Hours Day Opening Time Closing Time Saturday 2nd Section Hours Day Opening Time Closing Time Sunday 2nd Section Hours Day Opening Time Closing Time Save changes EDIT LOCATION Save CREATE EVENT Event Title Date Description Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save HIDE/SHOW EVENTS Hide/Show Events Show Hide Save changes HIDE/SHOW EMAIL Hide/Show Email Show Hide Save changes ADD LOCATION Location Address Email Phone Location Id Order Link Save CROP IMAGE Click here to Upload CROP IMAGE Cancel Crop Close Save changes UPLOAD IMAGE Drop files here to upload Close Save changes UPDATE Hide/Show Section 1 Hide Show Image Upload Upload the image without modifications Crop Crop Image to fit within the image area Section 1 Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 1 Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes CROP IMAGE Click here to Upload CROP IMAGE Cancel Crop Close Save changes UPLOAD IMAGE Drop files here to upload Close Save changes UPDATE Hide/Show Section 2 Hide Show Image Upload Upload the image without modifications Crop Crop Image to fit within the image area Section 2 Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 2 Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes CROP IMAGE Click here to Upload CROP IMAGE Cancel Crop Close Save changes UPLOAD IMAGE Drop files here to upload Close Save changes UPDATE Hide/Show Section 3 Hide Show Image Upload Upload the image without modifications Crop Crop Image to fit within the image area Section 3 Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 3 Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes CROP IMAGE Click here to Upload CROP IMAGE Cancel Crop Close Save changes UPLOAD IMAGE Drop files here to upload Close Save changes UPDATE Hide/Show Section 4 Hide Show Image Upload Upload the image without modifications Crop Crop Image to fit within the image area Section 4 Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 4 Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes CROP IMAGE Click here to Upload CROP IMAGE Cancel Crop Close Save changes UPLOAD IMAGE Drop files here to upload Close Save changes UPDATE Hide/Show Section 5 Hide Show Image Upload Upload the image without modifications Crop Crop Image to fit within the image area Section 5 Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 5 Content Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes UPDATE Hide/Show Section 6 Hide Show Section 6 Name 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 6 Content left Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 6 Content center Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Section 6 Content right Normal > Quote Code HEADER 1 HEADER 2 HEADER 3 HEADER 4 HEADER 5 HEADER 6 Background Color Transparent Select Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 1 x 1 Placeholder INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Save changes UPDATE BACKGROUND IMAGE Background Image Drop files here to upload Save changes UPDATE BACKGROUND IMAGE Background Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE BACKGROUND IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save changes UPDATE GALLERY BACKGROUND IMAGE Gallery Background Image Drop files here to upload Save changes UPDATE GALLERY BACKGROUND IMAGE Gallery Background Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE GALLERY BACKGROUND IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save changes UPDATE FOOTER Font color Save Changes UPDATE IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE IMAGE Background Image Drop files here to upload Save changes UPDATE IMAGE Background Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE IMAGE Background Image Drop files here to upload Save changes UPDATE IMAGE Background Image Click here to Upload CROP IMAGE Cancel Crop Save changes UPDATE IMAGE Upload Upload the image without modifications Crop Crop Image to fit within the image area Save Changes UPDATE IMAGE Background Image Drop files here to upload Save changes UPDATE IMAGE Background Image Click here to Upload CROP IMAGE Cancel Crop Save changes EDIT FAQ Question Where is your restaurant located? 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder Where is your restaurant located? INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Answer Our restaurant is located at 444 West Bedford Euless Road, Hurst, TX 76053, USA. 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder Our restaurant is located at 444 West Bedford Euless Road, Hurst, TX 76053, USA. INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues -------------------------------------------------------------------------------- Remove Save EDIT FAQ Question Do you offer Delivery orders at your restaurant? 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder Do you offer Delivery orders at your restaurant? INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Answer Yes. For delivery orders, please order directly from our website to support local restaurants like ours. 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder Yes. For delivery orders, please order directly from our website to support local restaurants like ours. INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues -------------------------------------------------------------------------------- Remove Save EDIT FAQ Question Do you Offer Contact-free delivery? 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder Do you Offer Contact-free delivery? INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Answer Yes we can provide contact free delivery via our 3rd party partners if you select that option during checkout from our website. 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder Yes we can provide contact free delivery via our 3rd party partners if you select that option during checkout from our website. INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues -------------------------------------------------------------------------------- Remove Save EDIT FAQ Question What are your business hours? 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder What are your business hours? INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues Answer You can find our business hours on the website. 15 8 9 10 11 12 14 16 18 20 22 24 28 30 32 36 40 44 48 54 60 72 96 Text Color Reset to default Select 1.0 1.2 1.4 1.5 1.6 1.8 2.0 3.0 Placeholder You can find our business hours on the website. INSERT LINK Text to display To what URL should this link go? Open in new window Use default protocol INSERT IMAGE Select from files Image URL 100%50%25% INSERT VIDEO Video URL (YouTube, Vimeo, Vine, Instagram, DailyMotion or Youku) HELP ESCEscape ENTERInsert Paragraph CTRL+ZUndo the last command CTRL+YRedo the last command TABTab SHIFT+TABUntab CTRL+BSet a bold style CTRL+ISet a italic style CTRL+USet a underline style CTRL+SHIFT+SSet a strikethrough style CTRL+BACKSLASHClean a style CTRL+SHIFT+LSet left align CTRL+SHIFT+ESet center align CTRL+SHIFT+RSet right align CTRL+SHIFT+JSet full align CTRL+SHIFT+NUM7Toggle unordered list CTRL+SHIFT+NUM8Toggle ordered list CTRL+LEFTBRACKETOutdent on current paragraph CTRL+RIGHTBRACKETIndent on current paragraph CTRL+NUM0Change current block's format as a paragraph(P tag) CTRL+NUM1Change current block's format as H1 CTRL+NUM2Change current block's format as H2 CTRL+NUM3Change current block's format as H3 CTRL+NUM4Change current block's format as H4 CTRL+NUM5Change current block's format as H5 CTRL+NUM6Change current block's format as H6 CTRL+ENTERInsert horizontal rule CTRL+KShow Link Dialog Summernote 0.8.18 · Project · Issues -------------------------------------------------------------------------------- Remove Save Order PickUp | Delivery Order PickUp | Delivery Order PickUp | Delivery Order PickUp | Delivery Order PickUp | Delivery Order PickUp | Delivery Order PickUp | Delivery ‹› Order PickUp | Delivery Order PickUp | Delivery Order PickUp | Delivery ‹› ABOUT US At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town! About Us At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town! About Us At Juicy's Homestyle Fried Chicken, located at 444 West Bedford Euless Road, Hurst, TX 76053, we serve up crispy, golden fried chicken with a side of Southern hospitality. Our homestyle recipes are crafted with fresh ingredients and a special blend of seasonings for that perfect, mouthwatering crunch. Whether you're craving a classic meal or some hearty sides, we’ve got the comfort food you're looking for. Come enjoy the best homestyle fried chicken in town! About Us ‹› OUR GALLERY ‹› ADDRESS 444 West Bedford Euless Road, Hurst, TX 76053, USA 817-290-4994 Juicyshfc@gmail.com * Home * About Us * Contact * Menu * Order PickUp | Delivery © 2024 Juicys Homestyle Fried Chicken. All rights reserved. JOBS JOBS We are hiring! Apply below to become a part of our awesome team and we'll get back to you ASAP! Alternatively if you have questions you can call us. Resume: Submit ×