From 32b82177731a8e2b3f8570fb825e08f3d6039de8 Mon Sep 17 00:00:00 2001
From: ROXBOZ <hello@roxanne-borloz.net>
Date: Mon, 10 Jul 2023 13:18:55 +0200
Subject: [PATCH] fixed much shit

---
 .../ConversationBuble.tsx                     | 29 ++----------
 apps/codac-quasseln/styles/_bootstrap.scss    | 42 +++++++++++++++++
 apps/codac-quasseln/styles/_chatrooms.scss    |  8 ++--
 apps/codac-quasseln/styles/globals.css        | 47 +++++++++++++++++--
 apps/codac-quasseln/styles/globals.css.map    |  2 +-
 apps/codac-quasseln/styles/globals.scss       |  1 +
 .../codac-sassy/src/stories/bubble/bubble.css | 47 +++++++++++++++++--
 .../src/stories/bubble/bubble.css.map         |  2 +-
 .../codac-sassy/src/stories/button/button.css | 47 +++++++++++++++++--
 .../src/stories/button/button.css.map         |  2 +-
 10 files changed, 178 insertions(+), 49 deletions(-)
 create mode 100644 apps/codac-quasseln/styles/_bootstrap.scss

diff --git a/apps/codac-quasseln/src/components/Main-Chat-Components/ConversationBuble.tsx b/apps/codac-quasseln/src/components/Main-Chat-Components/ConversationBuble.tsx
index fac407a7..028f7a6b 100644
--- a/apps/codac-quasseln/src/components/Main-Chat-Components/ConversationBuble.tsx
+++ b/apps/codac-quasseln/src/components/Main-Chat-Components/ConversationBuble.tsx
@@ -182,35 +182,11 @@ const ConversationBuble = ({ conversation, setActive }: Props) => {
               : `${kurzeTitle}...`}
           </p>
         </div>
