Merge branch 'feature/fix-from-rework-css' of git.startinblox.com:applications/hubl into release/0.10

src/styles/base/form.scss

@@ -18,8 +18,23 @@
   .reversed,
   .button-secondary,
   .bordered;
-  margin-left: auto;
-  margin-top: 3.2rem;
+  height: auto;
+  position: fixed;
+  bottom: 1em;
+  left: 10%;
+  white-space: normal;
+  width: 80%;
+  z-index: 1;
+  
+  @include breakpoint(lg) {
+    height: 3rem;
+    left: 0;
+    margin: 0;
+    margin-left: auto;
+    margin-top: 109px;
+    position: relative;
+    width: auto;
+  }
 }
 
 .form-label {
@@ -78,6 +93,7 @@
 
 textarea {
   height: 100px;
+  resize: vertical;
 }
     
 .content-box {
@@ -224,30 +240,49 @@ sib-form-date {
 }
 
 sib-form-file {
-
-  label {
-    align-items: baseline;
-    clear: both;
+  
+  div {
     display: flex;
-    flex-direction: row;
-    flex-wrap: wrap;
-    max-width: 100%;
-
-    div {
-      width: 100%;
+    flex-direction: column-reverse;
+    align-items: center;
+    margin-top: 1.8rem;
+    
+    @include breakpoint(lg) {
+      flex-direction: row-reverse;
+      justify-content: flex-end;
     }
-
-    input[type='text'] {
-      box-sizing: border-box;
-      flex: 0 0 50%;
-    }
-
+  
     input[type='file'] {
-      box-sizing: border-box;
-      flex: 0 0 20%;
-      color: var(--color-input-text);
-      cursor: pointer;
-      padding-left: 3rem;
+      height: 0.1px;
+      opacity: 0;
+      overflow: hidden;
+      position: absolute;
+      width: 0.1px;
+      z-index: -1;
+    }
+      
+    input[type='text'] {
+      margin-bottom: 0.8rem;
+      width: 100%;
+
+      @include breakpoint(lg) {
+        width: auto;
+      }
+    }
+
+    label {
+      @extend .button,
+      .text-bold,
+      .text-uppercase,
+      .button-primary,
+      .bordered;
+      text-align: center;
+      width: 100%;
+      
+      @include breakpoint(lg) {
+        margin: auto 2.2rem;
+        width: auto;
+      }
     }
   }
 }

src/styles/base/table.scss

@@ -4,6 +4,11 @@
   overflow: auto;
   position: relative;
   width: 100%;
+  margin-bottom: 6rem;
+
+  @include breakpoint(lg) {
+    margin-bottom: 0;
+  }
 
   .table {
     border-collapse: collapse;
@@ -71,7 +76,6 @@
 /* Styles of the table and its elements */
 
 .table {
-  border-bottom: 1px solid var(--color-table-border);
   border-left: 1px solid var(--color-table-border);
   border-right: 1px solid var(--color-table-border);
 }
@@ -113,20 +117,16 @@
     width: 280px;
   }
 
+  .w230 {
+    width: 230px;
+  }
+
   .w70 {
     width: 70px;
   }
 
-  .w262 {
-    width: 262px;
-  }
-
-  .W152 {
-    width: 152px;
-  }
-
-  .w355 {
-    width: 355px;
+  .w162 {
+    width: 162px;
   }
 
   .hashtag::before {
@@ -209,8 +209,9 @@
 
 .circle-leave {
   position: relative;
-  width: 40%;
-  min-width: 40%;
+  width: 164px;
+  margin: 0 auto;
+  min-width: 164px;
 
   &>button {
     height: 29px;