Improving about modal and colon issue with webhooks (#3343)

Updating word break

Updating improvements for about modal

webapp/sass/components/_modal.scss

@@ -89,9 +89,15 @@
         }
 
         .info__label {
+            @include opacity(.5);
+            font-size: .9em;
             font-weight: 600;
-            padding-right: 0;
-            text-align: right;
+            margin-bottom: 3px;
+        }
+
+        .info__value {
+            padding-left: 10px;
+            word-break: break-word;
         }
 
         .team-member-list {

webapp/sass/layout/_post.scss

@@ -768,7 +768,7 @@ body.ios {
                 white-space: nowrap;
             }
 
-            strong {
+            .colon {
                 display: none;
                 font-weight: 900;
                 margin-left: 2px;
@@ -1118,7 +1118,7 @@ body.ios {
     font-family: inherit;
     font-size: 11px;
     font-weight: 600;
-    margin: 0 0 0 -4px;
+    margin: 0 10px 0 -4px;
     padding: 2px 4px;
 }
 

webapp/sass/responsive/_tablet.scss

@@ -122,7 +122,7 @@
                         z-index: 1;
                     }
 
-                    strong {
+                    .colon {
                         display: inline;
                     }
 

webapp/sass/routes/_about-modal.scss

@@ -20,12 +20,22 @@
                     color: inherit;
                     font-size: 16px;
                 }
+
+                .fa {
+                    margin: 0 4px 0 8px;
+                }
             }
 
             .modal-body {
                 padding: 20px 25px 5px;
             }
 
+            &.large {
+                .modal-body {
+                    padding-bottom: 20px;
+                }
+            }
+
             .about-modal__content {
                 @include clearfix;
                 @include display-flex;