+
         {user?.role?.name === "Mentor" ? (
-          <div className="tooltip">
-            <svg
-              className="pin-icon"
-              onClick={(e: any) => {
-                updatePinned(e, conversation);
-                console.log("click :");
-              }}
-              xmlns="http://www.w3.org/2000/svg"
-              version="1.1"
-              x="0px"
-              y="0px"
-              viewBox="0 0 64 80"
-              enable-background="new 0 0 64 64"
-              height="1.2em"
-              // style={{ border: "2px solid violet" }}
-            >
-              <g>
-                <path
-                  fill="#000000"
-                  d="M62.2,19.3L44.7,1.8c-1.4-1.4-3.6-1.4-4.9,0l-5.6,5.6c-0.7,0.7-1,1.5-1,2.5c0,0.8,0.3,1.7,0.9,2.3l-5.7,5.7   c-1.5-0.3-3.1-0.5-4.7-0.5c-6.2,0-11.9,2.4-16.3,6.8C6,25.4,6,27.6,7.3,29l11.4,11.4L1.8,57.3c-1.4,1.4-1.4,3.6,0,4.9   c0.7,0.7,1.6,1,2.5,1s1.8-0.3,2.5-1l16.9-16.9L35,56.7c0.7,0.7,1.6,1,2.5,1c0.9,0,1.8-0.3,2.5-1c5.5-5.5,7.8-13.4,6.3-21l5.7-5.7   c1.4,1.2,3.5,1.1,4.8-0.2l5.6-5.6c0.7-0.7,1-1.5,1-2.5C63.3,20.9,62.9,20,62.2,19.3z"
-                />
-              </g>
-            </svg>
-            <span className="tooltiptext">Unpin conversation</span>
-          </div>
+          ""
         ) : (
           <svg
-            style={{ border: "5px solid orange" }}
             className="pin-icon"
             xmlns="http://www.w3.org/2000/svg"
             height="1em"
@@ -295,6 +271,7 @@ const ConversationBuble = ({ conversation, setActive }: Props) => {
                   ></input>
                   <div className="flex-start" style={{ margin: "1rem 0" }}>
                     <input
+                      className="form-check-input"
                       type="checkbox"
                       checked={isChecked === true ? true : false}
                       onChange={checkBox}
diff --git a/apps/codac-quasseln/styles/_bootstrap.scss b/apps/codac-quasseln/styles/_bootstrap.scss
new file mode 100644
index 00000000..ba66f74b
--- /dev/null
+++ b/apps/codac-quasseln/styles/_bootstrap.scss
@@ -0,0 +1,42 @@
+.form-check-input {
+  margin-right: 0.5em;
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: top;
+  background-position: center;
+  border: 2px solid lighten($codac-primary-color, 20%);
+  appearance: none;
+  border-radius: 0.25em;
+  background-color: white;
+
+  &:active {
+    filter: brightness(90%);
+  }
+
+  &:checked {
+    background-color: $codac-primary-color;
+  }
+}
+.form-check-input[type="checkbox"] {
+  border: $border-solid $codac-primary-color;
+
+  &:disabled {
+    opacity: 30%;
+  }
+
+  &:checked {
+    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
+  }
+
+  &:hover {
+    background-color: lighten($codac-primary-color, 10%);
+  }
+}
+.form-check-input[type="radio"] {
+  border-radius: 50%;
+  background-color: $codac-primary-color;
+
+  &:checked {
+    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
+  }
+}
diff --git a/apps/codac-quasseln/styles/_chatrooms.scss b/apps/codac-quasseln/styles/_chatrooms.scss
index ee8f66c3..2e951cc5 100644
--- a/apps/codac-quasseln/styles/_chatrooms.scss
+++ b/apps/codac-quasseln/styles/_chatrooms.scss
@@ -7,7 +7,7 @@
   align-items: center;
   width: fit-content;
   color: white;
-  font-weight: 600;
+  // font-weight: 600;
   border-bottom: $border-solid white;
   .icon path {
     fill: white;
@@ -47,7 +47,6 @@ h1 {
   display: flex;
   flex-direction: column;
   gap: $reg-space;
-  border: 2px solid orange;
 }
 
 ///////////////
@@ -111,9 +110,7 @@ h1 {
       .conversation {
         color: darken($codac-primary-color, 20%);
         background-color: lighten($codac-primary-color, 60%);
-        .pin-icon {
-          transform: rotate(-45deg);
-        }
+
         &.is-inactive {
           background-color: darken($codac-primary-color, 5%);
           color: white;
@@ -446,5 +443,6 @@ h1 {
     border-radius: $border-radius;
     margin: $reg-space 0;
     width: 100%;
+    color: black;
   }
 }
diff --git a/apps/codac-quasseln/styles/globals.css b/apps/codac-quasseln/styles/globals.css
index 5fd4c9e3..3d8d8248 100644
--- a/apps/codac-quasseln/styles/globals.css
+++ b/apps/codac-quasseln/styles/globals.css
@@ -9,7 +9,6 @@
   width: -moz-fit-content;
   width: fit-content;
   color: white;
-  font-weight: 600;
   border-bottom: 1px solid white;
 }
 .go-to-chat .icon path {
@@ -49,7 +48,6 @@ h1 {
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  border: 2px solid orange;
 }
 
 .chat-container {
@@ -105,9 +103,6 @@ h1 {
   color: black;
   background-color: #9bfdf3;
 }
-.chat-container .chat-dashboard-container .pinned-conversations-container .conversation .pin-icon {
-  transform: rotate(-45deg);
-}
 .chat-container .chat-dashboard-container .pinned-conversations-container .conversation.is-inactive {
   background-color: #024b44;
   color: white;
@@ -404,4 +399,46 @@ h1 {
   border-radius: 0.25em;
   margin: 1rem 0;
   width: 100%;
+  color: black;
+}
+
+.form-check-input {
+  margin-right: 0.5em;
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: top;
+  background-position: center;
+  border: 2px solid #04c8b4;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border-radius: 0.25em;
+  background-color: white;
+}
+.form-check-input:active {
+  filter: brightness(90%);
+}
+.form-check-input:checked {
+  background-color: #02645a;
+}
+
+.form-check-input[type=checkbox] {
+  border: 1px solid #02645a;
+}
+.form-check-input[type=checkbox]:disabled {
+  opacity: 30%;
+}
+.form-check-input[type=checkbox]:checked {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
+}
+.form-check-input[type=checkbox]:hover {
+  background-color: #039687;
+}
+
+.form-check-input[type=radio] {
+  border-radius: 50%;
+  background-color: #02645a;
+}
+.form-check-input[type=radio]:checked {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
 }/*# sourceMappingURL=globals.css.map */
\ No newline at end of file
diff --git a/apps/codac-quasseln/styles/globals.css.map b/apps/codac-quasseln/styles/globals.css.map
index 4f515fd7..cb17efe6 100644
--- a/apps/codac-quasseln/styles/globals.css.map
+++ b/apps/codac-quasseln/styles/globals.css.map
@@ -1 +1 @@
-{"version":3,"sources":["_chatrooms.scss","_vars.scss","globals.css"],"names":[],"mappings":"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","file":"globals.css"}
\ No newline at end of file
+{"version":3,"sources":["_chatrooms.scss","_vars.scss","globals.css","_bootstrap.scss"],"names":[],"mappings":"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","file":"globals.css"}
\ No newline at end of file
diff --git a/apps/codac-quasseln/styles/globals.scss b/apps/codac-quasseln/styles/globals.scss
index 0e27dbae..bb6043dd 100644
--- a/apps/codac-quasseln/styles/globals.scss
+++ b/apps/codac-quasseln/styles/globals.scss
@@ -1,2 +1,3 @@
 @import "vars";
 @import "chatrooms";
+@import "bootstrap";
diff --git a/packages/codac-sassy/src/stories/bubble/bubble.css b/packages/codac-sassy/src/stories/bubble/bubble.css
index f6f0b329..f89dc7e9 100644
--- a/packages/codac-sassy/src/stories/bubble/bubble.css
+++ b/packages/codac-sassy/src/stories/bubble/bubble.css
@@ -9,7 +9,6 @@
   width: -moz-fit-content;
   width: fit-content;
   color: white;
-  font-weight: 600;
   border-bottom: 1px solid white;
 }
 .go-to-chat .icon path {
@@ -49,7 +48,6 @@ h1 {
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  border: 2px solid orange;
 }
 
 .chat-container {
@@ -105,9 +103,6 @@ h1 {
   color: black;
   background-color: #9bfdf3;
 }
-.chat-container .chat-dashboard-container .pinned-conversations-container .conversation .pin-icon {
-  transform: rotate(-45deg);
-}
 .chat-container .chat-dashboard-container .pinned-conversations-container .conversation.is-inactive {
   background-color: #024b44;
   color: white;
@@ -404,6 +399,48 @@ h1 {
   border-radius: 0.25em;
   margin: 1rem 0;
   width: 100%;
+  color: black;
+}
+
+.form-check-input {
+  margin-right: 0.5em;
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: top;
+  background-position: center;
+  border: 2px solid #04c8b4;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border-radius: 0.25em;
+  background-color: white;
+}
+.form-check-input:active {
+  filter: brightness(90%);
+}
+.form-check-input:checked {
+  background-color: #02645a;
+}
+
+.form-check-input[type=checkbox] {
+  border: 1px solid #02645a;
+}
+.form-check-input[type=checkbox]:disabled {
+  opacity: 30%;
+}
+.form-check-input[type=checkbox]:checked {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
+}
+.form-check-input[type=checkbox]:hover {
+  background-color: #039687;
+}
+
+.form-check-input[type=radio] {
+  border-radius: 50%;
+  background-color: #02645a;
+}
+.form-check-input[type=radio]:checked {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
 }
 
 .bubble-container {
diff --git a/packages/codac-sassy/src/stories/bubble/bubble.css.map b/packages/codac-sassy/src/stories/bubble/bubble.css.map
index e0e35e17..51ad1e3b 100644
--- a/packages/codac-sassy/src/stories/bubble/bubble.css.map
+++ b/packages/codac-sassy/src/stories/bubble/bubble.css.map
@@ -1 +1 @@
-{"version":3,"sources":["../../../../../apps/codac-quasseln/styles/_chatrooms.scss","../../../../../apps/codac-quasseln/styles/_vars.scss","bubble.css","bubble.scss"],"names":[],"mappings":"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","file":"bubble.css"}
\ No newline at end of file
+{"version":3,"sources":["../../../../../apps/codac-quasseln/styles/_chatrooms.scss","../../../../../apps/codac-quasseln/styles/_vars.scss","bubble.css","../../../../../apps/codac-quasseln/styles/_bootstrap.scss","bubble.scss"],"names":[],"mappings":"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","file":"bubble.css"}
\ No newline at end of file
diff --git a/packages/codac-sassy/src/stories/button/button.css b/packages/codac-sassy/src/stories/button/button.css
index 231fa041..27e34cd0 100644
--- a/packages/codac-sassy/src/stories/button/button.css
+++ b/packages/codac-sassy/src/stories/button/button.css
@@ -9,7 +9,6 @@
   width: -moz-fit-content;
   width: fit-content;
   color: white;
-  font-weight: 600;
   border-bottom: 1px solid white;
 }
 .go-to-chat .icon path {
@@ -49,7 +48,6 @@ h1 {
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  border: 2px solid orange;
 }
 
 .chat-container {
@@ -105,9 +103,6 @@ h1 {
   color: black;
   background-color: #9bfdf3;
 }
-.chat-container .chat-dashboard-container .pinned-conversations-container .conversation .pin-icon {
-  transform: rotate(-45deg);
-}
 .chat-container .chat-dashboard-container .pinned-conversations-container .conversation.is-inactive {
   background-color: #024b44;
   color: white;
@@ -404,6 +399,48 @@ h1 {
   border-radius: 0.25em;
   margin: 1rem 0;
   width: 100%;
+  color: black;
+}
+
+.form-check-input {
+  margin-right: 0.5em;
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: top;
+  background-position: center;
+  border: 2px solid #04c8b4;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border-radius: 0.25em;
+  background-color: white;
+}
+.form-check-input:active {
+  filter: brightness(90%);
+}
+.form-check-input:checked {
+  background-color: #02645a;
+}
+
+.form-check-input[type=checkbox] {
+  border: 1px solid #02645a;
+}
+.form-check-input[type=checkbox]:disabled {
+  opacity: 30%;
+}
+.form-check-input[type=checkbox]:checked {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
+}
+.form-check-input[type=checkbox]:hover {
+  background-color: #039687;
+}
+
+.form-check-input[type=radio] {
+  border-radius: 50%;
+  background-color: #02645a;
+}
+.form-check-input[type=radio]:checked {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
 }
 
 .storybook-button {
diff --git a/packages/codac-sassy/src/stories/button/button.css.map b/packages/codac-sassy/src/stories/button/button.css.map
index ccf372d5..755199c1 100644
--- a/packages/codac-sassy/src/stories/button/button.css.map
+++ b/packages/codac-sassy/src/stories/button/button.css.map
@@ -1 +1 @@
-{"version":3,"sources":["../../../../../apps/codac-quasseln/styles/_chatrooms.scss","../../../../../apps/codac-quasseln/styles/_vars.scss","button.css","button.scss"],"names":[],"mappings":"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","file":"button.css"}
\ No newline at end of file
+{"version":3,"sources":["../../../../../apps/codac-quasseln/styles/_chatrooms.scss","../../../../../apps/codac-quasseln/styles/_vars.scss","button.css","../../../../../apps/codac-quasseln/styles/_bootstrap.scss","button.scss"],"names":[],"mappings":"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","file":"button.css"}
\ No newline at end of file