Skip to content

Instantly share code, notes, and snippets.

@Proful

Proful/care-form.html

Created December 19, 2020 04:16
Show Gist options
  • Save Proful/0e51b886ac88fec4a1fe1161c081eaae to your computer and use it in GitHub Desktop.
Save Proful/0e51b886ac88fec4a1fe1161c081eaae to your computer and use it in GitHub Desktop.
Download ZIP
Raw
care-form.html
<body
class="modal-open"
style="padding-right: 0px;"
>
<div
aria-hidden="true"
/>
<div
class="fade modal-backdrop show"
/>
<div
aria-modal="true"
class="fade modal show"
role="dialog"
style="display: block;"
tabindex="-1"
>
<div
class="modal-dialog"
role="document"
>
<div
class="modal-content"
>
<div
class="modal-header"
>
<div
class="modal-title h4"
>
patient.careGoal.new
</div>
<button
class="close"
type="button"
>
<span
aria-hidden="true"
>
×
</span>
<span
class="sr-only"
>
Close
</span>
</button>
</div>
<div
class="modal-body"
>
<form
aria-label="care-goal-form"
>
<div
class="row"
>
<div
class="col-sm-12"
>
<div
class="form-group"
>
<div>
<label
class="form-label"
for="descriptionTextField"
title="This is a required input"
>
patient.careGoal.description
<i
style="color: red;"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-asterisk fa-w-16 "
data-icon="asterisk"
data-prefix="fas"
focusable="false"
role="img"
style="height: 7px; vertical-align: top; margin-left: 2px;"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M478.21 334.093L336 256l142.21-78.093c11.795-6.477 15.961-21.384 9.232-33.037l-19.48-33.741c-6.728-11.653-21.72-15.499-33.227-8.523L296 186.718l3.475-162.204C299.763 11.061 288.937 0 275.48 0h-38.96c-13.456 0-24.283 11.061-23.994 24.514L216 186.718 77.265 102.607c-11.506-6.976-26.499-3.13-33.227 8.523l-19.48 33.741c-6.728 11.653-2.562 26.56 9.233 33.037L176 256 33.79 334.093c-11.795 6.477-15.961 21.384-9.232 33.037l19.48 33.741c6.728 11.653 21.721 15.499 33.227 8.523L216 325.282l-3.475 162.204C212.237 500.939 223.064 512 236.52 512h38.961c13.456 0 24.283-11.061 23.995-24.514L296 325.282l138.735 84.111c11.506 6.976 26.499 3.13 33.227-8.523l19.48-33.741c6.728-11.653 2.563-26.559-9.232-33.036z"
fill="currentColor"
/>
</svg>
</i>
</label>
</div>
<div
class="form-group"
>
<textarea
class="form-control"
rows="4"
/>
<div
class="invalid-feedback"
/>
</div>
</div>
</div>
</div>
<div
class="row"
>
<div
class="col-sm-12"
>
<div
class="form-group"
>
<div>
<label
class="form-label"
for="prioritySelect"
title="This is a required input"
>
patient.careGoal.priority.label
<i
style="color: red;"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-asterisk fa-w-16 "
data-icon="asterisk"
data-prefix="fas"
focusable="false"
role="img"
style="height: 7px; vertical-align: top; margin-left: 2px;"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M478.21 334.093L336 256l142.21-78.093c11.795-6.477 15.961-21.384 9.232-33.037l-19.48-33.741c-6.728-11.653-21.72-15.499-33.227-8.523L296 186.718l3.475-162.204C299.763 11.061 288.937 0 275.48 0h-38.96c-13.456 0-24.283 11.061-23.994 24.514L216 186.718 77.265 102.607c-11.506-6.976-26.499-3.13-33.227 8.523l-19.48 33.741c-6.728 11.653-2.562 26.56 9.233 33.037L176 256 33.79 334.093c-11.795 6.477-15.961 21.384-9.232 33.037l19.48 33.741c6.728 11.653 21.721 15.499 33.227 8.523L216 325.282l-3.475 162.204C212.237 500.939 223.064 512 236.52 512h38.961c13.456 0 24.283-11.061 23.995-24.514L296 325.282l138.735 84.111c11.506 6.976 26.499 3.13 33.227-8.523l19.48-33.741c6.728-11.653 2.563-26.559-9.232-33.036z"
fill="currentColor"
/>
</svg>
</i>
</label>
</div>
<div
class="rbt"
style="outline: none; position: relative;"
tabindex="-1"
>
<div
style="display: flex; flex: 1; height: 100%; position: relative;"
>
<input
aria-autocomplete="both"
aria-expanded="false"
aria-haspopup="listbox"
autocomplete="off"
class="rbt-input-main form-control rbt-input"
placeholder="-- Choose --"
role="combobox"
type="text"
value="patient.careGoal.priority.medium"
/>
<input
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%;"
tabindex="-1"
value=""
/>
</div>
</div>
</div>
</div>
</div>
<div
class="row"
>
<div
class="col-sm-6"
>
<div
class="form-group"
>
<div>
<label
class="form-label"
for="statusSelect"
title="This is a required input"
>
patient.careGoal.status
<i
style="color: red;"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-asterisk fa-w-16 "
data-icon="asterisk"
data-prefix="fas"
focusable="false"
role="img"
style="height: 7px; vertical-align: top; margin-left: 2px;"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M478.21 334.093L336 256l142.21-78.093c11.795-6.477 15.961-21.384 9.232-33.037l-19.48-33.741c-6.728-11.653-21.72-15.499-33.227-8.523L296 186.718l3.475-162.204C299.763 11.061 288.937 0 275.48 0h-38.96c-13.456 0-24.283 11.061-23.994 24.514L216 186.718 77.265 102.607c-11.506-6.976-26.499-3.13-33.227 8.523l-19.48 33.741c-6.728 11.653-2.562 26.56 9.233 33.037L176 256 33.79 334.093c-11.795 6.477-15.961 21.384-9.232 33.037l19.48 33.741c6.728 11.653 21.721 15.499 33.227 8.523L216 325.282l-3.475 162.204C212.237 500.939 223.064 512 236.52 512h38.961c13.456 0 24.283-11.061 23.995-24.514L296 325.282l138.735 84.111c11.506 6.976 26.499 3.13 33.227-8.523l19.48-33.741c6.728-11.653 2.563-26.559-9.232-33.036z"
fill="currentColor"
/>
</svg>
</i>
</label>
</div>
<div
class="rbt"
style="outline: none; position: relative;"
tabindex="-1"
>
<div
style="display: flex; flex: 1; height: 100%; position: relative;"
>
<input
aria-autocomplete="both"
aria-expanded="false"
aria-haspopup="listbox"
autocomplete="off"
class="rbt-input-main form-control rbt-input"
placeholder="-- Choose --"
role="combobox"
type="text"
value="accepted"
/>
<input
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%;"
tabindex="-1"
value=""
/>
</div>
</div>
</div>
</div>
<div
class="col-sm-6"
>
<div
class="form-group"
>
<div>
<label
class="form-label"
for="achievementStatusSelect"
title="This is a required input"
>
patient.careGoal.achievementStatus
<i
style="color: red;"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-asterisk fa-w-16 "
data-icon="asterisk"
data-prefix="fas"
focusable="false"
role="img"
style="height: 7px; vertical-align: top; margin-left: 2px;"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M478.21 334.093L336 256l142.21-78.093c11.795-6.477 15.961-21.384 9.232-33.037l-19.48-33.741c-6.728-11.653-21.72-15.499-33.227-8.523L296 186.718l3.475-162.204C299.763 11.061 288.937 0 275.48 0h-38.96c-13.456 0-24.283 11.061-23.994 24.514L216 186.718 77.265 102.607c-11.506-6.976-26.499-3.13-33.227 8.523l-19.48 33.741c-6.728 11.653-2.562 26.56 9.233 33.037L176 256 33.79 334.093c-11.795 6.477-15.961 21.384-9.232 33.037l19.48 33.741c6.728 11.653 21.721 15.499 33.227 8.523L216 325.282l-3.475 162.204C212.237 500.939 223.064 512 236.52 512h38.961c13.456 0 24.283-11.061 23.995-24.514L296 325.282l138.735 84.111c11.506 6.976 26.499 3.13 33.227-8.523l19.48-33.741c6.728-11.653 2.563-26.559-9.232-33.036z"
fill="currentColor"
/>
</svg>
</i>
</label>
</div>
<div
class="rbt"
style="outline: none; position: relative;"
tabindex="-1"
>
<div
style="display: flex; flex: 1; height: 100%; position: relative;"
>
<input
aria-autocomplete="both"
aria-expanded="false"
aria-haspopup="listbox"
autocomplete="off"
class="rbt-input-main form-control rbt-input"
placeholder="-- Choose --"
role="combobox"
type="text"
value="in progress"
/>
<input
aria-hidden="true"
class="rbt-input-hint"
readonly=""
style="background-color: transparent; border-color: transparent; box-shadow: none; color: rgba(0, 0, 0, 0.35); left: 0px; pointer-events: none; position: absolute; top: 0px; width: 100%;"
tabindex="-1"
value=""
/>
</div>
</div>
</div>
</div>
</div>
<div
class="row"
>
<div
class="col-sm-6"
>
<div
class="form-group"
>
<div>
<label
class="form-label"
for="startDateDatePicker"
title="This is a required input"
>
patient.careGoal.startDate
<i
style="color: red;"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-asterisk fa-w-16 "
data-icon="asterisk"
data-prefix="fas"
focusable="false"
role="img"
style="height: 7px; vertical-align: top; margin-left: 2px;"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M478.21 334.093L336 256l142.21-78.093c11.795-6.477 15.961-21.384 9.232-33.037l-19.48-33.741c-6.728-11.653-21.72-15.499-33.227-8.523L296 186.718l3.475-162.204C299.763 11.061 288.937 0 275.48 0h-38.96c-13.456 0-24.283 11.061-23.994 24.514L216 186.718 77.265 102.607c-11.506-6.976-26.499-3.13-33.227 8.523l-19.48 33.741c-6.728 11.653-2.562 26.56 9.233 33.037L176 256 33.79 334.093c-11.795 6.477-15.961 21.384-9.232 33.037l19.48 33.741c6.728 11.653 21.721 15.499 33.227 8.523L216 325.282l-3.475 162.204C212.237 500.939 223.064 512 236.52 512h38.961c13.456 0 24.283-11.061 23.995-24.514L296 325.282l138.735 84.111c11.506 6.976 26.499 3.13 33.227-8.523l19.48-33.741c6.728-11.653 2.563-26.559-9.232-33.036z"
fill="currentColor"
/>
</svg>
</i>
</label>
</div>
<div
class="input-group"
>
<div
class="input-group-prepend"
>
<span
class="input-group-text"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-calendar-alt fa-w-14 fa-1x "
data-icon="calendar-alt"
data-prefix="fas"
focusable="false"
role="img"
viewBox="0 0 448 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M0 464c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V192H0v272zm320-196c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zM192 268c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zM64 268c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H76c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H76c-6.6 0-12-5.4-12-12v-40zM400 64h-48V16c0-8.8-7.2-16-16-16h-32c-8.8 0-16 7.2-16 16v48H160V16c0-8.8-7.2-16-16-16h-32c-8.8 0-16 7.2-16 16v48H48C21.5 64 0 85.5 0 112v48h448v-48c0-26.5-21.5-48-48-48z"
fill="currentColor"
/>
</svg>
</span>
</div>
<div
class="react-datepicker-wrapper"
>
<div
class="react-datepicker__input-container"
>
<input
class="form-control "
type="text"
value="12/19/2020"
/>
</div>
</div>
</div>
<div
class="text-left ml-5 mt-1 text-small undefined"
/>
</div>
</div>
<div
class="col-sm-6"
>
<div
class="form-group"
>
<div>
<label
class="form-label"
for="dueDateDatePicker"
title="This is a required input"
>
patient.careGoal.dueDate
<i
style="color: red;"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-asterisk fa-w-16 "
data-icon="asterisk"
data-prefix="fas"
focusable="false"
role="img"
style="height: 7px; vertical-align: top; margin-left: 2px;"
viewBox="0 0 512 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M478.21 334.093L336 256l142.21-78.093c11.795-6.477 15.961-21.384 9.232-33.037l-19.48-33.741c-6.728-11.653-21.72-15.499-33.227-8.523L296 186.718l3.475-162.204C299.763 11.061 288.937 0 275.48 0h-38.96c-13.456 0-24.283 11.061-23.994 24.514L216 186.718 77.265 102.607c-11.506-6.976-26.499-3.13-33.227 8.523l-19.48 33.741c-6.728 11.653-2.562 26.56 9.233 33.037L176 256 33.79 334.093c-11.795 6.477-15.961 21.384-9.232 33.037l19.48 33.741c6.728 11.653 21.721 15.499 33.227 8.523L216 325.282l-3.475 162.204C212.237 500.939 223.064 512 236.52 512h38.961c13.456 0 24.283-11.061 23.995-24.514L296 325.282l138.735 84.111c11.506 6.976 26.499 3.13 33.227-8.523l19.48-33.741c6.728-11.653 2.563-26.559-9.232-33.036z"
fill="currentColor"
/>
</svg>
</i>
</label>
</div>
<div
class="input-group"
>
<div
class="input-group-prepend"
>
<span
class="input-group-text"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-calendar-alt fa-w-14 fa-1x "
data-icon="calendar-alt"
data-prefix="fas"
focusable="false"
role="img"
viewBox="0 0 448 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M0 464c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V192H0v272zm320-196c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zM192 268c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12h-40c-6.6 0-12-5.4-12-12v-40zM64 268c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H76c-6.6 0-12-5.4-12-12v-40zm0 128c0-6.6 5.4-12 12-12h40c6.6 0 12 5.4 12 12v40c0 6.6-5.4 12-12 12H76c-6.6 0-12-5.4-12-12v-40zM400 64h-48V16c0-8.8-7.2-16-16-16h-32c-8.8 0-16 7.2-16 16v48H160V16c0-8.8-7.2-16-16-16h-32c-8.8 0-16 7.2-16 16v48H48C21.5 64 0 85.5 0 112v48h448v-48c0-26.5-21.5-48-48-48z"
fill="currentColor"
/>
</svg>
</span>
</div>
<div
class="react-datepicker-wrapper"
>
<div
class="react-datepicker__input-container"
>
<input
class="form-control "
type="text"
value="01/19/2021"
/>
</div>
</div>
</div>
<div
class="text-left ml-5 mt-1 text-small undefined"
/>
</div>
</div>
</div>
<div
class="row"
>
<div
class="col-sm-12"
>
<div
class="form-group"
>
<label
class="form-label"
for="noteTextField"
>
patient.careGoal.note
</label>
<div
class="form-group"
>
<textarea
class="form-control"
rows="4"
/>
<div
class="invalid-feedback"
/>
</div>
</div>
</div>
</div>
</form>
</div>
<div
class="modal-footer"
style="justify-content: space-between;"
>
<button
class="btn btn-danger"
type="button"
>
actions.cancel
</button>
<button
class="btn btn-success"
type="button"
>
<svg
aria-hidden="true"
class="svg-inline--fa fa-plus fa-w-14 fa-1x "
data-icon="plus"
data-prefix="fas"
focusable="false"
role="img"
viewBox="0 0 448 512"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"
fill="currentColor"
/>
</svg>
patient.careGoal.new
</button>
</div>
</div>
</div>
</div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment