feat: discussions

community/public/css/style.css

@@ -22,6 +22,14 @@
   --control-bg: var(--gray-100);
   --muted-text: #4C5A67;
   --button-background: #EEF0F2;
+  --text-xs: 11px;
+  --text-sm: 12px;
+  --text-md: 13px;
+  --text-base: 14px;
+  --text-lg: 16px;
+  --text-xl: 18px;
+  --text-2xl: 20px;
+  --text-3xl: 22px;
 }
 
 body {
@@ -76,82 +84,10 @@ img.profile-photo {
   padding-right: 5px;
 }
 
-.message {
-  border: 1px dashed var(--text-color);
-  padding: 20px;
-  border-radius: 10px;
-}
-
-.msger-inputarea {
-  width: 100%;
-  display: flex;
-  padding: 10px;
-  border-top: 2px solid #ddd;
-  background: #eee;
-  z-index: 1;
-}
-
-.msger-inputarea * {
-  padding: 10px;
-  border: none;
-  border-radius: 3px;
-  font-size: 1em;
-}
-
-.msger-input {
-  flex: 1;
-  background: #ddd;
-}
-
-.message-section {
-  margin-left: 3%;
-  display: inline-block;
-  width: 95%;
-}
-
-.display-4 {
-  color: #2D005A;
-  font-weight: 600;
-  line-height: 51px;
-}
-
 section {
   padding: 5rem 0 5rem 0;
 }
 
-.messages-container {
-  margin: 0 auto;
-  border: 1px solid black;
-}
-
-.messages {
-  height: 450px;
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  padding: 8px;
-  list-style-type: none;
-}
-
-.messages li {
-  background: #F7F5F5;
-  border-radius: 8px;
-  padding: 8px;
-  margin: 2px 8px 2px 0;
-  width: 40%;
-}
-
-.messages li.ours {
-  align-self: flex-end;
-  margin: 2px 0 2px 8px;
-  background: var(--primary-color);
-  color: #fff
-}
-
-.message-para {
-  font-size: 20px;
-}
-
 .batch-header {
   background: #eee;
   border: 2px solid #ddd;
@@ -191,33 +127,6 @@ input[type=checkbox] {
   appearance: auto;
 }
 
-.partiallycomplete {
-  background: #FEF4E2;
-  color: #976417;
-}
-
-.partiallycomplete img {
-  background: #976417;
-}
-
-.complete {
-  background: #EAF5EE;
-  color: #38A160;
-}
-
-.complete img {
-  background: #38A160;
-}
-
-.incomplete {
-  background: #FEECEC;
-  color: #E24C4C;
-}
-
-.incomplete img {
-  background: #E24C4C;
-}
-
 .progress-image {
   margin-right: 3px;
   border-radius: 50px;
@@ -276,6 +185,7 @@ input[type=checkbox] {
 .common-page-style {
   background: #F4F5F6;
   padding-bottom: 2rem;
+  min-height: 60vh;
 }
 
 .common-card-style {
@@ -696,10 +606,11 @@ input[type=checkbox] {
 
 .chapter-title {
   font-weight: bold;
-  margin: 0 .25rem .5rem;
+  margin: 0 .25rem 0;
   cursor: pointer;
   display: flex;
   align-items: center;
+  padding-bottom: 0.5rem;
 }
 
 .chapter-description {
@@ -1351,3 +1262,36 @@ pre {
 .markdown-source h4 {
   font-size: 1rem;
 }
+
+.thread-card {
+  flex-direction: column;
+  padding: 1.5rem;
+}
+
+textarea.form-control {
+  height: 300px;
+}
+
+.discussion-on-page textarea.form-control {
+  background-color: #FFFFFF;
+  color: inherit;
+  height: 160px;
+}
+
+.comment-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.comment-field {
+  font-size: inherit;
+}
+
+.thread-title {
+  font-size: inherit;
+}
+
+.message-author {
+  color: #192734;
+  margin-left: 0.5rem;
+}

community/public/icons/message.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.00001 3.00001H12L15.5 3C16.6046 3 17.5 3.89543 17.5 5V9.78889V12.2556C17.5 13.3601 16.6046 14.2556 15.5 14.2556H14.5C14.2239 14.2556 14 14.4794 14 14.7556V16.4507C14 16.8715 13.5119 17.1041 13.185 16.839L10.2754 14.4789C10.0972 14.3344 9.87483 14.2556 9.64544 14.2556H4.49997C3.39539 14.2556 2.49995 13.3601 2.49997 12.2555L2.50001 9.78889V5.00001C2.50001 3.89544 3.39544 3.00001 4.50001 3.00001L6.00001 3.00001Z" stroke="#1F272E" stroke-miterlimit="10" stroke-linecap="square"/>
+<path d="M6 6.5H13" stroke="#1F272E" stroke-miterlimit="10" stroke-linecap="round"/>
+<path d="M6 9H10" stroke="#1F272E" stroke-miterlimit="10" stroke-linecap="round"/>
+</svg>

community/public/icons/small-add.svg

@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 4V12" stroke="white" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4 8H12" stroke="white" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>