bugfix: left-menu responsive + button responsive

src/styles/base/main.scss

@@ -35,14 +35,6 @@ sib-dashboard section {
   }
 }
 
-/*@media (max-width: 767.98px) {
-  
-  #conversejs .converse-chatboxes .chatbox .box-flyout {
-    height: 100% !important;
-    height: 100vh !important;
-  }
-}*/
-
 .wrapper {
   display: grid;
   grid-template-areas: 
@@ -84,7 +76,7 @@ sib-dashboard section {
     display: block;
     bottom: 0;
     box-shadow: 0 2px 8px 0 rgba(65, 69, 73, 0.5);
-    max-width: 86%;
+    width: 80vw;
     position: fixed;
     right: 0;
     top: 0;
@@ -380,7 +372,11 @@ h5 {
 
 .content-box__info {
   flex-direction: column;
-  padding: 3.2rem;
+  padding: 1rem;
+
+  @include breakpoint(lg) {
+    padding: 3.2rem;
+  }
 
   * {
     box-sizing: border-box;
@@ -471,8 +467,13 @@ h5 {
   display: flex;
 }
 
-.button-end {
-  justify-content: flex-end;
+.desktop-button__end {
+  display: block;
+
+  @include breakpoint(lg) {
+    display: flex;
+    justify-content: flex-end;
+  }
 }
 
 .space-between {
@@ -538,8 +539,33 @@ a,
       font-size: 1.4rem;
     }
 
-    &.btn-margin-left {
-      margin-left: 2.2rem;
+    &.mobile-full-width {
+      margin-bottom: 1rem;
+      padding-left: 5rem;
+      width: -webkit-fill-available;
+      width: -moz-available;
+
+      @include breakpoint(lg) {
+        margin-bottom: 0;
+        padding-left: 2.5rem;
+        width: auto;
+      }
+
+      &::before {
+        margin-left: -2.6rem;
+
+        @include breakpoint(lg) {
+          margin-left: 0;
+        }
+      }
+    }
+
+    &.desktop-btn-margin__left {
+      margin: 0;
+
+      @include breakpoint(lg) {
+        margin-left: 2.2rem;
+      }
     }
 
     &.small {

src/styles/base/menu-left.scss

@@ -103,7 +103,7 @@
           .project-name {
             box-sizing: border-box;
             display: block;
-            width: calc(80vw - 76px); /*76px = padding of the element + width and margin of counter */
+            width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
 
             @include breakpoint(lg) {
               width: 150px;
@@ -133,7 +133,7 @@
           >div[name='name'] {
             box-sizing: border-box;
             padding-left: 0.2em;
-            width: calc(80vw - 76px);  /*76px = padding of the element + width and margin of counter */
+            width: calc(80vw - 96px);  /*96px = padding of the element + width and margin of counter */
 
             @include breakpoint(lg) {
               overflow: hidden;
@@ -149,7 +149,7 @@
 
       .message-tab>div>sib-display>div>sib-display-div>div {
         box-sizing: border-box;
-        width: calc(80vw - 76px); /*76px = padding of the element + width and margin of counter */
+        width: calc(80vw - 96px); /*96px = padding of the element + width and margin of counter */
         
         @include breakpoint(lg) {
           width: 150px;
@@ -158,8 +158,8 @@
 
       sib-display.nosub>sib-form[fields="name"]>hubl-search-users>input {
         margin-left: 30px;
-        max-width: 82%;
-        width: 82%;
+        margin-bottom: 10px;
+        width: calc(80vw - 71px);
         display: block;
         background-color: var(--color-secondary);
         color: var(--color-grey-6);

src/styles/base/table.scss

@@ -145,7 +145,7 @@
       .reversed,
       .button-secondary,
       .bordered,
-      .btn-margin-left;
+      .desktop-btn-margin__left;
     }
   }
 }

src/styles/components/tags.scss

@@ -1,9 +1,13 @@
 %tag-admin {
-  border: 1px solid var(--color-tag-admin-border);
-  border-radius: 3px;
-  color: var(--color-tag-admin-text);
-  font-size: 1.4rem;
-  font-weight: 400;
-  margin-left: 0.6rem;
-  padding: 0.35rem 0.98rem;
+  display: none;
+
+  @include breakpoint(lg) {
+    border: 1px solid var(--color-tag-admin-border);
+    border-radius: 3px;
+    color: var(--color-tag-admin-text);
+    font-size: 1.4rem;
+    font-weight: 400;
+    margin-left: 0.6rem;
+    padding: 0.35rem 0.98rem;
+  }
 }