first commit

.vscode/launch.json

@@ -0,0 +1,17 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "Launch Program",
+            "skipFiles": [
+                "<node_internals>/**"
+            ],
+            "program": "${workspaceFolder}/test.js"
+        }
+    ]
+}

bootstrap-5.0.1-dist/css/bootstrap-reboot.css

@@ -0,0 +1,426 @@
+/*!
+ * Bootstrap Reboot v5.0.1 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
+ */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  :root {
+    scroll-behavior: smooth;
+  }
+}
+
+body {
+  margin: 0;
+  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  background-color: #fff;
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+hr {
+  margin: 1rem 0;
+  color: inherit;
+  background-color: currentColor;
+  border: 0;
+  opacity: 0.25;
+}
+
+hr:not([size]) {
+  height: 1px;
+}
+
+h6, h5, h4, h3, h2, h1 {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  line-height: 1.2;
+}
+
+h1 {
+  font-size: calc(1.375rem + 1.5vw);
+}
+@media (min-width: 1200px) {
+  h1 {
+    font-size: 2.5rem;
+  }
+}
+
+h2 {
+  font-size: calc(1.325rem + 0.9vw);
+}
+@media (min-width: 1200px) {
+  h2 {
+    font-size: 2rem;
+  }
+}
+
+h3 {
+  font-size: calc(1.3rem + 0.6vw);
+}
+@media (min-width: 1200px) {
+  h3 {
+    font-size: 1.75rem;
+  }
+}
+
+h4 {
+  font-size: calc(1.275rem + 0.3vw);
+}
+@media (min-width: 1200px) {
+  h4 {
+    font-size: 1.5rem;
+  }
+}
+
+h5 {
+  font-size: 1.25rem;
+}
+
+h6 {
+  font-size: 1rem;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+abbr[title],
+abbr[data-bs-original-title] {
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+  cursor: help;
+  -webkit-text-decoration-skip-ink: none;
+  text-decoration-skip-ink: none;
+}
+
+address {
+  margin-bottom: 1rem;
+  font-style: normal;
+  line-height: inherit;
+}
+
+ol,
+ul {
+  padding-left: 2rem;
+}
+
+ol,
+ul,
+dl {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-left: 0;
+}
+
+blockquote {
+  margin: 0 0 1rem;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small {
+  font-size: 0.875em;
+}
+
+mark {
+  padding: 0.2em;
+  background-color: #fcf8e3;
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+a {
+  color: #0d6efd;
+  text-decoration: underline;
+}
+a:hover {
+  color: #0a58ca;
+}
+
+a:not([href]):not([class]), a:not([href]):not([class]):hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-size: 1em;
+  direction: ltr /* rtl:ignore */;
+  unicode-bidi: bidi-override;
+}
+
+pre {
+  display: block;
+  margin-top: 0;
+  margin-bottom: 1rem;
+  overflow: auto;
+  font-size: 0.875em;
+}
+pre code {
+  font-size: inherit;
+  color: inherit;
+  word-break: normal;
+}
+
+code {
+  font-size: 0.875em;
+  color: #d63384;
+  word-wrap: break-word;
+}
+a > code {
+  color: inherit;
+}
+
+kbd {
+  padding: 0.2rem 0.4rem;
+  font-size: 0.875em;
+  color: #fff;
+  background-color: #212529;
+  border-radius: 0.2rem;
+}
+kbd kbd {
+  padding: 0;
+  font-size: 1em;
+  font-weight: 700;
+}
+
+figure {
+  margin: 0 0 1rem;
+}
+
+img,
+svg {
+  vertical-align: middle;
+}
+
+table {
+  caption-side: bottom;
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  color: #6c757d;
+  text-align: left;
+}
+
+th {
+  text-align: inherit;
+  text-align: -webkit-match-parent;
+}
+
+thead,
+tbody,
+tfoot,
+tr,
+td,
+th {
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+}
+
+label {
+  display: inline-block;
+}
+
+button {
+  border-radius: 0;
+}
+
+button:focus:not(:focus-visible) {
+  outline: 0;
+}
+
+input,
+button,
+select,
+optgroup,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+[role=button] {
+  cursor: pointer;
+}
+
+select {
+  word-wrap: normal;
+}
+select:disabled {
+  opacity: 1;
+}
+
+[list]::-webkit-calendar-picker-indicator {
+  display: none;
+}
+
+button,
+[type=button],
+[type=reset],
+[type=submit] {
+  -webkit-appearance: button;
+}
+button:not(:disabled),
+[type=button]:not(:disabled),
+[type=reset]:not(:disabled),
+[type=submit]:not(:disabled) {
+  cursor: pointer;
+}
+
+::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+textarea {
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  float: left;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 0.5rem;
+  font-size: calc(1.275rem + 0.3vw);
+  line-height: inherit;
+}
+@media (min-width: 1200px) {
+  legend {
+    font-size: 1.5rem;
+  }
+}
+legend + * {
+  clear: left;
+}
+
+::-webkit-datetime-edit-fields-wrapper,
+::-webkit-datetime-edit-text,
+::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-hour-field,
+::-webkit-datetime-edit-day-field,
+::-webkit-datetime-edit-month-field,
+::-webkit-datetime-edit-year-field {
+  padding: 0;
+}
+
+::-webkit-inner-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  outline-offset: -2px;
+  -webkit-appearance: textfield;
+}
+
+/* rtl:raw:
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+  direction: ltr;
+}
+*/
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-color-swatch-wrapper {
+  padding: 0;
+}
+
+::file-selector-button {
+  font: inherit;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+iframe {
+  border: 0;
+}
+
+summary {
+  display: list-item;
+  cursor: pointer;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+/*# sourceMappingURL=bootstrap-reboot.css.map */

bootstrap-5.0.1-dist/css/bootstrap-reboot.min.css

@@ -0,0 +1,8 @@
+/*!
+ * Bootstrap Reboot v5.0.1 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
+ */*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;background-color:#fff;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;background-color:currentColor;border:0;opacity:.25}hr:not([size]){height:1px}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){h2{font-size:2rem}}h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){h3{font-size:1.75rem}}h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){h4{font-size:1.5rem}}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[data-bs-original-title],abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:.875em}mark{padding:.2em;background-color:#fcf8e3}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#0d6efd;text-decoration:underline}a:hover{color:#0a58ca}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em;direction:ltr;unicode-bidi:bidi-override}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:#d63384;word-wrap:break-word}a>code{color:inherit}kbd{padding:.2rem .4rem;font-size:.875em;color:#fff;background-color:#212529;border-radius:.2rem}kbd kbd{padding:0;font-size:1em;font-weight:700}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:#6c757d;text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,tfoot,th,thead,tr{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]::-webkit-calendar-picker-indicator{display:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:textfield}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::file-selector-button{font:inherit}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}
+/*# sourceMappingURL=bootstrap-reboot.min.css.map */

bootstrap-5.0.1-dist/css/bootstrap-reboot.rtl.css

@@ -0,0 +1,423 @@
+/*!
+ * Bootstrap Reboot v5.0.1 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
+ */
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  :root {
+    scroll-behavior: smooth;
+  }
+}
+
+body {
+  margin: 0;
+  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  background-color: #fff;
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+hr {
+  margin: 1rem 0;
+  color: inherit;
+  background-color: currentColor;
+  border: 0;
+  opacity: 0.25;
+}
+
+hr:not([size]) {
+  height: 1px;
+}
+
+h6, h5, h4, h3, h2, h1 {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  line-height: 1.2;
+}
+
+h1 {
+  font-size: calc(1.375rem + 1.5vw);
+}
+@media (min-width: 1200px) {
+  h1 {
+    font-size: 2.5rem;
+  }
+}
+
+h2 {
+  font-size: calc(1.325rem + 0.9vw);
+}
+@media (min-width: 1200px) {
+  h2 {
+    font-size: 2rem;
+  }
+}
+
+h3 {
+  font-size: calc(1.3rem + 0.6vw);
+}
+@media (min-width: 1200px) {
+  h3 {
+    font-size: 1.75rem;
+  }
+}
+
+h4 {
+  font-size: calc(1.275rem + 0.3vw);
+}
+@media (min-width: 1200px) {
+  h4 {
+    font-size: 1.5rem;
+  }
+}
+
+h5 {
+  font-size: 1.25rem;
+}
+
+h6 {
+  font-size: 1rem;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+abbr[title],
+abbr[data-bs-original-title] {
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+  cursor: help;
+  -webkit-text-decoration-skip-ink: none;
+  text-decoration-skip-ink: none;
+}
+
+address {
+  margin-bottom: 1rem;
+  font-style: normal;
+  line-height: inherit;
+}
+
+ol,
+ul {
+  padding-right: 2rem;
+}
+
+ol,
+ul,
+dl {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-right: 0;
+}
+
+blockquote {
+  margin: 0 0 1rem;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small {
+  font-size: 0.875em;
+}
+
+mark {
+  padding: 0.2em;
+  background-color: #fcf8e3;
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+a {
+  color: #0d6efd;
+  text-decoration: underline;
+}
+a:hover {
+  color: #0a58ca;
+}
+
+a:not([href]):not([class]), a:not([href]):not([class]):hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-size: 1em;
+  direction: ltr ;
+  unicode-bidi: bidi-override;
+}
+
+pre {
+  display: block;
+  margin-top: 0;
+  margin-bottom: 1rem;
+  overflow: auto;
+  font-size: 0.875em;
+}
+pre code {
+  font-size: inherit;
+  color: inherit;
+  word-break: normal;
+}
+
+code {
+  font-size: 0.875em;
+  color: #d63384;
+  word-wrap: break-word;
+}
+a > code {
+  color: inherit;
+}
+
+kbd {
+  padding: 0.2rem 0.4rem;
+  font-size: 0.875em;
+  color: #fff;
+  background-color: #212529;
+  border-radius: 0.2rem;
+}
+kbd kbd {
+  padding: 0;
+  font-size: 1em;
+  font-weight: 700;
+}
+
+figure {
+  margin: 0 0 1rem;
+}
+
+img,
+svg {
+  vertical-align: middle;
+}
+
+table {
+  caption-side: bottom;
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  color: #6c757d;
+  text-align: right;
+}
+
+th {
+  text-align: inherit;
+  text-align: -webkit-match-parent;
+}
+
+thead,
+tbody,
+tfoot,
+tr,
+td,
+th {
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+}
+
+label {
+  display: inline-block;
+}
+
+button {
+  border-radius: 0;
+}
+
+button:focus:not(:focus-visible) {
+  outline: 0;
+}
+
+input,
+button,
+select,
+optgroup,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+[role=button] {
+  cursor: pointer;
+}
+
+select {
+  word-wrap: normal;
+}
+select:disabled {
+  opacity: 1;
+}
+
+[list]::-webkit-calendar-picker-indicator {
+  display: none;
+}
+
+button,
+[type=button],
+[type=reset],
+[type=submit] {
+  -webkit-appearance: button;
+}
+button:not(:disabled),
+[type=button]:not(:disabled),
+[type=reset]:not(:disabled),
+[type=submit]:not(:disabled) {
+  cursor: pointer;
+}
+
+::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+textarea {
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  float: right;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 0.5rem;
+  font-size: calc(1.275rem + 0.3vw);
+  line-height: inherit;
+}
+@media (min-width: 1200px) {
+  legend {
+    font-size: 1.5rem;
+  }
+}
+legend + * {
+  clear: right;
+}
+
+::-webkit-datetime-edit-fields-wrapper,
+::-webkit-datetime-edit-text,
+::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-hour-field,
+::-webkit-datetime-edit-day-field,
+::-webkit-datetime-edit-month-field,
+::-webkit-datetime-edit-year-field {
+  padding: 0;
+}
+
+::-webkit-inner-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  outline-offset: -2px;
+  -webkit-appearance: textfield;
+}
+
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+  direction: ltr;
+}
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-color-swatch-wrapper {
+  padding: 0;
+}
+
+::file-selector-button {
+  font: inherit;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+iframe {
+  border: 0;
+}
+
+summary {
+  display: list-item;
+  cursor: pointer;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[hidden] {
+  display: none !important;
+}
+/*# sourceMappingURL=bootstrap-reboot.rtl.css.map */

bootstrap-5.0.1-dist/css/bootstrap-reboot.rtl.min.css

@@ -0,0 +1,8 @@
+/*!
+ * Bootstrap Reboot v5.0.1 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
+ */*,::after,::before{box-sizing:border-box}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:1rem;font-weight:400;line-height:1.5;color:#212529;background-color:#fff;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}hr{margin:1rem 0;color:inherit;background-color:currentColor;border:0;opacity:.25}hr:not([size]){height:1px}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}h1{font-size:calc(1.375rem + 1.5vw)}@media (min-width:1200px){h1{font-size:2.5rem}}h2{font-size:calc(1.325rem + .9vw)}@media (min-width:1200px){h2{font-size:2rem}}h3{font-size:calc(1.3rem + .6vw)}@media (min-width:1200px){h3{font-size:1.75rem}}h4{font-size:calc(1.275rem + .3vw)}@media (min-width:1200px){h4{font-size:1.5rem}}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-top:0;margin-bottom:1rem}abbr[data-bs-original-title],abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-right:2rem}dl,ol,ul{margin-top:0;margin-bottom:1rem}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-right:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:.875em}mark{padding:.2em;background-color:#fcf8e3}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{color:#0d6efd;text-decoration:underline}a:hover{color:#0a58ca}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em;direction:ltr;unicode-bidi:bidi-override}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:.875em;color:#d63384;word-wrap:break-word}a>code{color:inherit}kbd{padding:.2rem .4rem;font-size:.875em;color:#fff;background-color:#212529;border-radius:.2rem}kbd kbd{padding:0;font-size:1em;font-weight:700}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:#6c757d;text-align:right}th{text-align:inherit;text-align:-webkit-match-parent}tbody,td,tfoot,th,thead,tr{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]::-webkit-calendar-picker-indicator{display:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:right;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit}@media (min-width:1200px){legend{font-size:1.5rem}}legend+*{clear:right}::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:textfield}[type=email],[type=number],[type=tel],[type=url]{direction:ltr}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::file-selector-button{font:inherit}::-webkit-file-upload-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none!important}
+/*# sourceMappingURL=bootstrap-reboot.rtl.min.css.map */

img/source.txt

@@ -0,0 +1,36 @@
+headerImg.jpg
+https://unsplash.com/photos/P4usAX3qaVg
+
+applePie
+https://unsplash.com/photos/WblRRvaMkaQ
+
+cakes
+https://unsplash.com/photos/kPxsqUGneXQ
+
+cookies
+https://unsplash.com/photos/kID9sxbJ3BQ
+
+Croissants
+https://unsplash.com/photos/lE5O9DktAQY
+
+cupcakes
+https://unsplash.com/photos/S2jw81lfrG0
+
+iceCream
+https://unsplash.com/photos/cLpdEA23Z44
+
+pancke
+https://unsplash.com/photos/jsgJtBOR6jY
+
+pudding
+https://unsplash.com/photos/-XazBwHUtJs
+
+index_bg
+https://www.pexels.com/zh-cn/photo/205961/
+
+index_bg1
+https://www.pexels.com/video/4547597/
+
+
+index text
+https://www.spotdessertbar.com/catering-events

index.html

@@ -0,0 +1,270 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Bootstrap CSS -->
+    <link href="bootstrap-5.0.1-dist/css/bootstrap-grid.min.css" rel="stylesheet">
+    <link href="bootstrap-5.0.1-dist/css/bootstrap.min.css" rel="stylesheet">
+
+    <!--=== Main Style CSS ===-->
+    <link href="style/style.css" rel="stylesheet">
+
+    <!-- Font Awesome styles CDN Link -->
+    <link
+      href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
+      rel="stylesheet"
+      integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
+      crossorigin="anonymous"
+    />
+    <title>New Moon Dessert Bar</title>
+  </head>
+
+  <body class="index-page">
+    <div class="container-fluid">
+      <div class="video-container-bg">
+        <div class="row navbar-row">
+          <div class="col"></div>
+          <div class="col-sm-10">
+            <div class="container navbar-container">
+              <nav class="navbar navbar-expand-lg">
+                <div class="container-fluid">
+                  <a class="navbar-brand" href="#">&#127854;Home</a>
+                  <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
+                    <div class="dropdownicon">&#9776;</div>
+                  </button>
+                  <div class="collapse navbar-collapse" id="navbarNavDropdown">
+                    <ul class="navbar-nav">
+                        <!-- <li class="nav-item">
+                            <a class="nav-link active" aria-current="page" href="#">&#127854;Home</a>
+                        </li> -->
+                        <li class="nav-item">
+                            <a class="nav-link active" href="#index-sectionMenu">MENU</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#index-sectionSource">SOURCE</a>
+                        </li>
+                        <li class="nav-item">
+                            <a class="nav-link" href="#index-sectionDocumentation">DOCUMENTATION</a>
+                        </li>
+                    </ul>
+                  </div>
+                </div>
+              </nav>
+            </div>
+          </div>
+          <div class="col"></div>
+        </div>
+        <div class="sectionMain">
+          <h1>New Moon Dessert Bar</h1>
+          <br>
+          <h2>WE OFFER EASY PACKAGES FOR THOSE SHORT ON TIME
+            <br>
+          AS WELL AS FULL CUSTOM PLANNING FOR THOSE SEEKING SOMETHING UNIQUE. <br>EITHER WAY, SPOT DESSERT CATERING IS  ALWAYS DELICIOUS,
+            <br>
+          BEAUTIFUL AND SPECIAL.
+          </h2>
+          <br>
+          <h3>TAKE-OUT & DELIVERY ARE AVAILABLE!</h3>
+          <button class="btn btn-lg my-btn" type="button" id="btn-home-login" data-bs-toggle="modal" data-bs-target="#logInModal"> LOGIN</button>
+        </div>
+        <video aria-hidden="true" autoplay="" loop="" muted="" playsinline="" class="video-bg"  >
+          <source src="img/index_bg1.mp4" type="video/mp4" alt="New Moon video" >
+        </video>
+      </div>
+      <div class="sectionMenu" id="index-sectionMenu">
+        <div class="row">
+          <div class="col-sm-12">
+            <h1>Menu</h1>
+          </div>
+        </div>
+        <div class="row">
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/applePie.jpg" >
+              <h3>ApplePie</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/cakes.jpg" >
+              <h3>Cakes</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/cookies.jpg" >
+              <h3>Cookies</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/croissants.jpg" >
+              <h3>Croissants</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/cupcakes.jpg" >
+              <h3>Cupcakes</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/iceCream.jpg" >
+              <h3>IceCream</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/pancake.jpg" >
+              <h3>Pancake</h3>
+            </div>
+          </div>
+          <div class="col-sm-12 col-lg-6 col-xl-3">
+            <div class="my-img-class">
+              <img onclick='showBgImg(this)' class="imgItem" src="img/pudding.jpg" >
+              <h3>Pudding</h3>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="sectionSource" id="index-sectionSource">
+        <div class="row">
+          <div class="col-sm-12">
+            <h2>Image Source</h2>
+          </div>
+        </div>
+        <p>
+          <h4>headerImg</h4>
+          https://unsplash.com/photos/P4usAX3qaVg<br>
+
+          <h4>applePie</h4>
+          https://unsplash.com/photos/WblRRvaMkaQ<br>
+
+          <h4>cakes</h4>
+          https://unsplash.com/photos/kPxsqUGneXQ<br>
+
+          <h4>cookies</h4>
+          https://unsplash.com/photos/kID9sxbJ3BQ<br>
+
+          <h4>Croissants</h4>
+          https://unsplash.com/photos/lE5O9DktAQY<br>
+
+          <h4>cupcakes</h4>
+          https://unsplash.com/photos/S2jw81lfrG0<br>
+
+          <h4>iceCream</h4>
+          https://unsplash.com/photos/cLpdEA23Z44<br>
+
+          <h4>pancke</h4>
+          https://unsplash.com/photos/jsgJtBOR6jY<br>
+
+          <h4>pudding</h4>
+          https://unsplash.com/photos/-XazBwHUtJs<br>
+
+          <h4>index_bg1</h4>
+          https://www.pexels.com/video/4547597/<br>
+
+          <h4>index - Instruction</h4>
+          https://www.spotdessertbar.com/catering-events
+        </p>
+
+      </div>
+
+      <div class="sectionDocumentation" id="index-sectionDocumentation">
+        <div class="row">
+          <div class="col-sm-12">
+            <h2>Instruction</h2>
+          </div>
+        </div>
+        <p> This is the webpage of a dessert bar.<br>
+            People need to log in to order. Before logging in, you can browse the menu page first. On the menu page, you can click to enlarge the picture.<br>
+            There is a login button in the upper right corner of the page. On the login page, if you do not have an account, you should register an account.<br>
+            After logging in, you can click on one of the pictures of desserts, and then select the quantity you want.<br>
+            Unfortunately, I don’t have enough time to complete all the functions of the shopping cart. This website can only display the products that the user has just added.</p>
+        <h2>Screenshots of validation</h2>
+
+        <img src="img/1.png" width="800px" height="500px">
+        <img src="img/2.png" width="800px" height="500px">
+        <img src="img/3.png" width="800px" height="500px">
+        <img src="img/4.png" width="800px" height="500px">
+        <img src="img/5.png" width="800px" height="500px">
+        <img src="img/6.png" width="800px" height="500px">
+        <img src="img/7.png" width="800px" height="500px">
+      </div>
+
+      <!-- Modal -->
+      
+      <!-- LogIn Modal -->
+      <form action="shopping/shopping.html" method="post">
+        <div class="modal fade" id="logInModal" tabindex="-1" aria-labelledby="logInLabel" aria-hidden="true">
+          <div class="modal-dialog modal-dialog-centered">
+
+              <div class="modal-content">
+
+                <div class="modal-header">
+                    <h5 class="modal-title" id="logInLabel">LogIn</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+
+                <div class="modal-body">
+                    <div class="row">
+                        <div class="col-sm-12">
+                            <h3>Please enter your credentials</h3>
+                        </div>
+                    </div>
+                    <div class="row">
+                        <div class="col-sm-12">
+                            <div class="modalFormWrapper">
+                                <div class="mb-3">
+                                    <label for="forUsername" class="form-label">Your Username</label>
+                                    <input type="text" class="form-control" id="formUsername" placeholder="Username">
+                                </div>
+                                <div class="mb-3">
+                                    <label for="forPassword" class="form-label">Your Password</label>
+                                    <input type="password" class="form-control" id="formPassword" placeholder="Password">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="modal-footer">
+                  Does't have an account? <a href="#">Register now!</a>
+                  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                  <button type="submit" class="btn btn-primary">Log In</button>
+                </div>
+
+              </div>
+          </div>
+        </div>
+    
+      </form>
+    </div>    
+
+    
+
+    <div class="my-floating-btn" id="index-my-floating-btn">
+      <a href="#">
+        <button type="button" class="btn btn-lg my-btn btn-floating">
+          Back to Top
+        </button>
+      </a>
+    </div>
+      
+
+    <!-- Optional JavaScript; choose one of the two! -->
+
+    <!-- Option 1: Bootstrap Bundle with Popper -->
+<!--    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>-->
+
+    <!-- Option 2: Separate Popper and Bootstrap JS -->
+    
+    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
+    <script src="bootstrap-5.0.1-dist/js/bootstrap.min.js"></script>
+    <script type="text/javascript" src="style/style.js"></script>
+  </body>
+</html>

js/html5shiv.js

@@ -0,0 +1,8 @@
+/*
+ HTML5 Shiv v3.7.0 | @afarkas @jdalton @jon_neal @rem | MIT/GPL2 Licensed
+*/
+(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
+a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}</style>";
+c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
+"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);
+if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);

js/respond.min.js

@@ -0,0 +1,5 @@
+/*! Respond.js v1.4.2: min/max-width media query polyfill * Copyright 2013 Scott Jehl
+ * Licensed under https://github.com/scottjehl/Respond/blob/master/LICENSE-MIT
+ *  */
+
+!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='&shy;<style media="'+a+'"> #mq-test-1 { width: 42px; }</style>',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(a.document)}(this),function(a){"use strict";function b(){u(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))};if(c.ajax=f,c.queue=d,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\([\s]*min\-width\s*:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/,maxw:/\([\s]*max\-width\s*:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var g,h,i,j=a.document,k=j.documentElement,l=[],m=[],n=[],o={},p=30,q=j.getElementsByTagName("head")[0]||k,r=j.getElementsByTagName("base")[0],s=q.getElementsByTagName("link"),t=function(){var a,b=j.createElement("div"),c=j.body,d=k.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=j.createElement("body"),c.style.background="none"),k.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&k.insertBefore(c,k.firstChild),a=b.offsetWidth,f?k.removeChild(c):c.removeChild(b),k.style.fontSize=d,e&&(c.style.fontSize=e),a=i=parseFloat(a)},u=function(b){var c="clientWidth",d=k[c],e="CSS1Compat"===j.compatMode&&d||j.body[c]||d,f={},o=s[s.length-1],r=(new Date).getTime();if(b&&g&&p>r-g)return a.clearTimeout(h),h=a.setTimeout(u,p),void 0;g=r;for(var v in l)if(l.hasOwnProperty(v)){var w=l[v],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?i||t():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?i||t():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(m[w.rules]))}for(var C in n)n.hasOwnProperty(C)&&n[C]&&n[C].parentNode===q&&q.removeChild(n[C]);n.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=j.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,q.insertBefore(E,o.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(j.createTextNode(F)),n.push(E)}},v=function(a,b,d){var e=a.replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var g=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},h=!f&&d;b.length&&(b+="/"),h&&(f=1);for(var i=0;f>i;i++){var j,k,n,o;h?(j=d,m.push(g(a))):(j=e[i].match(c.regex.findStyles)&&RegExp.$1,m.push(RegExp.$2&&g(RegExp.$2))),n=j.split(","),o=n.length;for(var p=0;o>p;p++)k=n[p],l.push({media:k.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:m.length-1,hasquery:k.indexOf("(")>-1,minw:k.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:k.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}u()},w=function(){if(d.length){var b=d.shift();f(b.href,function(c){v(c,b.href,b.media),o[b.href]=!0,a.setTimeout(function(){w()},0)})}},x=function(){for(var b=0;b<s.length;b++){var c=s[b],e=c.href,f=c.media,g=c.rel&&"stylesheet"===c.rel.toLowerCase();e&&g&&!o[e]&&(c.styleSheet&&c.styleSheet.rawCssText?(v(c.styleSheet.rawCssText,e,f),o[e]=!0):(!/^([a-zA-Z:]*\/\/)/.test(e)&&!r||e.replace(RegExp.$1,"").split("/")[0]===a.location.host)&&("//"===e.substring(0,2)&&(e=a.location.protocol+e),d.push({href:e,media:f})))}w()};x(),c.update=x,c.getEmValue=t,a.addEventListener?a.addEventListener("resize",b,!1):a.attachEvent&&a.attachEvent("onresize",b)}}(this);

shopping/shopping.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html class="no-js" lang="zxx">
+<?php
+require_once 'connection.php';
+$conn = connectMysql();
+session_start();
+?>
+
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+
+    <title>New Moon Dessert Bar</title>
+
+        <!-- Bootstrap CSS -->
+    <link href="css/bootstrap-grid.min.css" rel="stylesheet">
+    <link href="css/bootstrap.min.css" rel="styleshee t">
+        <!--=== Main Style CSS ===-->
+    <link href="style.css" rel="stylesheet">
+    <!-- Font Awesome styles CDN Link -->
+    <link
+      href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
+      rel="stylesheet"
+      integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
+      crossorigin="anonymous"
+    />
+</head>
+
+<body class="shopping_body">
+
+    <?php include 'header_logout.php' ?>
+
+    <div id="wrapper">
+
+        <section class="menu_gallery">
+            
+             <h2>| · Click on the picture to add to the cart · |</h2>
+             <?php 
+             $products = getAllProducts($conn); 
+                  foreach ($products as $product): ?>
+                    <a class="imgDiv" href="addToCart.php?<?=$product['Product_ID']?>">
+                        <img class="imgItem" src="img/<?= $product['Product_Name']; ?>.jpg" alt="<?=$product['Product_Name']?>">
+                        <p><?= $product['Product_Name']; ?></p>
+                        <p class="price">&dollar;<?= $product['Product_Price']; ?></p>
+                    </a>
+                  <?php endforeach; 
+            ?> 
+           </section>
+        
+    </div>
+<?php include 'footer.php' ?>
+
+
+
+</body>
+
+</html>

style/_variables.sass

@@ -0,0 +1,15 @@
+$font-mukta-malar: "Mukta Malar"
+$font-ink-free: "Ink Free"
+$font-slabo: "Slabo"
+    
+$navbar-text-color: OliveDrab
+$navbar-text-color-hover: white
+$navbar-text-color-active: Beige
+
+$button-background-color: rgba(255,255,255,0.3)
+$button-color: black
+$button-border-color: rgba(255,255,255,0.3)
+$button-background-color-hover: OliveDrab
+$button-color-hover: white
+
+$index-background-color: #edeae8

style/base/_base-dir.sass

@@ -0,0 +1,2 @@
+@import "base"
+@import "index"

style/base/_base.sass

@@ -0,0 +1,22 @@
+html
+    font-family: $font-mukta-malar
+    height: 100%
+body
+    margin: 0
+    padding: 0
+    height: 100%
+
+div.container
+    text-align: center
+
+
+video
+    position: absolute
+    top: 0
+    left: 0
+    min-width: 100%
+    min-height: 100%
+    width: auto
+    height: 100%
+    z-index: -100
+    object-fit: cover

style/base/_index.sass

@@ -0,0 +1,6 @@
+.index-page
+    background-color: $index-background-color
+
+.container-fluid
+    height: 100%
+    padding: 0

style/layouts/_layouts-dir.sass

@@ -0,0 +1,2 @@
+@import "header"
+@import "footer"

style/modules/_button.sass

@@ -0,0 +1,29 @@
+.my-btn
+    background-color: $button-background-color
+    color: $button-color
+    border-color: $button-border-color
+    padding: 1em
+    border-radius: 30px
+    box-shadow: 0 3px 0px rgba(0,0,0,0.3), 1px 1px 1px rgba(0,0,0,0.1) inset
+    font-size: 1.2rem
+    margin: 20px
+
+.my-btn:hover
+    background-color: $button-background-color-hover
+    color: $button-color-hover
+
+.my-floating-btn
+    display: none
+    a
+        color: $button-color
+        text-decoration: none
+    button
+        float: right
+        border-radius: 50%
+        margin-right: 20px
+    top: 90%
+    width: 100%
+    position: fixed
+
+.my-floating-btn.active
+    display: block

style/modules/_modal.sass

@@ -0,0 +1,10 @@
+#logInModal
+    .modal-body
+        h3
+            color: OliveDrab
+            text-align: center
+    .modal-footer
+        a
+            text-decoration: none
+            margin-left: 5px
+            margin-right: 10px

style/modules/_modules-dir.sass

@@ -0,0 +1,8 @@
+@import "button"
+@import "modal"
+@import "video"
+@import "navbar"
+@import "sectionMain"
+@import "sectionMenu"
+@import "sectionSource"
+@import "sectionDocumentation"

style/modules/_navbar.sass

@@ -0,0 +1,31 @@
+.navbar
+    background-color: rgba(255,255,255,0)
+    .dropdownicon
+        color: $navbar-text-color
+    a 
+        font-size: 1.7rem
+        border: 1px
+        color: $navbar-text-color
+        text-align: left
+        text-shadow: 1px 1.2px 2px GhostWhite
+        // margin: auto
+        // padding: 8px
+        // float: left
+    a:hover
+        color: $navbar-text-color-hover
+    a:active
+        color: $navbar-text-color-active
+
+.navbar-container
+    margin-top: 70px;
+    border-bottom: 1px solid grey
+    width: 658px
+// .navbar-row
+//     position: fixed
+//     width: 100%
+//     top: 0
+//     left: 0
+
+@media (max-width: 768px)
+    .navbar-container
+        width: 100%  

style/modules/_sectionDocumentation.sass

@@ -0,0 +1,8 @@
+.sectionDocumentation
+    margin-top: 10%
+    text-align: center
+    h2
+        margin-top: 5%
+    img
+        margin: auto
+        padding: 10px

style/modules/_sectionMain.sass

@@ -0,0 +1,16 @@
+.sectionMain
+    text-align: center
+    margin-top: 20%
+    h1
+        font-family: $font-ink-free
+        font-size: 4rem
+    h2
+        font-family: $font-slabo
+        font-size: 1rem
+    h3
+        color: OliveDrab
+        font-size: 1.2rem
+    position: relative
+#btn-home-login:before
+    font-family: 'FontAwesome'
+    content: '\f2be'

style/modules/_sectionMenu.sass

@@ -0,0 +1,18 @@
+.sectionMenu
+    margin-top: 12%
+    .row
+        padding-left: 20%
+        padding-right: 20%
+    .my-img-class
+        margin: 5%
+        padding: 1%
+        border: 1px solid grey
+    img
+        width: 100%
+    h1
+        margin-top: 5%
+        text-align: center
+        color: OliveDrab
+    h3
+        text-align: center
+        color: OliveDrab

style/modules/_sectionSource.sass

@@ -0,0 +1,4 @@
+.sectionSource
+    text-align: center
+    h2
+        margin-top: 10%

style/modules/_video.sass

@@ -0,0 +1,3 @@
+.video-container-bg
+    position: relative
+    height: 100%

style/style.css

@@ -0,0 +1,207 @@
+@import url("https://fonts.googleapis.com/css?family=Bungee|Mukta+Malar:300,400,600|Slabo+27px");
+html {
+  font-family: "Mukta Malar";
+  height: 100%;
+}
+
+body {
+  margin: 0;
+  padding: 0;
+  height: 100%;
+}
+
+div.container {
+  text-align: center;
+}
+
+video {
+  position: absolute;
+  top: 0;
+  left: 0;
+  min-width: 100%;
+  min-height: 100%;
+  width: auto;
+  height: 100%;
+  z-index: -100;
+  -o-object-fit: cover;
+     object-fit: cover;
+}
+
+.index-page {
+  background-color: #edeae8;
+}
+
+.container-fluid {
+  height: 100%;
+  padding: 0;
+}
+
+.my-btn {
+  background-color: rgba(255, 255, 255, 0.3);
+  color: black;
+  border-color: rgba(255, 255, 255, 0.3);
+  padding: 1em;
+  border-radius: 30px;
+  -webkit-box-shadow: 0 3px 0px rgba(0, 0, 0, 0.3), 1px 1px 1px rgba(0, 0, 0, 0.1) inset;
+          box-shadow: 0 3px 0px rgba(0, 0, 0, 0.3), 1px 1px 1px rgba(0, 0, 0, 0.1) inset;
+  font-size: 1.2rem;
+  margin: 20px;
+}
+
+.my-btn:hover {
+  background-color: OliveDrab;
+  color: white;
+}
+
+.my-floating-btn {
+  display: none;
+  top: 90%;
+  width: 100%;
+  position: fixed;
+}
+
+.my-floating-btn a {
+  color: black;
+  text-decoration: none;
+}
+
+.my-floating-btn button {
+  float: right;
+  border-radius: 50%;
+  margin-right: 20px;
+}
+
+.my-floating-btn.active {
+  display: block;
+}
+
+#logInModal .modal-body h3 {
+  color: OliveDrab;
+  text-align: center;
+}
+
+#logInModal .modal-footer a {
+  text-decoration: none;
+  margin-left: 5px;
+  margin-right: 10px;
+}
+
+.video-container-bg {
+  position: relative;
+  height: 100%;
+}
+
+.navbar {
+  background-color: rgba(255, 255, 255, 0);
+}
+
+.navbar .dropdownicon {
+  color: OliveDrab;
+}
+
+.navbar a {
+  font-size: 1.7rem;
+  border: 1px;
+  color: OliveDrab;
+  text-align: left;
+  text-shadow: 1px 1.2px 2px GhostWhite;
+}
+
+.navbar a:hover {
+  color: white;
+}
+
+.navbar a:active {
+  color: Beige;
+}
+
+.navbar-container {
+  margin-top: 70px;
+  border-bottom: 1px solid grey;
+  width: 658px;
+}
+
+@media (max-width: 768px) {
+  .navbar-container {
+    width: 100%;
+  }
+}
+
+.sectionMain {
+  text-align: center;
+  margin-top: 20%;
+  position: relative;
+}
+
+.sectionMain h1 {
+  font-family: "Ink Free";
+  font-size: 4rem;
+}
+
+.sectionMain h2 {
+  font-family: "Slabo";
+  font-size: 1rem;
+}
+
+.sectionMain h3 {
+  color: OliveDrab;
+  font-size: 1.2rem;
+}
+
+#btn-home-login:before {
+  font-family: 'FontAwesome';
+  content: '\f2be';
+}
+
+.sectionMenu {
+  margin-top: 12%;
+}
+
+.sectionMenu .row {
+  padding-left: 20%;
+  padding-right: 20%;
+}
+
+.sectionMenu .my-img-class {
+  margin: 5%;
+  padding: 1%;
+  border: 1px solid grey;
+}
+
+.sectionMenu img {
+  width: 100%;
+}
+
+.sectionMenu h1 {
+  margin-top: 5%;
+  text-align: center;
+  color: OliveDrab;
+}
+
+.sectionMenu h3 {
+  text-align: center;
+  color: OliveDrab;
+}
+
+.sectionSource {
+  text-align: center;
+}
+
+.sectionSource h2 {
+  margin-top: 10%;
+}
+
+.sectionDocumentation {
+  margin-top: 10%;
+  text-align: center;
+}
+
+.sectionDocumentation h2 {
+  margin-top: 5%;
+}
+
+.sectionDocumentation img {
+  margin: auto;
+  padding: 10px;
+}
+/*# sourceMappingURL=style.css.map */

style/style.css.map

@@ -0,0 +1,25 @@
+{
+    "version": 3,
+    "mappings": "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",
+    "sources": [
+        "style.sass",
+        "_variables.sass",
+        "base/_base-dir.sass",
+        "base/_base.sass",
+        "base/_index.sass",
+        "layouts/_layouts-dir.sass",
+        "layouts/_header.sass",
+        "layouts/_footer.sass",
+        "modules/_modules-dir.sass",
+        "modules/_button.sass",
+        "modules/_modal.sass",
+        "modules/_video.sass",
+        "modules/_navbar.sass",
+        "modules/_sectionMain.sass",
+        "modules/_sectionMenu.sass",
+        "modules/_sectionSource.sass",
+        "modules/_sectionDocumentation.sass"
+    ],
+    "names": [],
+    "file": "style.css"
+}