').addClass(this.$element.prop("checked")?this._onstyle:this._offstyle+" off").addClass(b).addClass(this.options.style);this.$element.wrap(g),a.extend(this,{$toggle:this.$element.parent(),$toggleOn:c,$toggleOff:d,$toggleGroup:f}),this.$toggle.append(f);var h=this.options.width||Math.max(c.outerWidth(),d.outerWidth())+e.outerWidth()/2,i=this.options.height||Math.max(c.outerHeight(),d.outerHeight());c.addClass("toggle-on"),d.addClass("toggle-off"),this.$toggle.css({width:h,height:i}),this.options.height&&(c.css("line-height",c.height()+"px"),d.css("line-height",d.height()+"px")),this.update(!0),this.trigger(!0)},c.prototype.toggle=function(){this.$element.prop("checked")?this.off():this.on()},c.prototype.on=function(a){return this.$element.prop("disabled")?!1:(this.$toggle.removeClass(this._offstyle+" off").addClass(this._onstyle),this.$element.prop("checked",!0),void(a||this.trigger()))},c.prototype.off=function(a){return this.$element.prop("disabled")?!1:(this.$toggle.removeClass(this._onstyle).addClass(this._offstyle+" off"),this.$element.prop("checked",!1),void(a||this.trigger()))},c.prototype.enable=function(){this.$toggle.removeAttr("disabled"),this.$element.prop("disabled",!1)},c.prototype.disable=function(){this.$toggle.attr("disabled","disabled"),this.$element.prop("disabled",!0)},c.prototype.update=function(a){this.$element.prop("disabled")?this.disable():this.enable(),this.$element.prop("checked")?this.on(a):this.off(a)},c.prototype.trigger=function(b){this.$element.off("change.bs.toggle"),b||this.$element.change(),this.$element.on("change.bs.toggle",a.proxy(function(){this.update()},this))},c.prototype.destroy=function(){this.$element.off("change.bs.toggle"),this.$toggleGroup.remove(),this.$element.removeData("bs.toggle"),this.$element.unwrap()};var d=a.fn.bootstrapToggle;a.fn.bootstrapToggle=b,a.fn.bootstrapToggle.Constructor=c,a.fn.toggle.noConflict=function(){return a.fn.bootstrapToggle=d,this},a(function(){a("input[type=checkbox][data-toggle^=toggle]").bootstrapToggle()}),a(document).on("click.bs.toggle","div[data-toggle^=toggle]",function(b){var c=a(this).find("input[type=checkbox]");c.bootstrapToggle("toggle"),b.preventDefault()})}(jQuery);
9 | //# sourceMappingURL=bootstrap-toggle.min.js.map
--------------------------------------------------------------------------------
/src/components/MedicineTypes.js:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import AdminHeader from "./layouts/AdminHeader";
3 | import AdminSideBar from "./layouts/AdminSideBar";
4 | import AdminFooter from "./layouts/AdminFooter";
5 | import { Link } from "react-router-dom";
6 | import { db } from "../firebase";
7 | import { collection, getDocs, doc, deleteDoc } from "firebase/firestore";
8 |
9 | export default function MedicineTypes() {
10 | var counter = 1;
11 | const [medTypes, setMedTypes] = useState([]);
12 | const medTypesCollectionRef = collection(db, "medicine_types");
13 | const getTypes = async () => {
14 | const data = await getDocs(medTypesCollectionRef);
15 | setMedTypes(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
16 | };
17 | const handleDeleteButton = async (id) => {
18 | const categoryDoc = doc(medTypesCollectionRef, id);
19 | await deleteDoc(categoryDoc);
20 | getTypes();
21 | };
22 | useEffect(() => {
23 | getTypes();
24 | }, []);
25 | return (
26 | <>
27 |
28 |
29 |
30 |
31 |
32 |
Medicine Types
33 |
34 |
35 |
36 |
37 |
38 | Types List{" "}
39 |
40 | Add new Type
41 | {" "}
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | | # |
50 | Type Name |
51 | Action |
52 |
53 |
54 |
55 | {medTypes.map((medType) => {
56 | return (
57 |
58 | | {counter++} |
59 | {medType.name} |
60 |
61 |
62 |
63 |
74 |
75 |
83 |
84 | |
85 |
86 | );
87 | })}
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 | >
100 | );
101 | }
102 |
--------------------------------------------------------------------------------
/src/components/MedicineCategory.js:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import { Link } from "react-router-dom";
3 | import AdminHeader from "./layouts/AdminHeader";
4 | import AdminSideBar from "./layouts/AdminSideBar";
5 | import AdminFooter from "./layouts/AdminFooter";
6 | import { db } from "../firebase";
7 | import { collection, getDocs, doc, deleteDoc } from "firebase/firestore";
8 |
9 | export default function MedicineCategory(props) {
10 | var counter = 1;
11 | const [categories, setCategories] = useState([]);
12 | const categoriesCollectionReference = collection(db, "medicine_categories");
13 | const getCategories = async () => {
14 | const data = await getDocs(categoriesCollectionReference);
15 | setCategories(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
16 | };
17 | const handleDeleteButton = async (id) => {
18 | const categoryDoc = doc(categoriesCollectionReference, id);
19 | await deleteDoc(categoryDoc);
20 | getCategories();
21 | };
22 | useEffect(() => {
23 | getCategories();
24 | }, []);
25 | return (
26 | <>
27 |
28 |
29 |
30 |
31 |
32 |
Medicine Categories
33 |
34 |
35 |
36 |
37 |
38 | Categories List{" "}
39 |
40 | Add new Category
41 | {" "}
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | | # |
50 | Category Name |
51 | Action |
52 |
53 |
54 |
55 | {categories.map((category) => {
56 | return (
57 |
58 | | {counter++} |
59 | {category.name} |
60 |
61 |
62 |
63 |
74 |
75 |
83 |
84 | |
85 |
86 | );
87 | })}
88 |
89 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 | >
100 | );
101 | }
102 |
--------------------------------------------------------------------------------
/src/components/AdminRegister.js:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import { Link, useNavigate } from "react-router-dom";
3 | import { createUserWithEmailAndPassword, updateProfile } from "firebase/auth";
4 | import { auth } from "../firebase";
5 |
6 | export default function AdminRegister() {
7 | const navigate = useNavigate();
8 | useEffect(() => {
9 | auth.onAuthStateChanged((user) => {
10 | if (user) {
11 | navigate("/");
12 | }
13 | });
14 | }, []);
15 | const [values, setValues] = useState({
16 | name: "",
17 | email: "",
18 | password: "",
19 | confirmPassword: "",
20 | });
21 | const [errorMsg, setErrorMsg] = useState("");
22 | const [successMsg, setSuccessMsg] = useState("");
23 |
24 | const handleSubmission = () => {
25 | if (values.name && values.email && values.password && values.confirmPassword) {
26 | setErrorMsg("");
27 | if (values.password === values.confirmPassword) {
28 | createUserWithEmailAndPassword(auth, values.email, values.password)
29 | .then(async (response) => {
30 | const user = response.user;
31 | await updateProfile(user, {
32 | displayName: values.name,
33 | });
34 | setSuccessMsg("Registration done successfully!");
35 | setTimeout(() => {
36 | setSuccessMsg("");
37 | navigate("/");
38 | }, 3000);
39 | })
40 | .catch((err) => {
41 | console.log(err);
42 | });
43 | } else {
44 | setErrorMsg("Passwords don't match!");
45 | }
46 | } else {
47 | setErrorMsg("Please fill out all required fields");
48 | }
49 | };
50 |
51 | return (
52 | <>
53 |
54 |
55 |
56 |
57 |
MediCare
58 | Register
59 |
60 |
61 |
62 |
63 |
64 |
65 | setValues((prev) => ({ ...prev, name: event.target.value }))}
71 | />
72 |
73 |
74 |
75 |
82 | setValues((prev) => ({ ...prev, email: event.target.value }))
83 | }
84 | />
85 |
86 |
87 |
88 |
94 | setValues((prev) => ({ ...prev, password: event.target.value }))
95 | }
96 | />
97 |
98 |
99 |
100 |
106 | setValues((prev) => ({ ...prev, confirmPassword: event.target.value }))
107 | }
108 | />
109 |
110 |
{errorMsg}
111 |
{successMsg}
112 |
113 |
119 |
120 |
121 | Already have an account? Login here!
122 |
123 |
124 |
125 |
126 |
127 | >
128 | );
129 | }
130 |
--------------------------------------------------------------------------------
/src/components/Inventory.js:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import AdminHeader from "./layouts/AdminHeader";
3 | import AdminSideBar from "./layouts/AdminSideBar";
4 | import AdminFooter from "./layouts/AdminFooter";
5 | import { Link } from "react-router-dom";
6 | import { db } from "../firebase";
7 | import { collection, getDocs, doc, deleteDoc } from "firebase/firestore";
8 |
9 | export default function Inventory() {
10 | var counter = 1;
11 | const [medicines, setMedicines] = useState([]);
12 | const medicinesCollectionRef = collection(db, "medicine_inventory");
13 | const getTypes = async () => {
14 | const data = await getDocs(medicinesCollectionRef);
15 | setMedicines(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
16 | };
17 | const handleDeleteButton = async (id) => {
18 | const medDoc = doc(medicinesCollectionRef, id);
19 | await deleteDoc(medDoc);
20 | getTypes();
21 | };
22 | useEffect(() => {
23 | getTypes();
24 | }, []);
25 | return (
26 | <>
27 |
28 |
29 |
30 |
31 |
32 |
Medicine Inventory
33 |
34 |
35 |
36 |
37 |
38 | Inventory List{" "}
39 |
40 | Add new Medicine
41 | {" "}
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | | # |
50 |
51 | Medicine NamePower
52 | |
53 | Medicine Category |
54 | Medicine Type |
55 | Medicine Price |
56 | Stock |
57 | Action |
58 |
59 |
60 |
61 | {medicines.map((medicine) => {
62 | return (
63 |
64 | | {counter++} |
65 |
66 | {medicine.name} {medicine.power}
67 | |
68 | {medicine.category} |
69 | {medicine.type} |
70 | ₹{medicine.price} |
71 | {medicine.stock} |
72 |
73 |
74 |
75 |
86 |
87 |
95 |
96 | |
97 |
98 | );
99 | })}
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 | >
112 | );
113 | }
114 |
--------------------------------------------------------------------------------
/public/assets/js/plugin/chart-circle/circles.min.js:
--------------------------------------------------------------------------------
1 | /**
2 | * circles - v0.0.6 - 2015-11-27
3 | *
4 | * Copyright (c) 2015 lugolabs
5 | * Licensed
6 | */
7 | !function(a,b){"object"==typeof exports?module.exports=b():"function"==typeof define&&define.amd?define([],b):a.Circles=b()}(this,function(){"use strict";var a=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a){setTimeout(a,1e3/60)},b=function(a){var b=a.id;if(this._el=document.getElementById(b),null!==this._el){this._radius=a.radius||10,this._duration=void 0===a.duration?500:a.duration,this._value=0,this._maxValue=a.maxValue||100,this._text=void 0===a.text?function(a){return this.htmlifyNumber(a)}:a.text,this._strokeWidth=a.width||10,this._colors=a.colors||["#EEE","#F00"],this._svg=null,this._movingPath=null,this._wrapContainer=null,this._textContainer=null,this._wrpClass=a.wrpClass||"circles-wrp",this._textClass=a.textClass||"circles-text",this._valClass=a.valueStrokeClass||"circles-valueStroke",this._maxValClass=a.maxValueStrokeClass||"circles-maxValueStroke",this._styleWrapper=a.styleWrapper===!1?!1:!0,this._styleText=a.styleText===!1?!1:!0;var c=Math.PI/180*270;this._start=-Math.PI/180*90,this._startPrecise=this._precise(this._start),this._circ=c-this._start,this._generate().update(a.value||0)}};return b.prototype={VERSION:"0.0.6",_generate:function(){return this._svgSize=2*this._radius,this._radiusAdjusted=this._radius-this._strokeWidth/2,this._generateSvg()._generateText()._generateWrapper(),this._el.innerHTML="",this._el.appendChild(this._wrapContainer),this},_setPercentage:function(a){this._movingPath.setAttribute("d",this._calculatePath(a,!0)),this._textContainer.innerHTML=this._getText(this.getValueFromPercent(a))},_generateWrapper:function(){return this._wrapContainer=document.createElement("div"),this._wrapContainer.className=this._wrpClass,this._styleWrapper&&(this._wrapContainer.style.position="relative",this._wrapContainer.style.display="inline-block"),this._wrapContainer.appendChild(this._svg),this._wrapContainer.appendChild(this._textContainer),this},_generateText:function(){if(this._textContainer=document.createElement("div"),this._textContainer.className=this._textClass,this._styleText){var a={position:"absolute",top:0,left:0,textAlign:"center",width:"100%",fontSize:.7*this._radius+"px",height:this._svgSize+"px",lineHeight:this._svgSize+"px"};for(var b in a)this._textContainer.style[b]=a[b]}return this._textContainer.innerHTML=this._getText(0),this},_getText:function(a){return this._text?(void 0===a&&(a=this._value),a=parseFloat(a.toFixed(2)),"function"==typeof this._text?this._text.call(this,a):this._text):""},_generateSvg:function(){return this._svg=document.createElementNS("http://www.w3.org/2000/svg","svg"),this._svg.setAttribute("xmlns","http://www.w3.org/2000/svg"),this._svg.setAttribute("width",this._svgSize),this._svg.setAttribute("height",this._svgSize),this._generatePath(100,!1,this._colors[0],this._maxValClass)._generatePath(1,!0,this._colors[1],this._valClass),this._movingPath=this._svg.getElementsByTagName("path")[1],this},_generatePath:function(a,b,c,d){var e=document.createElementNS("http://www.w3.org/2000/svg","path");return e.setAttribute("fill","transparent"),e.setAttribute("stroke",c),e.setAttribute("stroke-width",this._strokeWidth),e.setAttribute("d",this._calculatePath(a,b)),e.setAttribute("class",d),this._svg.appendChild(e),this},_calculatePath:function(a,b){var c=this._start+a/100*this._circ,d=this._precise(c);return this._arc(d,b)},_arc:function(a,b){var c=a-.001,d=a-this._startPrecise
'+d[0]+"";return d.length>1&&(e+='.'+d[1].substring(0,2)+""),e},updateRadius:function(a){return this._radius=a,this._generate().update(!0)},updateWidth:function(a){return this._strokeWidth=a,this._generate().update(!0)},updateColors:function(a){this._colors=a;var b=this._svg.getElementsByTagName("path");return b[0].setAttribute("stroke",a[0]),b[1].setAttribute("stroke",a[1]),this},getPercent:function(){return 100*this._value/this._maxValue},getValueFromPercent:function(a){return this._maxValue*a/100},getValue:function(){return this._value},getMaxValue:function(){return this._maxValue},update:function(b,c){if(b===!0)return this._setPercentage(this.getPercent()),this;if(this._value==b||isNaN(b))return this;void 0===c&&(c=this._duration);var d,e,f,g,h=this,i=h.getPercent(),j=1;return this._value=Math.min(this._maxValue,Math.max(0,b)),c?(d=h.getPercent(),e=d>i,j+=d%1,f=Math.floor(Math.abs(d-i)/j),g=c/f,function k(b){if(e?i+=j:i-=j,e&&i>=d||!e&&d>=i)return void a(function(){h._setPercentage(d)});a(function(){h._setPercentage(i)});var c=Date.now(),f=c-b;f>=g?k(c):setTimeout(function(){k(Date.now())},g-f)}(Date.now()),this):(this._setPercentage(this.getPercent()),this)}},b.create=function(a){return new b(a)},b});
--------------------------------------------------------------------------------
/public/assets/sass/ready/components/_cards.scss:
--------------------------------------------------------------------------------
1 | /* Card */
2 |
3 | .card {
4 | border-radius: 0px;
5 | background-color: $white-color;
6 | margin-bottom: 30px;
7 | -webkit-box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.08);
8 | -moz-box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.08);
9 | box-shadow: 0px 1px 15px 1px rgba(69, 65, 78, 0.08);
10 | border: 1px solid #eee;
11 | .card-header {
12 | padding: 15px 15px;
13 | background-color: $transparent-bg;
14 | border-bottom: 1px solid #ebedf2 !important;
15 | }
16 | .card-title {
17 | margin: 0;
18 | color: $body-text-color;
19 | font-size: 18px;
20 | font-weight: $font-weight-bold;
21 | line-height: 1.6;
22 | }
23 | .card-sub {
24 | display: block;
25 | margin: 5px 0 10px 0;
26 | font-size: .9rem;
27 | background: #f7f8fa;
28 | color: $body-text-color;
29 | padding: 0.85rem 1.5rem;
30 | border-radius: 4px;
31 | }
32 | .card-category {
33 | margin-top: 5px;
34 | font-size: 14px;
35 | font-weight: $font-weight-normal;
36 | color: #9A9A9A;
37 | margin-bottom: 0px;
38 | }
39 | label {
40 | font-size: 14px;
41 | font-weight: $font-weight-normal;
42 | color: #9A9A9A;
43 | margin-bottom: 0px;
44 | }
45 | .card-body {
46 | padding: 15px 15px 10px 15px;
47 | }
48 | .card-footer {
49 | background-color: $transparent-bg;
50 | line-height: 30px;
51 | border-top: 1px solid #ebedf2 !important;
52 | font-size: 14px;
53 | }
54 | .card-action {
55 | padding: 30px;
56 | background-color: $transparent-bg;
57 | line-height: 30px;
58 | border-top: 1px solid #ebedf2 !important;
59 | font-size: 14px;
60 | }
61 | .card-footer {
62 | hr {
63 | margin-top: 5px;
64 | margin-bottom: 5px;
65 | }
66 | .legend {
67 | display: inline-block;
68 | }
69 | }
70 | }
71 |
72 | .card-stats {
73 | .card-category {
74 | margin-top: 0px;
75 | }
76 | .icon-big {
77 | font-size: 3em;
78 | min-height: 64px;
79 | }
80 | }
81 |
82 | .card-tasks {
83 | .table {
84 | thead th {
85 | border-top: 1px solid #f4f4f4;
86 | background: #fafafa !important;
87 | }
88 | .form-check {
89 | padding: 0 0 0 0.75rem !important;
90 | label {
91 | margin-bottom: 0px !important;
92 | }
93 | }
94 | tbody td:first-child, thead th:first-child {
95 | padding-left: 15px;
96 | padding-right: 15px;
97 | }
98 | tbody td:last-child, thead th:last-child {
99 | padding-right: 15px;
100 | }
101 | }
102 | .card-body .table td {
103 | font-size: 14px;
104 | line-height: 1.8;
105 | .btn {
106 | font-size: 17px;
107 | opacity: 0.7;
108 | transition: all .3s;
109 | }
110 | &:hover .btn {
111 | opacity: 1;
112 | }
113 | }
114 | }
115 |
116 | .card-default, .card-primary, .card-info, .card-success, .card-warning, .card-danger {
117 | color: $white-color;
118 | border: 0px;
119 | }
120 |
121 | .card-default .card-header, .card-primary .card-header, .card-info .card-header, .card-success .card-header, .card-warning .card-header, .card-danger .card-header {
122 | border-bottom: $transparent-bg !important;
123 | }
124 |
125 | .card-default .card-category, .card-primary .card-category, .card-info .card-category, .card-success .card-category, .card-warning .card-category, .card-danger .card-category, .card-default .card-title, .card-primary .card-title, .card-info .card-title, .card-success .card-title, .card-warning .card-title, .card-danger .card-title, .card-default label, .card-primary label, .card-info label, .card-success label, .card-warning label, .card-danger label {
126 | color: $white-color;
127 | }
128 |
129 | .card-default .icon-big > i, .card-primary .icon-big > i, .card-info .icon-big > i, .card-success .icon-big > i, .card-warning .icon-big > i, .card-danger .icon-big > i {
130 | color: $white-color !important;
131 | }
132 |
133 | .card-default .card-footer, .card-primary .card-footer, .card-info .card-footer, .card-success .card-footer, .card-warning .card-footer, .card-danger .card-footer {
134 | border-top: $transparent-bg !important;
135 | }
136 |
137 | .card-default {
138 | background: $default-color;
139 | }
140 |
141 | .card-primary {
142 | background: $primary-color;
143 | }
144 |
145 | .card-info {
146 | background: $info-color;
147 | }
148 |
149 | .card-success {
150 | background: $success-color;
151 | }
152 |
153 | .card-warning {
154 | background: $warning-color;
155 | }
156 |
157 | .card-danger {
158 | background: $danger-color;
159 | }
160 |
161 | /* Progress Card */
162 |
163 | .progress-card {
164 | margin-bottom: 25px;
165 | }
166 |
167 | /* Row Card No Padding */
168 |
169 | .row-card-no-pd {
170 | margin-left: 0;
171 | margin-right: 0;
172 | background: $white-color;
173 | margin-bottom: 30px;
174 | padding-top: 30px;
175 | padding-bottom: 30px;
176 | position: relative;
177 | .card {
178 | margin-bottom: 0px;
179 | border-width: 0px;
180 | box-shadow: none;
181 | position: unset;
182 | }
183 | [class*=col-] .card:after {
184 | position: absolute;
185 | height: calc(100%);
186 | width: 1px;
187 | background: #eee;
188 | content: '';
189 | right: 0px;
190 | &:last-child {
191 | width: 0px;
192 | }
193 | }
194 | }
--------------------------------------------------------------------------------
/public/assets/sass/ready/plugins/_jqueryui.scss:
--------------------------------------------------------------------------------
1 | .ui-draggable-handle {
2 | -ms-touch-action: none;
3 | touch-action: none;
4 | }
5 |
6 | .ui-helper-hidden {
7 | display: none;
8 | }
9 |
10 | .ui-helper-hidden-accessible {
11 | border: 0;
12 | clip: rect(0 0 0 0);
13 | height: 1px;
14 | margin: -1px;
15 | overflow: hidden;
16 | padding: 0;
17 | position: absolute;
18 | width: 1px;
19 | }
20 |
21 | .ui-helper-reset {
22 | margin: 0;
23 | padding: 0;
24 | border: 0;
25 | outline: 0;
26 | line-height: 1.3;
27 | text-decoration: none;
28 | font-size: 100%;
29 | list-style: none;
30 | }
31 |
32 | .ui-helper-clearfix {
33 | &:after, &:before {
34 | content: "";
35 | display: table;
36 | border-collapse: collapse;
37 | }
38 | &:after {
39 | clear: both;
40 | }
41 | }
42 |
43 | .ui-helper-zfix {
44 | width: 100%;
45 | height: 100%;
46 | top: 0;
47 | left: 0;
48 | position: absolute;
49 | opacity: 0;
50 | filter: Alpha(Opacity = 0);
51 | }
52 |
53 | .ui-front {
54 | z-index: 100;
55 | }
56 |
57 | .ui-state-disabled {
58 | cursor: default !important;
59 | pointer-events: none;
60 | }
61 |
62 | .ui-icon {
63 | display: inline-block;
64 | vertical-align: middle;
65 | margin-top: -.25em;
66 | position: relative;
67 | text-indent: -99999px;
68 | overflow: hidden;
69 | background-repeat: no-repeat;
70 | }
71 |
72 | .ui-widget-icon-block {
73 | left: 50%;
74 | margin-left: -8px;
75 | display: block;
76 | }
77 |
78 | .ui-widget-overlay {
79 | position: fixed;
80 | top: 0;
81 | left: 0;
82 | width: 100%;
83 | height: 100%;
84 | }
85 |
86 | .ui-resizable {
87 | position: relative;
88 | }
89 |
90 | .ui-resizable-handle {
91 | position: absolute;
92 | font-size: .1px;
93 | display: block;
94 | -ms-touch-action: none;
95 | touch-action: none;
96 | }
97 |
98 | .ui-resizable-autohide .ui-resizable-handle, .ui-resizable-disabled .ui-resizable-handle {
99 | display: none;
100 | }
101 |
102 | .ui-resizable-n {
103 | cursor: n-resize;
104 | height: 7px;
105 | width: 100%;
106 | top: -5px;
107 | left: 0;
108 | }
109 |
110 | .ui-resizable-s {
111 | cursor: s-resize;
112 | height: 7px;
113 | width: 100%;
114 | bottom: -5px;
115 | left: 0;
116 | }
117 |
118 | .ui-resizable-e {
119 | cursor: e-resize;
120 | width: 7px;
121 | right: -5px;
122 | top: 0;
123 | height: 100%;
124 | }
125 |
126 | .ui-resizable-w {
127 | cursor: w-resize;
128 | width: 7px;
129 | left: -5px;
130 | top: 0;
131 | height: 100%;
132 | }
133 |
134 | .ui-resizable-se {
135 | cursor: se-resize;
136 | width: 12px;
137 | height: 12px;
138 | right: 1px;
139 | bottom: 1px;
140 | }
141 |
142 | .ui-resizable-sw {
143 | cursor: sw-resize;
144 | width: 9px;
145 | height: 9px;
146 | left: -5px;
147 | bottom: -5px;
148 | }
149 |
150 | .ui-resizable-nw {
151 | cursor: nw-resize;
152 | width: 9px;
153 | height: 9px;
154 | left: -5px;
155 | top: -5px;
156 | }
157 |
158 | .ui-resizable-ne {
159 | cursor: ne-resize;
160 | width: 9px;
161 | height: 9px;
162 | right: -5px;
163 | top: -5px;
164 | }
165 |
166 | .ui-selectable {
167 | -ms-touch-action: none;
168 | touch-action: none;
169 | }
170 |
171 | .ui-selectable-helper {
172 | position: absolute;
173 | z-index: 100;
174 | border: 1px dotted #000;
175 | }
176 |
177 | .ui-sortable-handle {
178 | -ms-touch-action: none;
179 | touch-action: none;
180 | }
181 |
182 | .ui-slider {
183 | position: relative;
184 | text-align: left;
185 | background: #ddd;
186 | .ui-slider-handle {
187 | position: absolute;
188 | z-index: 2;
189 | width: 1em;
190 | height: 1em;
191 | cursor: default;
192 | -ms-touch-action: none;
193 | touch-action: none;
194 | }
195 | .ui-slider-range {
196 | position: absolute;
197 | z-index: 1;
198 | font-size: .7em;
199 | display: block;
200 | border: 0;
201 | background-position: 0 0;
202 | }
203 | &.ui-state-disabled {
204 | .ui-slider-handle, .ui-slider-range {
205 | filter: inherit;
206 | }
207 | }
208 | }
209 |
210 | .ui-slider-horizontal {
211 | height: .4em;
212 | .ui-slider-handle {
213 | top: -.4em;
214 | margin-left: -.6em;
215 | }
216 | .ui-slider-range {
217 | top: 0;
218 | height: 100%;
219 | }
220 | .ui-slider-range-min {
221 | left: 0;
222 | }
223 | .ui-slider-range-max {
224 | right: 0;
225 | }
226 | }
227 |
228 | .ui-slider-vertical {
229 | width: .8em;
230 | height: 100px;
231 | .ui-slider-handle {
232 | left: -.3em;
233 | margin-left: 0;
234 | margin-bottom: -.6em;
235 | }
236 | .ui-slider-range {
237 | left: 0;
238 | width: 100%;
239 | }
240 | .ui-slider-range-min {
241 | bottom: 0;
242 | }
243 | .ui-slider-range-max {
244 | top: 0;
245 | }
246 | }
247 |
248 | .ui-slider-handle {
249 | background: #fff;
250 | background: -moz-linear-gradient(top, #fff 0, #f7f7f7 100%);
251 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100%, #f7f7f7));
252 | background: -webkit-linear-gradient(top, #fff 0, #f7f7f7 100%);
253 | background: -o-linear-gradient(top, #fff 0, #f7f7f7 100%);
254 | background: -ms-linear-gradient(top, #fff 0, #f7f7f7 100%);
255 | background: linear-gradient(to bottom, #fff 0, #f7f7f7 100%);
256 | border-radius: 50px;
257 | box-shadow: 0 1px 4px 0 #9191ab !important;
258 | &:focus {
259 | background: #fff;
260 | background: -moz-linear-gradient(top, #fff 0, #f7f7f7 100%);
261 | background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100%, #f7f7f7));
262 | background: -webkit-linear-gradient(top, #fff 0, #f7f7f7 100%);
263 | background: -o-linear-gradient(top, #fff 0, #f7f7f7 100%);
264 | background: -ms-linear-gradient(top, #fff 0, #f7f7f7 100%);
265 | background: linear-gradient(to bottom, #fff 0, #f7f7f7 100%);
266 | border-radius: 50px;
267 | box-shadow: 0 1px 4px 0 #9191ab !important;
268 | }
269 | }
--------------------------------------------------------------------------------
/public/assets/sass/ready/_layouts.scss:
--------------------------------------------------------------------------------
1 | /* Layouts */
2 |
3 | body {
4 | min-height: 100vh;
5 | position: relative;
6 | }
7 |
8 | .wrapper {
9 | min-height: 100vh;
10 | position: relative;
11 | top: 0;
12 | height: 100vh;
13 | }
14 |
15 | .main-header {
16 | min-height: 55px;
17 | width: 100%;
18 | background: $white-color;
19 | position: fixed;
20 | z-index: 1001;
21 | border-bottom: 1px solid #eee;
22 | .logo-header {
23 | float: left;
24 | width: 260px;
25 | height: 55px;
26 | line-height: 55px;
27 | border-right: 1px solid #eee;
28 | color: $black-color;
29 | z-index: 1001;
30 | font-size: 18px;
31 | font-weight: $font-weight-bold;
32 | padding-left: 25px;
33 | padding-right: 25px;
34 | z-index: 1001;
35 | display: inline-block;
36 | a.logo {
37 | color: $body-text-color;
38 | }
39 | .navbar-toggler {
40 | padding-left: 0px;
41 | padding-right: 0px;
42 | opacity: 0;
43 | .navbar-toggler-icon {
44 | background: url(../img/menu2.png);
45 | background-size: cover;
46 | height: 1em;
47 | width: 1em;
48 | opacity: .8;
49 | }
50 | }
51 | .more {
52 | background: $transparent-bg;
53 | border: 0;
54 | font-size: 26px;
55 | padding: 0;
56 | opacity: 0;
57 | }
58 | }
59 | }
60 |
61 | .sidebar {
62 | position: fixed;
63 | top: 0;
64 | bottom: 0;
65 | left: 0;
66 | width: 260px;
67 | display: block;
68 | z-index: 1;
69 | color: $white-color;
70 | font-weight: 200;
71 | background: $white-color;
72 | background-size: cover;
73 | background-position: center center;
74 | border-right: 1px solid #eee;
75 | box-shadow: 6px 1px 20px rgba(69, 65, 78, 0.1);
76 | .user {
77 | margin-top: 12.5px;
78 | padding-left: 25px;
79 | padding-right: 25px;
80 | padding-bottom: 12.5px;
81 | border-bottom: 1px solid #eee;
82 | display: block;
83 | .photo {
84 | width: 40px;
85 | height: 40px;
86 | overflow: hidden;
87 | float: left;
88 | margin-right: 11px;
89 | z-index: 5;
90 | border-radius: 50%;
91 | img {
92 | width: 100%;
93 | height: 100%;
94 | }
95 | }
96 | .info {
97 | a {
98 | white-space: nowrap;
99 | display: block;
100 | position: relative;
101 | &:hover, &:focus {
102 | text-decoration: none;
103 | }
104 | > span {
105 | font-size: 14px;
106 | font-weight: $font-weight-bold;
107 | color: #777;
108 | letter-spacing: 0.04em;
109 | display: flex;
110 | flex-direction: column;
111 | .user-level {
112 | color: #555;
113 | font-weight: 700;
114 | font-size: 13px;
115 | letter-spacing: 0.05em;
116 | margin-top: 5px;
117 | }
118 | }
119 | .link-collapse {
120 | padding: 7px 0;
121 | }
122 | }
123 | .caret {
124 | position: absolute;
125 | top: 17px;
126 | right: 0px;
127 | border-top-color: #777;
128 | }
129 | }
130 | }
131 | .sidebar-wrapper {
132 | position: relative;
133 | max-height: calc(100vh - 75px);
134 | min-height: 100%;
135 | overflow: auto;
136 | width: 260px;
137 | z-index: 4;
138 | padding-top: 55px;
139 | padding-bottom: 100px;
140 | }
141 | .nav {
142 | display: block;
143 | float: none;
144 | margin-top: 20px;
145 | .nav-item {
146 | display: list-item;
147 | &.active {
148 | a {
149 | color: $body-text-color;
150 | font-weight: 700;
151 | &:before {
152 | background: #1d7af3;
153 | opacity: 1 !important;
154 | position: absolute;
155 | z-index: 1;
156 | width: 3px;
157 | height: 100%;
158 | content: '';
159 | left: 0;
160 | top: 0;
161 | }
162 | }
163 | &:hover a:before {
164 | background: #1d7af3;
165 | opacity: 1 !important;
166 | position: absolute;
167 | z-index: 1;
168 | width: 3px;
169 | height: 100%;
170 | content: '';
171 | left: 0;
172 | top: 0;
173 | }
174 | a i {
175 | color: #4d7cfe;
176 | }
177 | }
178 | a {
179 | display: flex;
180 | align-items: center;
181 | color: #83848a;
182 | padding: 13px 25px;
183 | width: 100%;
184 | font-size: 14px;
185 | font-weight: $font-weight-bold;
186 | position: relative;
187 | margin-bottom: 5px;
188 | &:hover, &:focus {
189 | text-decoration: none;
190 | background: #fbfbfb;
191 | }
192 | }
193 | &:hover a:before {
194 | background: #1d7af3;
195 | opacity: 0.7;
196 | position: absolute;
197 | z-index: 1;
198 | width: 3px;
199 | height: 100%;
200 | content: '';
201 | left: 0;
202 | top: 0;
203 | }
204 | a {
205 | i {
206 | font-size: 23px;
207 | color: #C3C5CA;
208 | margin-right: 15px;
209 | width: 25px;
210 | text-align: center;
211 | vertical-align: middle;
212 | float: left;
213 | }
214 | p {
215 | font-size: 14px;
216 | margin-bottom: 0px;
217 | letter-spacing: .04em;
218 | margin-right: 5px;
219 | }
220 | }
221 | }
222 | }
223 | }
224 |
225 | .main-panel {
226 | position: relative;
227 | width: calc(100% - 260px);
228 | min-height: 100%;
229 | float: right;
230 | background: #f2f3f8;
231 | .content {
232 | padding: 30px 15px;
233 | min-height: calc(100% - 123px);
234 | margin-top: 55px;
235 | }
236 | }
237 |
238 | .footer {
239 | border-top: 1px solid #eee;
240 | padding: 15px;
241 | background: $white-color;
242 | .container-fluid {
243 | display: flex;
244 | align-items: center;
245 | }
246 | }
--------------------------------------------------------------------------------
/public/assets/sass/ready/components/_buttons.scss:
--------------------------------------------------------------------------------
1 | /* Button */
2 |
3 | .btn {
4 | padding: 8px 16px;
5 | font-size: 14px;
6 | opacity: 0.9;
7 | border-radius: 3px;
8 | &:hover, &:focus {
9 | opacity: 1;
10 | }
11 | }
12 |
13 | .btn-lg {
14 | font-size: 18px;
15 | border-radius: 6px;
16 | padding: 10px 30px;
17 | font-weight: $font-weight-normal;
18 | }
19 |
20 | .btn-sm {
21 | font-size: 12px;
22 | padding: 7px 13px;
23 | }
24 |
25 | .btn-xs {
26 | font-size: 11px;
27 | padding: 5px 9px;
28 | }
29 |
30 | .btn {
31 | &.disabled:hover, &:hover:disabled {
32 | opacity: 0.65;
33 | }
34 | }
35 |
36 | .btn-default {
37 | background: $default-color !important;
38 | color: $white-color !important;
39 | &:hover, &:focus, &:disabled {
40 | background: $default-color !important;
41 | color: $white-color !important;
42 | }
43 | }
44 |
45 | .btn-primary {
46 | background: $primary-color !important;
47 | border-color: $primary-color !important;
48 | &:hover, &:focus, &:disabled {
49 | background: $primary-color !important;
50 | border-color: $primary-color !important;
51 | }
52 | }
53 |
54 | .btn-info {
55 | background: $info-color !important;
56 | border-color: $info-color !important;
57 | &:hover, &:focus, &:disabled {
58 | background: $info-color !important;
59 | border-color: $info-color !important;
60 | }
61 | }
62 |
63 | .btn-success {
64 | background: $success-color !important;
65 | border-color: $success-color !important;
66 | &:hover, &:focus, &:disabled {
67 | background: $success-color !important;
68 | border-color: $success-color !important;
69 | }
70 | }
71 |
72 | .btn-warning {
73 | background: $warning-color !important;
74 | border-color: $warning-color !important;
75 | color: $white-color !important;
76 | &:hover, &:focus, &:disabled {
77 | background: $warning-color !important;
78 | border-color: $warning-color !important;
79 | color: $white-color !important;
80 | }
81 | }
82 |
83 | .btn-danger {
84 | background: $danger-color !important;
85 | border-color: $danger-color !important;
86 | &:hover, &:focus, &:disabled {
87 | background: $danger-color !important;
88 | border-color: $danger-color !important;
89 | }
90 | }
91 |
92 | .btn-border {
93 | background: $transparent-bg !important;
94 | font-weight: $font-weight-bold !important;
95 | &:hover, &:focus {
96 | background: $transparent-bg !important;
97 | font-weight: $font-weight-bold !important;
98 | }
99 | }
100 |
101 | .btn-default.btn-border {
102 | color: $default-color !important;
103 | border: 2px solid $default-color !important;
104 | }
105 |
106 | .btn-primary.btn-border {
107 | color: $primary-color !important;
108 | border: 2px solid $primary-color !important;
109 | }
110 |
111 | .btn-info.btn-border {
112 | color: $info-color !important;
113 | border: 2px solid $info-color !important;
114 | }
115 |
116 | .btn-success.btn-border {
117 | color: $success-color !important;
118 | border: 2px solid $success-color !important;
119 | }
120 |
121 | .btn-warning.btn-border {
122 | color: $warning-color !important;
123 | border: 2px solid $warning-color !important;
124 | }
125 |
126 | .btn-danger.btn-border {
127 | color: $danger-color !important;
128 | border: 2px solid $danger-color !important;
129 | }
130 |
131 | .btn-round {
132 | border-radius: 100px !important;
133 | }
134 |
135 | .btn-link {
136 | border: 0 !important;
137 | background: $transparent-bg !important;
138 | &:hover, &:focus {
139 | text-decoration: underline !important;
140 | background: $transparent-bg !important;
141 | border: 0 !important;
142 | }
143 | }
144 |
145 | .btn-default.btn-link {
146 | color: $default-color !important;
147 | &:hover {
148 | color: $default-color !important;
149 | }
150 | }
151 |
152 | .btn-primary.btn-link {
153 | color: $primary-color !important;
154 | &:hover {
155 | color: $primary-color !important;
156 | }
157 | }
158 |
159 | .btn-info.btn-link {
160 | color: $info-color !important;
161 | &:hover {
162 | color: $info-color !important;
163 | }
164 | }
165 |
166 | .btn-success.btn-link {
167 | color: $success-color !important;
168 | &:hover {
169 | color: $success-color !important;
170 | }
171 | }
172 |
173 | .btn-warning.btn-link {
174 | color: $warning-color !important;
175 | &:hover {
176 | color: $warning-color !important;
177 | }
178 | }
179 |
180 | .btn-danger.btn-link {
181 | color: $danger-color !important;
182 | &:hover {
183 | color: $danger-color !important;
184 | }
185 | }
186 |
187 | .toggle-on.btn {
188 | color: $white-color !important;
189 | }
190 |
191 | .toggle-handle {
192 | background: $white-color !important;
193 | &:hover {
194 | background: $white-color !important;
195 | }
196 | }
197 |
198 | .btn-round .toggle-handle {
199 | border-radius: 50px;
200 | }
201 |
202 | .btn-rounded {
203 | border-radius: 60px !important;
204 | }
205 |
206 | .btn-simple-default {
207 | color: $default-color;
208 | text-decoration: none;
209 | &:hover {
210 | color: $default-color;
211 | text-decoration: none;
212 | }
213 | }
214 |
215 | .btn-simple-primary {
216 | color: $primary-color;
217 | text-decoration: none;
218 | &:hover {
219 | color: $primary-color;
220 | text-decoration: none;
221 | }
222 | }
223 |
224 | .btn-simple-info {
225 | color: $info-color;
226 | text-decoration: none;
227 | &:hover {
228 | color: $info-color;
229 | text-decoration: none;
230 | }
231 | }
232 |
233 | .btn-simple-danger {
234 | color: $danger-color;
235 | text-decoration: none;
236 | &:hover {
237 | color: $danger-color;
238 | text-decoration: none;
239 | }
240 | }
241 |
242 | .btn-simple-warning {
243 | color: $warning-color;
244 | text-decoration: none;
245 | &:hover {
246 | color: $warning-color;
247 | text-decoration: none;
248 | }
249 | }
250 |
251 | .btn-simple-success {
252 | color: $success-color;
253 | text-decoration: none;
254 | &:hover {
255 | color: $success-color;
256 | text-decoration: none;
257 | }
258 | }
259 |
260 | .btn-full {
261 | width: 100%;
262 | }
263 |
264 | .btn-no-radius {
265 | border-radius: 0px;
266 | }
--------------------------------------------------------------------------------
/src/components/AdminProfile.js:
--------------------------------------------------------------------------------
1 | import React, { useState } from "react";
2 | import AdminHeader from "./layouts/AdminHeader";
3 | import AdminSideBar from "./layouts/AdminSideBar";
4 | import AdminFooter from "./layouts/AdminFooter";
5 | import { auth } from "../firebase";
6 | import {
7 | updateProfile,
8 | updateEmail,
9 | updatePassword,
10 | reauthenticateWithCredential,
11 | EmailAuthProvider,
12 | } from "firebase/auth";
13 |
14 | export default function AdminProfile() {
15 | const [errorMsg, setErrorMsg] = useState("");
16 | const [successMsg, setSuccessMsg] = useState("");
17 | const user = auth.currentUser;
18 | const [newValues, setNewValues] = useState({
19 | name: user !== null ? user.displayName : "",
20 | email: user !== null ? user.email : "",
21 | oldPassword: "",
22 | password: "",
23 | });
24 |
25 | const handleUpdateProfile = () => {
26 | if (newValues.name && newValues.email) {
27 | if (newValues.name !== auth.currentUser.displayName) {
28 | updateProfile(auth.currentUser, {
29 | displayName: newValues.name,
30 | })
31 | .then(async () => {
32 | setErrorMsg("");
33 | setSuccessMsg("Username updated successfully!");
34 | await setTimeout(() => {
35 | setSuccessMsg("");
36 | }, 1000);
37 | })
38 | .catch((error) => {
39 | setErrorMsg(error.message);
40 | });
41 | }
42 | if (newValues.email !== auth.currentUser.email) {
43 | updateEmail(auth.currentUser, newValues.email)
44 | .then(async () => {
45 | setErrorMsg("");
46 | setSuccessMsg("Email updated successfully!");
47 | await setTimeout(() => {
48 | setSuccessMsg("");
49 | }, 1000);
50 | })
51 | .catch((error) => {
52 | setErrorMsg(error.message);
53 | });
54 | }
55 | if (newValues.password) {
56 | if (newValues.oldPassword) {
57 | const credential = EmailAuthProvider.credential(
58 | auth.currentUser.email,
59 | newValues.oldPassword
60 | );
61 | reauthenticateWithCredential(auth.currentUser, credential)
62 | .then(() => {
63 | updatePassword(auth.currentUser, newValues.password)
64 | .then(async () => {
65 | setErrorMsg("");
66 | setSuccessMsg("Password updated successfully!");
67 | await setTimeout(() => {
68 | setSuccessMsg("");
69 | }, 1000);
70 | })
71 | .catch((error) => {
72 | setErrorMsg(error.message);
73 | });
74 | })
75 | .catch((error) => {
76 | setErrorMsg(error.message);
77 | });
78 | } else {
79 | setErrorMsg("Old password required to update it!");
80 | }
81 | }
82 | } else {
83 | setErrorMsg("Please fill out all the required fields!");
84 | }
85 | };
86 | return (
87 | <>
88 |
89 |
90 |
91 |
92 |
93 |
Profile
94 |
95 |
96 |
97 |
100 |
155 |
156 |
157 |
{errorMsg}
158 |
{successMsg}
159 |
162 |
163 |
164 |
165 |
166 |
167 |
168 |
169 |
170 |
171 | >
172 | );
173 | }
174 |
--------------------------------------------------------------------------------
/public/assets/sass/ready/components/_inputs.scss:
--------------------------------------------------------------------------------
1 | /* Form */
2 |
3 | .form-button-action {
4 | display: inline-flex;
5 | }
6 |
7 | /* CheckBox Input */
8 |
9 | .select-all-checkbox + .form-check-sign:before {
10 | background: #ccc !important;
11 | border-color: #ccc !important;
12 | }
13 |
14 | [type="checkbox"] {
15 | &:not(:checked), &:checked {
16 | position: absolute;
17 | left: -9999px;
18 | }
19 | &:not(:checked) + .form-check-sign, &:checked + .form-check-sign {
20 | position: relative;
21 | padding-left: 1.65em;
22 | color: #777;
23 | cursor: pointer;
24 | }
25 | &:not(:checked) + .form-check-sign:before, &:checked + .form-check-sign:before {
26 | content: '';
27 | position: absolute;
28 | left: 0;
29 | top: 1px;
30 | width: 16px;
31 | height: 16px;
32 | border: 1px solid #ccc;
33 | background: $transparent-bg;
34 | border-radius: 4px;
35 | }
36 | &:not(:checked) + .form-check-sign:after, &:checked + .form-check-sign:after {
37 | content: "\f17b";
38 | display: inline-block;
39 | position: absolute;
40 | top: -1px;
41 | left: 2px;
42 | width: 18px;
43 | height: 18px;
44 | text-align: center;
45 | font-size: 1.5em;
46 | line-height: 0.8;
47 | color: #4D7CFE;
48 | transition: all .2s;
49 | font-family: LineAwesome;
50 | }
51 | &:not(:checked) + .form-check-sign:after {
52 | opacity: 0;
53 | transform: scale(0);
54 | }
55 | &:checked + .form-check-sign {
56 | &:after {
57 | opacity: 1;
58 | transform: scale(1);
59 | }
60 | font-weight: 700;
61 | }
62 | &:disabled {
63 | &:not(:checked) + .form-check-sign:before {
64 | box-shadow: none;
65 | border-color: #bbb;
66 | background-color: #ddd;
67 | }
68 | &:checked + .form-check-sign {
69 | &:before {
70 | box-shadow: none;
71 | border-color: #bbb;
72 | background-color: #ddd;
73 | }
74 | &:after {
75 | color: #999;
76 | }
77 | }
78 | + .form-check-sign {
79 | color: #aaa;
80 | }
81 | }
82 | &:checked:focus + .form-check-sign:before, &:not(:checked):focus + .form-check-sign:before {
83 | border: 1px solid #ccc;
84 | }
85 | }
86 |
87 | /* checked mark aspect changes */
88 |
89 | /* disabled checkbox */
90 |
91 | /* accessibility */
92 |
93 | /* hover style just for information */
94 |
95 | .form-check-sign:hover:before {
96 | border: 1px solid #ccc !important;
97 | }
98 |
99 | .form-check {
100 | padding-left: 0.75rem;
101 | }
102 |
103 | .form-check-input {
104 | position: relative;
105 | margin-top: .3rem;
106 | }
107 |
108 | /* Radio Input */
109 |
110 | [type="radio"] {
111 | &:not(:checked), &:checked {
112 | position: absolute;
113 | left: -9999px;
114 | }
115 | &:not(:checked) + .form-radio-sign, &:checked + .form-radio-sign {
116 | position: relative;
117 | padding-left: 1.65em;
118 | color: #777;
119 | cursor: pointer;
120 | }
121 | &:not(:checked) + .form-radio-sign:before {
122 | content: "\f18a";
123 | font-size: 22px;
124 | font-family: LineAwesome;
125 | position: absolute;
126 | left: 0;
127 | top: auto;
128 | background: $transparent-bg;
129 | line-height: 1;
130 | }
131 | &:checked + .form-radio-sign:before {
132 | content: "\f18a";
133 | font-size: 22px;
134 | font-family: LineAwesome;
135 | position: absolute;
136 | left: 0;
137 | top: auto;
138 | background: $transparent-bg;
139 | line-height: 1;
140 | display: none;
141 | }
142 | &:not(:checked) + .form-radio-sign:after, &:checked + .form-radio-sign:after {
143 | content: "\f1bc";
144 | position: absolute;
145 | left: 0px;
146 | top: auto;
147 | text-align: center;
148 | font-size: 22px;
149 | color: #4D7CFE;
150 | transition: all .2s;
151 | line-height: 1;
152 | font-family: LineAwesome;
153 | }
154 | &:not(:checked) + .form-radio-sign:after {
155 | opacity: 0;
156 | transform: scale(0);
157 | }
158 | &:checked + .form-radio-sign {
159 | &:after {
160 | opacity: 1;
161 | transform: scale(1);
162 | }
163 | font-weight: 700;
164 | }
165 | &:disabled {
166 | &:not(:checked) + .form-radio-sign:before {
167 | box-shadow: none;
168 | opacity: 0.65;
169 | }
170 | &:checked + .form-radio-sign {
171 | &:before {
172 | box-shadow: none;
173 | opacity: 0.65;
174 | }
175 | &:after {
176 | opacity: 0.65;
177 | }
178 | }
179 | + .form-radio-sign {
180 | color: #aaa;
181 | opacity: 0.65;
182 | }
183 | }
184 | &:checked:focus + .form-radio-sign:before, &:not(:checked):focus + .form-radio-sign:before {
185 | border: 1px solid #ccc;
186 | }
187 | }
188 |
189 | /* checked mark aspect changes */
190 |
191 | /* disabled radio */
192 |
193 | /* accessibility */
194 |
195 | .form-radio {
196 | padding-left: 0.75rem;
197 | }
198 |
199 | .form-radio-input {
200 | position: relative;
201 | margin-top: .3rem;
202 | }
203 |
204 | /* Input */
205 |
206 | .form-group, .form-check {
207 | margin-bottom: 0;
208 | padding: 15px 10px;
209 | }
210 |
211 | .form-group label, .form-check label {
212 | margin-bottom: .5rem !important;
213 | color: #3f4047 !important;
214 | font-weight: $font-weight-normal;
215 | font-size: 1rem;
216 | }
217 |
218 | .form-inline label {
219 | margin-bottom: 0 !important;
220 | }
221 |
222 | .input-fixed {
223 | width: 200px;
224 | }
225 |
226 | .form-control.input-full {
227 | width: 100% !important;
228 | }
229 |
230 | .has-success .form-control {
231 | border-color: $success-color;
232 | color: $success-color;
233 | }
234 |
235 | .has-error .form-control {
236 | border-color: $danger-color;
237 | color: $danger-color;
238 | }
239 |
240 | .has-feedback {
241 | position: relative;
242 | }
243 |
244 | .form-control-feedback {
245 | position: absolute;
246 | top: 50%;
247 | transform: translateY(-50%);
248 | right: 20px;
249 | }
250 |
251 | .has-success .form-control-feedback {
252 | color: $success-color;
253 | }
254 |
255 | .has-error .form-control-feedback {
256 | color: $danger-color;
257 | }
258 |
259 | .input-group {
260 | &.has-icon {
261 | border-radius: .25rem;
262 | border: 1px solid #ced4da;
263 | }
264 | &.has-success, &.has-icon.has-success {
265 | border-color: 1px solid $success-color !important;
266 | color: $success-color;
267 | }
268 | &.has-error {
269 | border: 1px solid $danger-color !important;
270 | color: $danger-color;
271 | }
272 | &.has-icon {
273 | &.has-error {
274 | border: 1px solid $danger-color !important;
275 | color: $danger-color;
276 | }
277 | .form-control {
278 | border-radius: .25rem;
279 | border: 0px;
280 | position: relative;
281 | }
282 | .input-group-icon {
283 | background: $transparent-bg;
284 | border: 0px;
285 | }
286 | }
287 | }
288 |
289 | .input-square {
290 | border-radius: 0px !important;
291 | }
292 |
293 | .input-pill {
294 | border-radius: 1.3rem !important;
295 | }
296 |
297 | .input-solid {
298 | background: #e8e8e8 !important;
299 | border-color: #e8e8e8 !important;
300 | }
301 |
302 | .form-control {
303 | &:disabled, &[readonly] {
304 | background: #e8e8e8 !important;
305 | border-color: #e8e8e8 !important;
306 | }
307 | &:disabled, &[readonly] {
308 | opacity: 0.6 !important;
309 | }
310 | }
--------------------------------------------------------------------------------
/src/components/AddMedicine.js:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import { useNavigate, Link } from "react-router-dom";
3 | import AdminHeader from "./layouts/AdminHeader";
4 | import AdminSideBar from "./layouts/AdminSideBar";
5 | import AdminFooter from "./layouts/AdminFooter";
6 | import { db } from "../firebase";
7 | import { collection, addDoc, getDocs } from "firebase/firestore";
8 |
9 | export default function AddMedicine() {
10 | const navigate = useNavigate();
11 | const [categories, setCategories] = useState([]);
12 | const categoriesCollectionReference = collection(db, "medicine_categories");
13 | const getCategories = async () => {
14 | const data = await getDocs(categoriesCollectionReference);
15 | setCategories(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
16 | };
17 | const [medTypes, setMedTypes] = useState([]);
18 | const medTypesCollectionRef = collection(db, "medicine_types");
19 | const getTypes = async () => {
20 | const data = await getDocs(medTypesCollectionRef);
21 | setMedTypes(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
22 | };
23 | useEffect(() => {
24 | getCategories();
25 | getTypes();
26 | }, []);
27 | const medicinesCollectionRef = collection(db, "medicine_inventory");
28 | const [errorMsg, setErrorMsg] = useState("");
29 | const [successMsg, setSuccessMsg] = useState("");
30 | const [medicine, setMedicine] = useState({
31 | name: "",
32 | power: "",
33 | category: "",
34 | type: "",
35 | price: "",
36 | stock: "",
37 | });
38 | const handleAddMedicine = async () => {
39 | if (
40 | medicine.name &&
41 | medicine.power &&
42 | medicine.category &&
43 | medicine.type &&
44 | medicine.price &&
45 | medicine.stock
46 | ) {
47 | setErrorMsg("");
48 | await addDoc(medicinesCollectionRef, {
49 | name: medicine.name,
50 | power: medicine.power,
51 | category: medicine.category,
52 | type: medicine.type,
53 | price: medicine.price,
54 | stock: medicine.stock,
55 | });
56 | setSuccessMsg("Medicine added successfully!");
57 | setTimeout(() => {
58 | setSuccessMsg("");
59 | navigate("/inventory");
60 | }, 1000);
61 | } else {
62 | setErrorMsg("Please fill out all the required fields!");
63 | }
64 | };
65 | return (
66 | <>
67 |
68 |
69 |
70 |
71 |
72 |
Create Medicine
73 |
74 |
75 |
76 |
77 |
78 | New Medicine Details
79 |
80 | Go BACK
81 | {" "}
82 |
83 |
84 |
85 |
86 |
87 |
93 | setMedicine((prev) => ({ ...prev, name: event.target.value }))
94 | }
95 | placeholder="Enter Medicine Name"
96 | />
97 |
98 |
99 |
100 |
101 |
107 | setMedicine((prev) => ({ ...prev, power: event.target.value }))
108 | }
109 | placeholder="Enter Medicine Power"
110 | />
111 |
112 |
113 |
114 |
125 |
126 |
127 |
128 |
139 |
140 |
141 |
142 |
148 | setMedicine((prev) => ({ ...prev, price: event.target.value }))
149 | }
150 | placeholder="Enter Medicine Price"
151 | />
152 |
153 |
154 |
155 |
161 | setMedicine((prev) => ({ ...prev, stock: event.target.value }))
162 | }
163 | placeholder="Enter Medicine Stock"
164 | />
165 |
166 |
167 |
168 |
169 |
{errorMsg}
170 |
{successMsg}
171 |
174 |
175 |
176 |
177 |
178 |
179 |
180 |
181 |
182 |
183 | >
184 | );
185 | }
186 |
--------------------------------------------------------------------------------
/public/assets/js/plugin/chartist/plugin/chartist-plugin-tooltip.min.js:
--------------------------------------------------------------------------------
1 | /* chartist-plugin-tooltip 0.0.18
2 | * Copyright © 2017 Markus Padourek
3 | * Free to use under the WTFPL license.
4 | * http://www.wtfpl.net/
5 | */
6 |
7 | (function (root, factory) {
8 | if (typeof define === 'function' && define.amd) {
9 | // AMD. Register as an anonymous module.
10 | define(["chartist"], function (Chartist) {
11 | return (root.returnExportsGlobal = factory(Chartist));
12 | });
13 | } else if (typeof exports === 'object') {
14 | // Node. Does not work with strict CommonJS, but
15 | // only CommonJS-like enviroments that support module.exports,
16 | // like Node.
17 | module.exports = factory(require("chartist"));
18 | } else {
19 | root['Chartist.plugins.tooltips'] = factory(Chartist);
20 | }
21 | }(this, function (Chartist) {
22 |
23 | /**
24 | * Chartist.js plugin to display a data label on top of the points in a line chart.
25 | *
26 | */
27 | /* global Chartist */
28 | (function (window, document, Chartist) {
29 | 'use strict';
30 |
31 | var defaultOptions = {
32 | currency: undefined,
33 | currencyFormatCallback: undefined,
34 | tooltipOffset: {
35 | x: 0,
36 | y: -20
37 | },
38 | anchorToPoint: false,
39 | appendToBody: false,
40 | class: undefined,
41 | pointClass: 'ct-point'
42 | };
43 |
44 | Chartist.plugins = Chartist.plugins || {};
45 | Chartist.plugins.tooltip = function (options) {
46 | options = Chartist.extend({}, defaultOptions, options);
47 |
48 | return function tooltip(chart) {
49 | var tooltipSelector = options.pointClass;
50 | if (chart instanceof Chartist.Bar) {
51 | tooltipSelector = 'ct-bar';
52 | } else if (chart instanceof Chartist.Pie) {
53 | // Added support for donut graph
54 | if (chart.options.donut) {
55 | tooltipSelector = 'ct-slice-donut';
56 | } else {
57 | tooltipSelector = 'ct-slice-pie';
58 | }
59 | }
60 |
61 | var $chart = chart.container;
62 | var $toolTip = $chart.querySelector('.chartist-tooltip');
63 | if (!$toolTip) {
64 | $toolTip = document.createElement('div');
65 | $toolTip.className = (!options.class) ? 'chartist-tooltip' : 'chartist-tooltip ' + options.class;
66 | if (!options.appendToBody) {
67 | $chart.appendChild($toolTip);
68 | } else {
69 | document.body.appendChild($toolTip);
70 | }
71 | }
72 | var height = $toolTip.offsetHeight;
73 | var width = $toolTip.offsetWidth;
74 |
75 | hide($toolTip);
76 |
77 | function on(event, selector, callback) {
78 | $chart.addEventListener(event, function (e) {
79 | if (!selector || hasClass(e.target, selector))
80 | callback(e);
81 | });
82 | }
83 |
84 | on('mouseover', tooltipSelector, function (event) {
85 | var $point = event.target;
86 | var tooltipText = '';
87 |
88 | var isPieChart = (chart instanceof Chartist.Pie) ? $point : $point.parentNode;
89 | var seriesName = (isPieChart) ? $point.parentNode.getAttribute('ct:meta') || $point.parentNode.getAttribute('ct:series-name') : '';
90 | var meta = $point.getAttribute('ct:meta') || seriesName || '';
91 | var hasMeta = !!meta;
92 | var value = $point.getAttribute('ct:value');
93 |
94 | if (options.transformTooltipTextFnc && typeof options.transformTooltipTextFnc === 'function') {
95 | value = options.transformTooltipTextFnc(value);
96 | }
97 |
98 | if (options.tooltipFnc && typeof options.tooltipFnc === 'function') {
99 | tooltipText = options.tooltipFnc(meta, value);
100 | } else {
101 | if (options.metaIsHTML) {
102 | var txt = document.createElement('textarea');
103 | txt.innerHTML = meta;
104 | meta = txt.value;
105 | }
106 |
107 | meta = '' + meta + '';
108 |
109 | if (hasMeta) {
110 | tooltipText += meta + '
';
111 | } else {
112 | // For Pie Charts also take the labels into account
113 | // Could add support for more charts here as well!
114 | if (chart instanceof Chartist.Pie) {
115 | var label = next($point, 'ct-label');
116 | if (label) {
117 | tooltipText += text(label) + '
';
118 | }
119 | }
120 | }
121 |
122 | if (value) {
123 | if (options.currency) {
124 | if (options.currencyFormatCallback != undefined) {
125 | value = options.currencyFormatCallback(value, options);
126 | } else {
127 | value = options.currency + value.replace(/(\d)(?=(\d{3})+(?:\.\d+)?$)/g, '$1,');
128 | }
129 | }
130 | value = '' + value + '';
131 | tooltipText += value;
132 | }
133 | }
134 |
135 | if(tooltipText) {
136 | $toolTip.innerHTML = tooltipText;
137 | setPosition(event);
138 | show($toolTip);
139 |
140 | // Remember height and width to avoid wrong position in IE
141 | height = $toolTip.offsetHeight;
142 | width = $toolTip.offsetWidth;
143 | }
144 | });
145 |
146 | on('mouseout', tooltipSelector, function () {
147 | hide($toolTip);
148 | });
149 |
150 | on('mousemove', null, function (event) {
151 | if (false === options.anchorToPoint)
152 | setPosition(event);
153 | });
154 |
155 | function setPosition(event) {
156 | height = height || $toolTip.offsetHeight;
157 | width = width || $toolTip.offsetWidth;
158 | var offsetX = - width / 2 + options.tooltipOffset.x
159 | var offsetY = - height + options.tooltipOffset.y;
160 | var anchorX, anchorY;
161 |
162 | if (!options.appendToBody) {
163 | var box = $chart.getBoundingClientRect();
164 | var left = event.pageX - box.left - window.pageXOffset ;
165 | var top = event.pageY - box.top - window.pageYOffset ;
166 |
167 | if (true === options.anchorToPoint && event.target.x2 && event.target.y2) {
168 | anchorX = parseInt(event.target.x2.baseVal.value);
169 | anchorY = parseInt(event.target.y2.baseVal.value);
170 | }
171 |
172 | $toolTip.style.top = (anchorY || top) + offsetY + 'px';
173 | $toolTip.style.left = (anchorX || left) + offsetX + 'px';
174 | } else {
175 | $toolTip.style.top = event.pageY + offsetY + 'px';
176 | $toolTip.style.left = event.pageX + offsetX + 'px';
177 | }
178 | }
179 | }
180 | };
181 |
182 | function show(element) {
183 | if(!hasClass(element, 'tooltip-show')) {
184 | element.className = element.className + ' tooltip-show';
185 | }
186 | }
187 |
188 | function hide(element) {
189 | var regex = new RegExp('tooltip-show' + '\\s*', 'gi');
190 | element.className = element.className.replace(regex, '').trim();
191 | }
192 |
193 | function hasClass(element, className) {
194 | return (' ' + element.getAttribute('class') + ' ').indexOf(' ' + className + ' ') > -1;
195 | }
196 |
197 | function next(element, className) {
198 | do {
199 | element = element.nextSibling;
200 | } while (element && !hasClass(element, className));
201 | return element;
202 | }
203 |
204 | function text(element) {
205 | return element.innerText || element.textContent;
206 | }
207 |
208 | } (window, document, Chartist));
209 |
210 | return Chartist.plugins.tooltips;
211 |
212 | }));
213 | //# sourceMappingURL=chartist-plugin-tooltip.min.js.map
--------------------------------------------------------------------------------
/src/components/UpdateMedicine.js:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from "react";
2 | import { useNavigate, Link } from "react-router-dom";
3 | import AdminHeader from "./layouts/AdminHeader";
4 | import AdminSideBar from "./layouts/AdminSideBar";
5 | import AdminFooter from "./layouts/AdminFooter";
6 | import { db } from "../firebase";
7 | import { collection, doc, updateDoc, getDocs } from "firebase/firestore";
8 |
9 | export default function UpdateMedicine() {
10 | const navigate = useNavigate();
11 | const [categories, setCategories] = useState([]);
12 | const categoriesCollectionReference = collection(db, "medicine_categories");
13 | const getCategories = async () => {
14 | const data = await getDocs(categoriesCollectionReference);
15 | setCategories(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
16 | };
17 | const [medTypes, setMedTypes] = useState([]);
18 | const medTypesCollectionRef = collection(db, "medicine_types");
19 | const getTypes = async () => {
20 | const data = await getDocs(medTypesCollectionRef);
21 | setMedTypes(data.docs.map((doc) => ({ ...doc.data(), id: doc.id })));
22 | };
23 | useEffect(() => {
24 | getCategories();
25 | getTypes();
26 | }, []);
27 | const medicinesCollecitonRef = collection(db, "medicine_inventory");
28 | const [medicine, setMedicine] = useState(JSON.parse(localStorage.getItem("medicine_obj")));
29 |
30 | const [errorMsg, setErrorMsg] = useState("");
31 | const [successMsg, setSuccessMsg] = useState("");
32 | const handleUpdateMedicine = async () => {
33 | if (
34 | medicine.name &&
35 | medicine.power &&
36 | medicine.category &&
37 | medicine.type &&
38 | medicine.price &&
39 | medicine.stock
40 | ) {
41 | const medDoc = doc(medicinesCollecitonRef, medicine.id);
42 | await updateDoc(medDoc, medicine);
43 | setErrorMsg("");
44 | setSuccessMsg("Medicine updated Successfully!");
45 | setTimeout(() => {
46 | setSuccessMsg("");
47 | navigate("/inventory");
48 | }, 1000);
49 | } else {
50 | setErrorMsg("Please fill out all the required fields!");
51 | }
52 | };
53 | return (
54 | <>
55 |
56 |
57 |
58 |
59 |
60 |
Change Medicine
61 |
62 |
63 |
64 |
65 |
66 | Edit Medicine Details
67 |
68 | Go BACK
69 | {" "}
70 |
71 |
72 |
73 |
74 |
75 |
81 | setMedicine((prev) => ({ ...prev, name: event.target.value }))
82 | }
83 | placeholder="Enter Medicine Name"
84 | />
85 |
86 |
87 |
88 |
89 |
95 | setMedicine((prev) => ({ ...prev, power: event.target.value }))
96 | }
97 | placeholder="Enter Medicine Power"
98 | />
99 |
100 |
101 |
102 |
121 |
122 |
123 |
124 |
143 |
144 |
145 |
146 |
152 | setMedicine((prev) => ({ ...prev, price: event.target.value }))
153 | }
154 | placeholder="Enter Medicine Price"
155 | />
156 |
157 |
158 |
159 |
165 | setMedicine((prev) => ({ ...prev, stock: event.target.value }))
166 | }
167 | placeholder="Enter Medicine Stock"
168 | />
169 |
170 |
171 |
172 |
173 |
{errorMsg}
174 |
{successMsg}
175 |
178 |
179 |
180 |
181 |
182 |
183 |
184 |
185 |
186 |
187 | >
188 | );
189 | }
190 |
--------------------------------------------------------------------------------
/public/assets/js/plugin/bootstrap-notify/bootstrap-notify.min.js:
--------------------------------------------------------------------------------
1 | !function(t){"function"==typeof define&&define.amd?define(["jquery"],t):t("object"==typeof exports?require("jquery"):jQuery)}(function(t){function s(s){var e=!1;return t('[data-notify="container"]').each(function(i,n){var a=t(n),o=a.find('[data-notify="title"]').text().trim(),r=a.find('[data-notify="message"]').html().trim(),l=o===t(""+s.settings.content.title+"
").html().trim(),d=r===t(""+s.settings.content.message+"
").html().trim(),g=a.hasClass("alert-"+s.settings.type);return l&&d&&g&&(e=!0),!e}),e}function e(e,n,a){var o={content:{message:"object"==typeof n?n.message:n,title:n.title?n.title:"",icon:n.icon?n.icon:"",url:n.url?n.url:"#",target:n.target?n.target:"-"}};a=t.extend(!0,{},o,a),this.settings=t.extend(!0,{},i,a),this._defaults=i,"-"===this.settings.content.target&&(this.settings.content.target=this.settings.url_target),this.animations={start:"webkitAnimationStart oanimationstart MSAnimationStart animationstart",end:"webkitAnimationEnd oanimationend MSAnimationEnd animationend"},"number"==typeof this.settings.offset&&(this.settings.offset={x:this.settings.offset,y:this.settings.offset}),(this.settings.allow_duplicates||!this.settings.allow_duplicates&&!s(this))&&this.init()}var i={element:"body",position:null,type:"info",allow_dismiss:!0,allow_duplicates:!0,newest_on_top:!1,showProgressbar:!1,placement:{from:"top",align:"right"},offset:20,spacing:10,z_index:1031,delay:5e3,timer:1e3,url_target:"_blank",mouse_over:null,animate:{enter:"animated fadeInDown",exit:"animated fadeOutUp"},onShow:null,onShown:null,onClose:null,onClosed:null,icon_type:"class",template:''};String.format=function(){for(var t=arguments[0],s=1;s .progress-bar').removeClass("progress-bar-"+t.settings.type),t.settings.type=i[n],this.$ele.addClass("alert-"+i[n]).find('[data-notify="progressbar"] > .progress-bar').addClass("progress-bar-"+i[n]);break;case"icon":var a=this.$ele.find('[data-notify="icon"]');"class"===t.settings.icon_type.toLowerCase()?a.removeClass(t.settings.content.icon).addClass(i[n]):(a.is("img")||a.find("img"),a.attr("src",i[n]));break;case"progress":var o=t.settings.delay-t.settings.delay*(i[n]/100);this.$ele.data("notify-delay",o),this.$ele.find('[data-notify="progressbar"] > div').attr("aria-valuenow",i[n]).css("width",i[n]+"%");break;case"url":this.$ele.find('[data-notify="url"]').attr("href",i[n]);break;case"target":this.$ele.find('[data-notify="url"]').attr("target",i[n]);break;default:this.$ele.find('[data-notify="'+n+'"]').html(i[n])}var r=this.$ele.outerHeight()+parseInt(t.settings.spacing)+parseInt(t.settings.offset.y);t.reposition(r)},close:function(){t.close()}}},buildNotify:function(){var s=this.settings.content;this.$ele=t(String.format(this.settings.template,this.settings.type,s.title,s.message,s.url,s.target)),this.$ele.attr("data-notify-position",this.settings.placement.from+"-"+this.settings.placement.align),this.settings.allow_dismiss||this.$ele.find('[data-notify="dismiss"]').css("display","none"),(this.settings.delay<=0&&!this.settings.showProgressbar||!this.settings.showProgressbar)&&this.$ele.find('[data-notify="progressbar"]').remove()},setIcon:function(){"class"===this.settings.icon_type.toLowerCase()?this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon):this.$ele.find('[data-notify="icon"]').is("img")?this.$ele.find('[data-notify="icon"]').attr("src",this.settings.content.icon):this.$ele.find('[data-notify="icon"]').append('
')},styleDismiss:function(){this.$ele.find('[data-notify="dismiss"]').css({position:"absolute",right:"10px",top:"5px",zIndex:this.settings.z_index+2})},styleURL:function(){this.$ele.find('[data-notify="url"]').css({backgroundImage:"url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)",height:"100%",left:0,position:"absolute",top:0,width:"100%",zIndex:this.settings.z_index+1})},placement:function(){var s=this,e=this.settings.offset.y,i={display:"inline-block",margin:"0px auto",position:this.settings.position?this.settings.position:"body"===this.settings.element?"fixed":"absolute",transition:"all .5s ease-in-out",zIndex:this.settings.z_index},n=!1,a=this.settings;switch(t('[data-notify-position="'+this.settings.placement.from+"-"+this.settings.placement.align+'"]:not([data-closing="true"])').each(function(){e=Math.max(e,parseInt(t(this).css(a.placement.from))+parseInt(t(this).outerHeight())+parseInt(a.spacing))}),this.settings.newest_on_top===!0&&(e=this.settings.offset.y),i[this.settings.placement.from]=e+"px",this.settings.placement.align){case"left":case"right":i[this.settings.placement.align]=this.settings.offset.x+"px";break;case"center":i.left=0,i.right=0}this.$ele.css(i).addClass(this.settings.animate.enter),t.each(Array("webkit-","moz-","o-","ms-",""),function(t,e){s.$ele[0].style[e+"AnimationIterationCount"]=1}),t(this.settings.element).append(this.$ele),this.settings.newest_on_top===!0&&(e=parseInt(e)+parseInt(this.settings.spacing)+this.$ele.outerHeight(),this.reposition(e)),t.isFunction(s.settings.onShow)&&s.settings.onShow.call(this.$ele),this.$ele.one(this.animations.start,function(){n=!0}).one(this.animations.end,function(){s.$ele.removeClass(s.settings.animate.enter),t.isFunction(s.settings.onShown)&&s.settings.onShown.call(this)}),setTimeout(function(){n||t.isFunction(s.settings.onShown)&&s.settings.onShown.call(this)},600)},bind:function(){var s=this;if(this.$ele.find('[data-notify="dismiss"]').on("click",function(){s.close()}),this.$ele.mouseover(function(){t(this).data("data-hover","true")}).mouseout(function(){t(this).data("data-hover","false")}),this.$ele.data("data-hover","false"),this.settings.delay>0){s.$ele.data("notify-delay",s.settings.delay);var e=setInterval(function(){var t=parseInt(s.$ele.data("notify-delay"))-s.settings.timer;if("false"===s.$ele.data("data-hover")&&"pause"===s.settings.mouse_over||"pause"!=s.settings.mouse_over){var i=(s.settings.delay-t)/s.settings.delay*100;s.$ele.data("notify-delay",t),s.$ele.find('[data-notify="progressbar"] > div').attr("aria-valuenow",i).css("width",i+"%")}t<=-s.settings.timer&&(clearInterval(e),s.close())},s.settings.timer)}},close:function(){var s=this,e=parseInt(this.$ele.css(this.settings.placement.from)),i=!1;this.$ele.attr("data-closing","true").addClass(this.settings.animate.exit),s.reposition(e),t.isFunction(s.settings.onClose)&&s.settings.onClose.call(this.$ele),this.$ele.one(this.animations.start,function(){i=!0}).one(this.animations.end,function(){t(this).remove(),t.isFunction(s.settings.onClosed)&&s.settings.onClosed.call(this)}),setTimeout(function(){i||(s.$ele.remove(),s.settings.onClosed&&s.settings.onClosed(s.$ele))},600)},reposition:function(s){var e=this,i='[data-notify-position="'+this.settings.placement.from+"-"+this.settings.placement.align+'"]:not([data-closing="true"])',n=this.$ele.nextAll(i);this.settings.newest_on_top===!0&&(n=this.$ele.prevAll(i)),n.each(function(){t(this).css(e.settings.placement.from,s),s=parseInt(s)+parseInt(e.settings.spacing)+t(this).outerHeight()})}}),t.notify=function(t,s){var i=new e(this,t,s);return i.notify},t.notifyDefaults=function(s){return i=t.extend(!0,{},i,s)},t.notifyClose=function(s){"warning"===s&&(s="danger"),"undefined"==typeof s||"all"===s?t("[data-notify]").find('[data-notify="dismiss"]').trigger("click"):"success"===s||"info"===s||"warning"===s||"danger"===s?t(".alert-"+s+"[data-notify]").find('[data-notify="dismiss"]').trigger("click"):s?t(s+"[data-notify]").find('[data-notify="dismiss"]').trigger("click"):t('[data-notify-position="'+s+'"]').find('[data-notify="dismiss"]').trigger("click")},t.notifyCloseExcept=function(s){"warning"===s&&(s="danger"),"success"===s||"info"===s||"warning"===s||"danger"===s?t("[data-notify]").not(".alert-"+s).find('[data-notify="dismiss"]').trigger("click"):t("[data-notify]").not(s).find('[data-notify="dismiss"]').trigger("click")}});
--------------------------------------------------------------------------------
/public/assets/js/plugin/jquery-scrollbar/jquery.scrollbar.min.js:
--------------------------------------------------------------------------------
1 | /**
2 | * jQuery CSS Customizable Scrollbar
3 | *
4 | * Copyright 2015, Yuriy Khabarov
5 | * Dual licensed under the MIT or GPL Version 2 licenses.
6 | *
7 | * If you found bug, please contact me via email <13real008@gmail.com>
8 | *
9 | * Compressed by http://jscompress.com/
10 | *
11 | * @author Yuriy Khabarov aka Gromo
12 | * @version 0.2.10
13 | * @url https://github.com/gromo/jquery.scrollbar/
14 | *
15 | */
16 | !function(l,e){"function"==typeof define&&define.amd?define(["jquery"],e):e(l.jQuery)}(this,function(l){"use strict";function e(e){if(t.webkit&&!e)return{height:0,width:0};if(!t.data.outer){var o={border:"none","box-sizing":"content-box",height:"200px",margin:"0",padding:"0",width:"200px"};t.data.inner=l("").css(l.extend({},o)),t.data.outer=l("
").css(l.extend({left:"-1000px",overflow:"scroll",position:"absolute",top:"-1000px"},o)).append(t.data.inner).appendTo("body")}return t.data.outer.scrollLeft(1e3).scrollTop(1e3),{height:Math.ceil(t.data.outer.offset().top-t.data.inner.offset().top||0),width:Math.ceil(t.data.outer.offset().left-t.data.inner.offset().left||0)}}function o(){var l=e(!0);return!(l.height||l.width)}function s(l){var e=l.originalEvent;return e.axis&&e.axis===e.HORIZONTAL_AXIS?!1:e.wheelDeltaX?!1:!0}var r=!1,t={data:{index:0,name:"scrollbar"},macosx:/mac/i.test(navigator.platform),mobile:/android|webos|iphone|ipad|ipod|blackberry/i.test(navigator.userAgent),overlay:null,scroll:null,scrolls:[],webkit:/webkit/i.test(navigator.userAgent)&&!/edge\/\d+/i.test(navigator.userAgent)};t.scrolls.add=function(l){this.remove(l).push(l)},t.scrolls.remove=function(e){for(;l.inArray(e,this)>=0;)this.splice(l.inArray(e,this),1);return this};var i={autoScrollSize:!0,autoUpdate:!0,debug:!1,disableBodyScroll:!1,duration:200,ignoreMobile:!1,ignoreOverlay:!1,scrollStep:30,showArrows:!1,stepScrolling:!0,scrollx:null,scrolly:null,onDestroy:null,onInit:null,onScroll:null,onUpdate:null},n=function(s){t.scroll||(t.overlay=o(),t.scroll=e(),a(),l(window).resize(function(){var l=!1;if(t.scroll&&(t.scroll.height||t.scroll.width)){var o=e();(o.height!==t.scroll.height||o.width!==t.scroll.width)&&(t.scroll=o,l=!0)}a(l)})),this.container=s,this.namespace=".scrollbar_"+t.data.index++,this.options=l.extend({},i,window.jQueryScrollbarOptions||{}),this.scrollTo=null,this.scrollx={},this.scrolly={},s.data(t.data.name,this),t.scrolls.add(this)};n.prototype={destroy:function(){if(this.wrapper){this.container.removeData(t.data.name),t.scrolls.remove(this);var e=this.container.scrollLeft(),o=this.container.scrollTop();this.container.insertBefore(this.wrapper).css({height:"",margin:"","max-height":""}).removeClass("scroll-content scroll-scrollx_visible scroll-scrolly_visible").off(this.namespace).scrollLeft(e).scrollTop(o),this.scrollx.scroll.removeClass("scroll-scrollx_visible").find("div").andSelf().off(this.namespace),this.scrolly.scroll.removeClass("scroll-scrolly_visible").find("div").andSelf().off(this.namespace),this.wrapper.remove(),l(document).add("body").off(this.namespace),l.isFunction(this.options.onDestroy)&&this.options.onDestroy.apply(this,[this.container])}},init:function(e){var o=this,r=this.container,i=this.containerWrapper||r,n=this.namespace,c=l.extend(this.options,e||{}),a={x:this.scrollx,y:this.scrolly},d=this.wrapper,h={scrollLeft:r.scrollLeft(),scrollTop:r.scrollTop()};if(t.mobile&&c.ignoreMobile||t.overlay&&c.ignoreOverlay||t.macosx&&!t.webkit)return!1;if(d)i.css({height:"auto","margin-bottom":-1*t.scroll.height+"px","margin-right":-1*t.scroll.width+"px","max-height":""});else{if(this.wrapper=d=l("
").addClass("scroll-wrapper").addClass(r.attr("class")).css("position","absolute"==r.css("position")?"absolute":"relative").insertBefore(r).append(r),r.is("textarea")&&(this.containerWrapper=i=l("
").insertBefore(r).append(r),d.addClass("scroll-textarea")),i.addClass("scroll-content").css({height:"auto","margin-bottom":-1*t.scroll.height+"px","margin-right":-1*t.scroll.width+"px","max-height":""}),r.on("scroll"+n,function(e){l.isFunction(c.onScroll)&&c.onScroll.call(o,{maxScroll:a.y.maxScrollOffset,scroll:r.scrollTop(),size:a.y.size,visible:a.y.visible},{maxScroll:a.x.maxScrollOffset,scroll:r.scrollLeft(),size:a.x.size,visible:a.x.visible}),a.x.isVisible&&a.x.scroll.bar.css("left",r.scrollLeft()*a.x.kx+"px"),a.y.isVisible&&a.y.scroll.bar.css("top",r.scrollTop()*a.y.kx+"px")}),d.on("scroll"+n,function(){d.scrollTop(0).scrollLeft(0)}),c.disableBodyScroll){var p=function(l){s(l)?a.y.isVisible&&a.y.mousewheel(l):a.x.isVisible&&a.x.mousewheel(l)};d.on("MozMousePixelScroll"+n,p),d.on("mousewheel"+n,p),t.mobile&&d.on("touchstart"+n,function(e){var o=e.originalEvent.touches&&e.originalEvent.touches[0]||e,s={pageX:o.pageX,pageY:o.pageY},t={left:r.scrollLeft(),top:r.scrollTop()};l(document).on("touchmove"+n,function(l){var e=l.originalEvent.targetTouches&&l.originalEvent.targetTouches[0]||l;r.scrollLeft(t.left+s.pageX-e.pageX),r.scrollTop(t.top+s.pageY-e.pageY),l.preventDefault()}),l(document).on("touchend"+n,function(){l(document).off(n)})})}l.isFunction(c.onInit)&&c.onInit.apply(this,[r])}l.each(a,function(e,t){var i=null,d=1,h="x"===e?"scrollLeft":"scrollTop",p=c.scrollStep,u=function(){var l=r[h]();r[h](l+p),1==d&&l+p>=f&&(l=r[h]()),-1==d&&f>=l+p&&(l=r[h]()),r[h]()==l&&i&&i()},f=0;t.scroll||(t.scroll=o._getScroll(c["scroll"+e]).addClass("scroll-"+e),c.showArrows&&t.scroll.addClass("scroll-element_arrows_visible"),t.mousewheel=function(l){if(!t.isVisible||"x"===e&&s(l))return!0;if("y"===e&&!s(l))return a.x.mousewheel(l),!0;var i=-1*l.originalEvent.wheelDelta||l.originalEvent.detail,n=t.size-t.visible-t.offset;return(i>0&&n>f||0>i&&f>0)&&(f+=i,0>f&&(f=0),f>n&&(f=n),o.scrollTo=o.scrollTo||{},o.scrollTo[h]=f,setTimeout(function(){o.scrollTo&&(r.stop().animate(o.scrollTo,240,"linear",function(){f=r[h]()}),o.scrollTo=null)},1)),l.preventDefault(),!1},t.scroll.on("MozMousePixelScroll"+n,t.mousewheel).on("mousewheel"+n,t.mousewheel).on("mouseenter"+n,function(){f=r[h]()}),t.scroll.find(".scroll-arrow, .scroll-element_track").on("mousedown"+n,function(s){if(1!=s.which)return!0;d=1;var n={eventOffset:s["x"===e?"pageX":"pageY"],maxScrollValue:t.size-t.visible-t.offset,scrollbarOffset:t.scroll.bar.offset()["x"===e?"left":"top"],scrollbarSize:t.scroll.bar["x"===e?"outerWidth":"outerHeight"]()},a=0,v=0;return l(this).hasClass("scroll-arrow")?(d=l(this).hasClass("scroll-arrow_more")?1:-1,p=c.scrollStep*d,f=d>0?n.maxScrollValue:0):(d=n.eventOffset>n.scrollbarOffset+n.scrollbarSize?1:n.eventOffset
','','','','",""].join(""),simple:['
"].join("")};return o[e]&&(e=o[e]),e||(e=o.simple),e="string"==typeof e?l(e).appendTo(this.wrapper):l(e),l.extend(e,{bar:e.find(".scroll-bar"),size:e.find(".scroll-element_size"),track:e.find(".scroll-element_track")}),e},_handleMouseDown:function(e,o){var s=this.namespace;return l(document).on("blur"+s,function(){l(document).add("body").off(s),e&&e()}),l(document).on("dragstart"+s,function(l){return l.preventDefault(),!1}),l(document).on("mouseup"+s,function(){l(document).add("body").off(s),e&&e()}),l("body").on("selectstart"+s,function(l){return l.preventDefault(),!1}),o&&o.preventDefault(),!1},_updateScroll:function(e,o){var s=this.container,r=this.containerWrapper||s,i="scroll-scroll"+e+"_visible",n="x"===e?this.scrolly:this.scrollx,c=parseInt(this.container.css("x"===e?"left":"top"),10)||0,a=this.wrapper,d=o.size,h=o.visible+c;o.isVisible=d-h>1,o.isVisible?(o.scroll.addClass(i),n.scroll.addClass(i),r.addClass(i)):(o.scroll.removeClass(i),n.scroll.removeClass(i),r.removeClass(i)),"y"===e&&(s.is("textarea")||h>d?r.css({height:h+t.scroll.height+"px","max-height":"none"}):r.css({"max-height":h+t.scroll.height+"px"})),(o.size!=s.prop("scrollWidth")||n.size!=s.prop("scrollHeight")||o.visible!=a.width()||n.visible!=a.height()||o.offset!=(parseInt(s.css("left"),10)||0)||n.offset!=(parseInt(s.css("top"),10)||0))&&(l.extend(this.scrollx,{offset:parseInt(s.css("left"),10)||0,size:s.prop("scrollWidth"),visible:a.width()}),l.extend(this.scrolly,{offset:parseInt(s.css("top"),10)||0,size:this.container.prop("scrollHeight"),visible:a.height()}),this._updateScroll("x"===e?"y":"x",n))}};var c=n;l.fn.scrollbar=function(e,o){return"string"!=typeof e&&(o=e,e="init"),"undefined"==typeof o&&(o=[]),l.isArray(o)||(o=[o]),this.not("body, .scroll-wrapper").each(function(){var s=l(this),r=s.data(t.data.name);(r||"init"===e)&&(r||(r=new c(s)),r[e]&&r[e].apply(r,o))}),this},l.fn.scrollbar.options=i;var a=function(){var l=0,e=0;return function(o){var s,i,n,c,d,h,p;for(s=0;s
10?(window.console&&console.log("Scroll updates exceed 10"),a=function(){}):(clearTimeout(l),l=setTimeout(a,300))}}();window.angular&&!function(l){l.module("jQueryScrollbar",[]).provider("jQueryScrollbar",function(){var e=i;return{setOptions:function(o){l.extend(e,o)},$get:function(){return{options:l.copy(e)}}}}).directive("jqueryScrollbar",["jQueryScrollbar","$parse",function(l,e){return{restrict:"AC",link:function(o,s,r){var t=e(r.jqueryScrollbar),i=t(o);s.scrollbar(i||l.options).on("$destroy",function(){s.scrollbar("destroy")})}}}])}(window.angular)});
--------------------------------------------------------------------------------
/public/assets/sass/ready/plugins/_chartist.scss:
--------------------------------------------------------------------------------
1 | .ct-label {
2 | fill: rgba(0, 0, 0, 0.5);
3 | color: rgba(0, 0, 0, 0.5);
4 | font-size: 0.8rem;
5 | line-height: 1;
6 | }
7 |
8 | .ct-chart-line .ct-label, .ct-chart-bar .ct-label {
9 | display: block;
10 | display: -webkit-box;
11 | display: -moz-box;
12 | display: -ms-flexbox;
13 | display: -webkit-flex;
14 | display: flex;
15 | }
16 |
17 | .ct-chart-pie .ct-label, .ct-chart-donut .ct-label {
18 | dominant-baseline: central;
19 | }
20 |
21 | .ct-label {
22 | &.ct-horizontal {
23 | &.ct-start {
24 | -webkit-box-align: flex-end;
25 | -webkit-align-items: flex-end;
26 | -ms-flex-align: flex-end;
27 | align-items: flex-end;
28 | -webkit-box-pack: flex-start;
29 | -webkit-justify-content: flex-start;
30 | -ms-flex-pack: flex-start;
31 | justify-content: flex-start;
32 | text-align: left;
33 | text-anchor: start;
34 | }
35 | &.ct-end {
36 | -webkit-box-align: flex-start;
37 | -webkit-align-items: flex-start;
38 | -ms-flex-align: flex-start;
39 | align-items: flex-start;
40 | -webkit-box-pack: flex-start;
41 | -webkit-justify-content: flex-start;
42 | -ms-flex-pack: flex-start;
43 | justify-content: flex-start;
44 | text-align: left;
45 | text-anchor: start;
46 | }
47 | }
48 | &.ct-vertical {
49 | &.ct-start {
50 | -webkit-box-align: flex-end;
51 | -webkit-align-items: flex-end;
52 | -ms-flex-align: flex-end;
53 | align-items: flex-end;
54 | -webkit-box-pack: flex-end;
55 | -webkit-justify-content: flex-end;
56 | -ms-flex-pack: flex-end;
57 | justify-content: flex-end;
58 | text-align: right;
59 | text-anchor: end;
60 | }
61 | &.ct-end {
62 | -webkit-box-align: flex-end;
63 | -webkit-align-items: flex-end;
64 | -ms-flex-align: flex-end;
65 | align-items: flex-end;
66 | -webkit-box-pack: flex-start;
67 | -webkit-justify-content: flex-start;
68 | -ms-flex-pack: flex-start;
69 | justify-content: flex-start;
70 | text-align: left;
71 | text-anchor: start;
72 | }
73 | }
74 | }
75 |
76 | .ct-chart-bar {
77 | .ct-label.ct-horizontal {
78 | &.ct-start {
79 | -webkit-box-align: flex-end;
80 | -webkit-align-items: flex-end;
81 | -ms-flex-align: flex-end;
82 | align-items: flex-end;
83 | -webkit-box-pack: center;
84 | -webkit-justify-content: center;
85 | -ms-flex-pack: center;
86 | justify-content: center;
87 | text-align: center;
88 | text-anchor: start;
89 | }
90 | &.ct-end {
91 | -webkit-box-align: flex-start;
92 | -webkit-align-items: flex-start;
93 | -ms-flex-align: flex-start;
94 | align-items: flex-start;
95 | -webkit-box-pack: center;
96 | -webkit-justify-content: center;
97 | -ms-flex-pack: center;
98 | justify-content: center;
99 | text-align: center;
100 | text-anchor: start;
101 | }
102 | }
103 | &.ct-horizontal-bars .ct-label {
104 | &.ct-horizontal {
105 | &.ct-start {
106 | -webkit-box-align: flex-end;
107 | -webkit-align-items: flex-end;
108 | -ms-flex-align: flex-end;
109 | align-items: flex-end;
110 | -webkit-box-pack: flex-start;
111 | -webkit-justify-content: flex-start;
112 | -ms-flex-pack: flex-start;
113 | justify-content: flex-start;
114 | text-align: left;
115 | text-anchor: start;
116 | }
117 | &.ct-end {
118 | -webkit-box-align: flex-start;
119 | -webkit-align-items: flex-start;
120 | -ms-flex-align: flex-start;
121 | align-items: flex-start;
122 | -webkit-box-pack: flex-start;
123 | -webkit-justify-content: flex-start;
124 | -ms-flex-pack: flex-start;
125 | justify-content: flex-start;
126 | text-align: left;
127 | text-anchor: start;
128 | }
129 | }
130 | &.ct-vertical {
131 | &.ct-start {
132 | -webkit-box-align: center;
133 | -webkit-align-items: center;
134 | -ms-flex-align: center;
135 | align-items: center;
136 | -webkit-box-pack: flex-end;
137 | -webkit-justify-content: flex-end;
138 | -ms-flex-pack: flex-end;
139 | justify-content: flex-end;
140 | text-align: right;
141 | text-anchor: end;
142 | }
143 | &.ct-end {
144 | -webkit-box-align: center;
145 | -webkit-align-items: center;
146 | -ms-flex-align: center;
147 | align-items: center;
148 | -webkit-box-pack: flex-start;
149 | -webkit-justify-content: flex-start;
150 | -ms-flex-pack: flex-start;
151 | justify-content: flex-start;
152 | text-align: left;
153 | text-anchor: end;
154 | }
155 | }
156 | }
157 | }
158 |
159 | .ct-grid {
160 | stroke: rgba(0, 0, 0, 0.2);
161 | stroke-width: 1px;
162 | stroke-dasharray: 2px;
163 | }
164 |
165 | .ct-grid-background {
166 | fill: none;
167 | }
168 |
169 | .ct-point {
170 | stroke-width: 7px;
171 | stroke-linecap: round;
172 | }
173 |
174 | .ct-line {
175 | fill: none;
176 | stroke-width: 3px;
177 | }
178 |
179 | .ct-area {
180 | stroke: none;
181 | fill-opacity: 0.1;
182 | }
183 |
184 | .ct-bar {
185 | fill: none;
186 | stroke-width: 10px;
187 | }
188 |
189 | .ct-slice-donut {
190 | fill: none;
191 | stroke-width: 60px;
192 | }
193 |
194 | .ct-series-a {
195 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
196 | stroke: #1D62F0;
197 | }
198 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
199 | fill: #1D62F0;
200 | }
201 | }
202 |
203 | .ct-series-b {
204 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
205 | stroke: #ff646d;
206 | }
207 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
208 | fill: #ff646d;
209 | }
210 | }
211 |
212 | .ct-series-c {
213 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
214 | stroke: #fbad4c;
215 | }
216 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
217 | fill: #fbad4c;
218 | }
219 | }
220 |
221 | .ct-series-d {
222 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
223 | stroke: #9368E9;
224 | }
225 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
226 | fill: #9368E9;
227 | }
228 | }
229 |
230 | .ct-series-e {
231 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
232 | stroke: #87CB16;
233 | }
234 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
235 | fill: #87CB16;
236 | }
237 | }
238 |
239 | .ct-series-f {
240 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
241 | stroke: #59922b;
242 | }
243 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
244 | fill: #59922b;
245 | }
246 | }
247 |
248 | .ct-series-g {
249 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
250 | stroke: #0544d3;
251 | }
252 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
253 | fill: #0544d3;
254 | }
255 | }
256 |
257 | .ct-series-h {
258 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
259 | stroke: #6b0392;
260 | }
261 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
262 | fill: #6b0392;
263 | }
264 | }
265 |
266 | .ct-series-i {
267 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
268 | stroke: #f05b4f;
269 | }
270 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
271 | fill: #f05b4f;
272 | }
273 | }
274 |
275 | .ct-series-j {
276 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
277 | stroke: #dda458;
278 | }
279 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
280 | fill: #dda458;
281 | }
282 | }
283 |
284 | .ct-series-k {
285 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
286 | stroke: #eacf7d;
287 | }
288 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
289 | fill: #eacf7d;
290 | }
291 | }
292 |
293 | .ct-series-l {
294 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
295 | stroke: #86797d;
296 | }
297 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
298 | fill: #86797d;
299 | }
300 | }
301 |
302 | .ct-series-m {
303 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
304 | stroke: #b2c326;
305 | }
306 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
307 | fill: #b2c326;
308 | }
309 | }
310 |
311 | .ct-series-n {
312 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
313 | stroke: #6188e2;
314 | }
315 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
316 | fill: #6188e2;
317 | }
318 | }
319 |
320 | .ct-series-o {
321 | .ct-point, .ct-line, .ct-bar, .ct-slice-donut {
322 | stroke: #a748ca;
323 | }
324 | .ct-slice-pie, .ct-slice-donut-solid, .ct-area {
325 | fill: #a748ca;
326 | }
327 | }
328 |
329 | .ct-square {
330 | display: block;
331 | position: relative;
332 | width: 100%;
333 | &:before {
334 | display: block;
335 | float: left;
336 | content: "";
337 | width: 0;
338 | height: 0;
339 | padding-bottom: 100%;
340 | }
341 | &:after {
342 | content: "";
343 | display: table;
344 | clear: both;
345 | }
346 | > svg {
347 | display: block;
348 | position: absolute;
349 | top: 0;
350 | left: 0;
351 | }
352 | }
353 |
354 | .ct-minor-second {
355 | display: block;
356 | position: relative;
357 | width: 100%;
358 | &:before {
359 | display: block;
360 | float: left;
361 | content: "";
362 | width: 0;
363 | height: 0;
364 | padding-bottom: 93.75%;
365 | }
366 | &:after {
367 | content: "";
368 | display: table;
369 | clear: both;
370 | }
371 | > svg {
372 | display: block;
373 | position: absolute;
374 | top: 0;
375 | left: 0;
376 | }
377 | }
378 |
379 | .ct-major-second {
380 | display: block;
381 | position: relative;
382 | width: 100%;
383 | &:before {
384 | display: block;
385 | float: left;
386 | content: "";
387 | width: 0;
388 | height: 0;
389 | padding-bottom: 88.8888888889%;
390 | }
391 | &:after {
392 | content: "";
393 | display: table;
394 | clear: both;
395 | }
396 | > svg {
397 | display: block;
398 | position: absolute;
399 | top: 0;
400 | left: 0;
401 | }
402 | }
403 |
404 | .ct-minor-third {
405 | display: block;
406 | position: relative;
407 | width: 100%;
408 | &:before {
409 | display: block;
410 | float: left;
411 | content: "";
412 | width: 0;
413 | height: 0;
414 | padding-bottom: 83.3333333333%;
415 | }
416 | &:after {
417 | content: "";
418 | display: table;
419 | clear: both;
420 | }
421 | > svg {
422 | display: block;
423 | position: absolute;
424 | top: 0;
425 | left: 0;
426 | }
427 | }
428 |
429 | .ct-major-third {
430 | display: block;
431 | position: relative;
432 | width: 100%;
433 | &:before {
434 | display: block;
435 | float: left;
436 | content: "";
437 | width: 0;
438 | height: 0;
439 | padding-bottom: 80%;
440 | }
441 | &:after {
442 | content: "";
443 | display: table;
444 | clear: both;
445 | }
446 | > svg {
447 | display: block;
448 | position: absolute;
449 | top: 0;
450 | left: 0;
451 | }
452 | }
453 |
454 | .ct-perfect-fourth {
455 | display: block;
456 | position: relative;
457 | width: 100%;
458 | &:before {
459 | display: block;
460 | float: left;
461 | content: "";
462 | width: 0;
463 | height: 0;
464 | padding-bottom: 75%;
465 | }
466 | &:after {
467 | content: "";
468 | display: table;
469 | clear: both;
470 | }
471 | > svg {
472 | display: block;
473 | position: absolute;
474 | top: 0;
475 | left: 0;
476 | }
477 | }
478 |
479 | .ct-perfect-fifth {
480 | display: block;
481 | position: relative;
482 | width: 100%;
483 | &:before {
484 | display: block;
485 | float: left;
486 | content: "";
487 | width: 0;
488 | height: 0;
489 | padding-bottom: 66.6666666667%;
490 | }
491 | &:after {
492 | content: "";
493 | display: table;
494 | clear: both;
495 | }
496 | > svg {
497 | display: block;
498 | position: absolute;
499 | top: 0;
500 | left: 0;
501 | }
502 | }
503 |
504 | .ct-minor-sixth {
505 | display: block;
506 | position: relative;
507 | width: 100%;
508 | &:before {
509 | display: block;
510 | float: left;
511 | content: "";
512 | width: 0;
513 | height: 0;
514 | padding-bottom: 62.5%;
515 | }
516 | &:after {
517 | content: "";
518 | display: table;
519 | clear: both;
520 | }
521 | > svg {
522 | display: block;
523 | position: absolute;
524 | top: 0;
525 | left: 0;
526 | }
527 | }
528 |
529 | .ct-golden-section {
530 | display: block;
531 | position: relative;
532 | width: 100%;
533 | &:before {
534 | display: block;
535 | float: left;
536 | content: "";
537 | width: 0;
538 | height: 0;
539 | padding-bottom: 61.804697157%;
540 | }
541 | &:after {
542 | content: "";
543 | display: table;
544 | clear: both;
545 | }
546 | > svg {
547 | display: block;
548 | position: absolute;
549 | top: 0;
550 | left: 0;
551 | }
552 | }
553 |
554 | .ct-major-sixth {
555 | display: block;
556 | position: relative;
557 | width: 100%;
558 | &:before {
559 | display: block;
560 | float: left;
561 | content: "";
562 | width: 0;
563 | height: 0;
564 | padding-bottom: 60%;
565 | }
566 | &:after {
567 | content: "";
568 | display: table;
569 | clear: both;
570 | }
571 | > svg {
572 | display: block;
573 | position: absolute;
574 | top: 0;
575 | left: 0;
576 | }
577 | }
578 |
579 | .ct-minor-seventh {
580 | display: block;
581 | position: relative;
582 | width: 100%;
583 | &:before {
584 | display: block;
585 | float: left;
586 | content: "";
587 | width: 0;
588 | height: 0;
589 | padding-bottom: 56.25%;
590 | }
591 | &:after {
592 | content: "";
593 | display: table;
594 | clear: both;
595 | }
596 | > svg {
597 | display: block;
598 | position: absolute;
599 | top: 0;
600 | left: 0;
601 | }
602 | }
603 |
604 | .ct-major-seventh {
605 | display: block;
606 | position: relative;
607 | width: 100%;
608 | &:before {
609 | display: block;
610 | float: left;
611 | content: "";
612 | width: 0;
613 | height: 0;
614 | padding-bottom: 53.3333333333%;
615 | }
616 | &:after {
617 | content: "";
618 | display: table;
619 | clear: both;
620 | }
621 | > svg {
622 | display: block;
623 | position: absolute;
624 | top: 0;
625 | left: 0;
626 | }
627 | }
628 |
629 | .ct-octave {
630 | display: block;
631 | position: relative;
632 | width: 100%;
633 | &:before {
634 | display: block;
635 | float: left;
636 | content: "";
637 | width: 0;
638 | height: 0;
639 | padding-bottom: 50%;
640 | }
641 | &:after {
642 | content: "";
643 | display: table;
644 | clear: both;
645 | }
646 | > svg {
647 | display: block;
648 | position: absolute;
649 | top: 0;
650 | left: 0;
651 | }
652 | }
653 |
654 | .ct-major-tenth {
655 | display: block;
656 | position: relative;
657 | width: 100%;
658 | &:before {
659 | display: block;
660 | float: left;
661 | content: "";
662 | width: 0;
663 | height: 0;
664 | padding-bottom: 40%;
665 | }
666 | &:after {
667 | content: "";
668 | display: table;
669 | clear: both;
670 | }
671 | > svg {
672 | display: block;
673 | position: absolute;
674 | top: 0;
675 | left: 0;
676 | }
677 | }
678 |
679 | .ct-major-eleventh {
680 | display: block;
681 | position: relative;
682 | width: 100%;
683 | &:before {
684 | display: block;
685 | float: left;
686 | content: "";
687 | width: 0;
688 | height: 0;
689 | padding-bottom: 37.5%;
690 | }
691 | &:after {
692 | content: "";
693 | display: table;
694 | clear: both;
695 | }
696 | > svg {
697 | display: block;
698 | position: absolute;
699 | top: 0;
700 | left: 0;
701 | }
702 | }
703 |
704 | .ct-major-twelfth {
705 | display: block;
706 | position: relative;
707 | width: 100%;
708 | &:before {
709 | display: block;
710 | float: left;
711 | content: "";
712 | width: 0;
713 | height: 0;
714 | padding-bottom: 33.3333333333%;
715 | }
716 | &:after {
717 | content: "";
718 | display: table;
719 | clear: both;
720 | }
721 | > svg {
722 | display: block;
723 | position: absolute;
724 | top: 0;
725 | left: 0;
726 | }
727 | }
728 |
729 | .ct-double-octave {
730 | display: block;
731 | position: relative;
732 | width: 100%;
733 | &:before {
734 | display: block;
735 | float: left;
736 | content: "";
737 | width: 0;
738 | height: 0;
739 | padding-bottom: 25%;
740 | }
741 | &:after {
742 | content: "";
743 | display: table;
744 | clear: both;
745 | }
746 | > svg {
747 | display: block;
748 | position: absolute;
749 | top: 0;
750 | left: 0;
751 | }
752 | }
753 |
754 | .chartist-tooltip {
755 | position: absolute;
756 | display: inline-block;
757 | opacity: 0;
758 | min-width: 3em;
759 | padding: .25em;
760 | background: rgba(0, 0, 0, 0.77);
761 | color: #fff;
762 | font-weight: 600;
763 | text-align: center;
764 | pointer-events: none;
765 | z-index: 1;
766 | -webkit-transition: opacity .2s linear;
767 | -moz-transition: opacity .2s linear;
768 | -o-transition: opacity .2s linear;
769 | transition: opacity .2s linear;
770 | &:before {
771 | content: "";
772 | position: absolute;
773 | top: 100%;
774 | left: 50%;
775 | width: 0;
776 | height: 0;
777 | margin-left: -5px;
778 | border: 5px solid transparent;
779 | border-top-color: rgba(0, 0, 0, 0.77);
780 | }
781 | }
782 |
783 | .chartist-tooltip-value {
784 | font-size: 14px;
785 | }
786 |
787 | .chartist-tooltip.tooltip-show {
788 | opacity: 1;
789 | }
790 |
791 | .ct-area, .ct-line {
792 | pointer-events: none;
793 | }
--------------------------------------------------------------------------------