diff --git a/client/public/index.html b/client/public/index.html
index fc7327a7..8319461c 100755
--- a/client/public/index.html
+++ b/client/public/index.html
@@ -3,7 +3,7 @@
   <head>
     <meta charset="utf-8" />
     <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
     <meta name="theme-color" content="#000000" />
     <meta
       name="description"
diff --git a/client/src/components/Background/Background.module.scss b/client/src/components/Background/Background.module.scss
index e5ddb98c..80203114 100644
--- a/client/src/components/Background/Background.module.scss
+++ b/client/src/components/Background/Background.module.scss
@@ -1,10 +1,10 @@
 :global(#app) {
   .wrapper {
     height: 100%;
+    max-height: 100vh;
+    max-width: 100vw;
     position: fixed;
     width: 100%;
     z-index: -1;
-    max-width: 100vw;
-    max-height: 100vh;
   }
 }
diff --git a/client/src/components/Board/Board.module.scss b/client/src/components/Board/Board.module.scss
index 3e59e889..db8874fb 100644
--- a/client/src/components/Board/Board.module.scss
+++ b/client/src/components/Board/Board.module.scss
@@ -14,7 +14,6 @@
     transition: background 85ms ease-in, opacity 40ms ease-in,
       border-color 85ms ease-in;
     width: 100%;
-    min-width: 272px;
 
     &:active {
       outline: none;
@@ -45,30 +44,11 @@
 
   .lists {
     display: inline-flex;
-    height: calc(100vh - 194px);
+    height: 100%;
     min-width: 100%;
-    border-radius: 2.5px;
-  }
-
-  .panel {
-    align-items: center;
-    display: flex;
-    margin-bottom: 20px;
-  }
-
-  .panelItem {
-    margin-right: 20px;
   }
 
   .wrapper {
     margin: 0 20px;
-
-    @media only screen and (max-width: 797px) {
-      max-width: 100vw;
-    }
-  }
-
-  .scrollable {
-    min-width: 100%;
   }
 }
diff --git a/client/src/components/BoardActions/BoardActions.module.scss b/client/src/components/BoardActions/BoardActions.module.scss
index 49236909..2a73de92 100644
--- a/client/src/components/BoardActions/BoardActions.module.scss
+++ b/client/src/components/BoardActions/BoardActions.module.scss
@@ -2,22 +2,15 @@
   .action {
     align-items: center;
     display: flex;
-    flex-wrap: nowrap;
     flex: 0 0 auto;
-
-    @media only screen and (max-width: 797px) {
-      gap: 10px;
-    }
   }
 
   .actions {
     align-items: center;
     display: flex;
-    flex-flow: norow wrap;
-    justify-content: flex-start;
-    align-items: center;
-    margin: 20px 20px;
     gap: 20px;
+    justify-content: flex-start;
+    margin: 20px 20px;
   }
 
   .wrapper {
@@ -25,7 +18,6 @@
     overflow-y: hidden;
     -ms-overflow-style: none;
     scrollbar-width: none;
-    max-width: 100vw;
 
     &::-webkit-scrollbar {
       display: none;
diff --git a/client/src/components/BoardActions/Filters.module.scss b/client/src/components/BoardActions/Filters.module.scss
index 6a9986da..1c5cab4a 100644
--- a/client/src/components/BoardActions/Filters.module.scss
+++ b/client/src/components/BoardActions/Filters.module.scss
@@ -10,7 +10,6 @@
     display: inline-block;
     outline: none;
     padding: 0;
-    white-space: nowrap;
   }
 
   .filterItem {
@@ -46,14 +45,13 @@
   }
 
   .search {
-    height: 24px;
-    transition: width 0.2s ease;
-    width: 220px;
+    height: 30px;
     margin: 0 12px;
+    transition: width 0.2s ease;
+    width: 280px;
 
-    @media only screen and (min-width: 797px) {
-      width: 280px;
-      height: 30px;
+    @media only screen and (max-width: 797px) {
+      width: 220px;
     }
 
     input {
diff --git a/client/src/components/Card/Card.module.scss b/client/src/components/Card/Card.module.scss
index b3bae9c1..390f0442 100644
--- a/client/src/components/Card/Card.module.scss
+++ b/client/src/components/Card/Card.module.scss
@@ -23,7 +23,8 @@
     }
 
     @media only screen and (max-width: 797px) {
-      &:focus, &:active {
+      &:focus,
+      &:active {
         background: #ebeef0;
         color: #516b7a;
       }
@@ -62,16 +63,16 @@
     box-shadow: 0 1px 0 #ccc;
     position: relative;
 
-    &:hover {
-      background: #f5f6f7;
-      border-bottom-color: rgba(9, 30, 66, 0.25);
-
+    @media only screen and (max-width: 797px) {
       .target {
         opacity: 1;
       }
     }
 
-    @media only screen and (max-width: 797px) {
+    &:hover {
+      background: #f5f6f7;
+      border-bottom-color: rgba(9, 30, 66, 0.25);
+
       .target {
         opacity: 1;
       }
diff --git a/client/src/components/CardModal/CardModal.jsx b/client/src/components/CardModal/CardModal.jsx
index 9c9651cc..91e89474 100755
--- a/client/src/components/CardModal/CardModal.jsx
+++ b/client/src/components/CardModal/CardModal.jsx
@@ -515,14 +515,19 @@ const CardModal = React.memo(
                   <Icon name="copy outline" className={styles.actionIcon} />
                   {t('action.duplicate')}
                 </Button>
-                <Button fluid className={styles.actionButton} onClick={handleCopyLinkClick}>
-                  <Icon name={isLinkCopied ? 'linkify' : 'unlink'} className={styles.actionIcon} />
-                  {isLinkCopied
-                    ? t('common.linkIsCopied')
-                    : t('action.copyLink', {
-                        context: 'title',
-                      })}
-                </Button>
+                {window.isSecureContext && (
+                  <Button fluid className={styles.actionButton} onClick={handleCopyLinkClick}>
+                    <Icon
+                      name={isLinkCopied ? 'linkify' : 'unlink'}
+                      className={styles.actionIcon}
+                    />
+                    {isLinkCopied
+                      ? t('common.linkIsCopied')
+                      : t('action.copyLink', {
+                          context: 'title',
+                        })}
+                  </Button>
+                )}
                 <DeletePopup
                   title="common.deleteCard"
                   content="common.areYouSureYouWantToDeleteThisCard"
diff --git a/client/src/components/CardModal/CardModal.module.scss b/client/src/components/CardModal/CardModal.module.scss
index 1fee28e1..7b20e902 100644
--- a/client/src/components/CardModal/CardModal.module.scss
+++ b/client/src/components/CardModal/CardModal.module.scss
@@ -25,14 +25,14 @@
 
   .actions {
     margin-bottom: 24px;
+
     @media only screen and (max-width: 797px) {
-      margin-bottom: 10px;
-      width: 50%;
-      padding: 10px;
+      flex: 1;
     }
+
     @media only screen and (max-width: 425px) {
+      padding: 0;
       width: 100%;
-      padding: unset;
     }
   }
 
@@ -71,7 +71,9 @@
 
   .contentPadding {
     padding: 8px 8px 0 16px;
+
     @media only screen and (max-width: 797px) {
+      padding-right: 16px;
       width: 100% !important;
     }
   }
@@ -166,6 +168,7 @@
 
   .modalPadding {
     padding: 0px;
+
     @media only screen and (max-width: 797px) {
       display: flex;
       flex-flow: column nowrap;
@@ -200,11 +203,14 @@
 
   .sidebarPadding {
     padding: 8px 16px 0 8px;
+
     @media only screen and (max-width: 797px) {
-      width: 100% !important;
+      align-items: flex-start;
       display: flex;
       flex-flow: row wrap;
-      align-items: flex-start;
+      gap: 10px;
+      padding-left: 16px;
+      width: 100% !important;
     }
   }
 
diff --git a/client/src/components/Core/Core.module.scss b/client/src/components/Core/Core.module.scss
index 58c5f56b..394a6871 100644
--- a/client/src/components/Core/Core.module.scss
+++ b/client/src/components/Core/Core.module.scss
@@ -4,6 +4,7 @@
     border-radius: 4px;
     bottom: 20px;
     box-shadow: #b04632 0 1px 0;
+    max-width: calc(100% - 40px);
     padding: 12px 18px;
     position: fixed;
     right: 20px;
diff --git a/client/src/components/Fixed/Fixed.module.scss b/client/src/components/Fixed/Fixed.module.scss
index e01c54a8..dd261c6f 100644
--- a/client/src/components/Fixed/Fixed.module.scss
+++ b/client/src/components/Fixed/Fixed.module.scss
@@ -1,8 +1,8 @@
 :global(#app) {
   .wrapper {
+    max-width: 100vw;
     position: fixed;
     width: 100%;
     z-index: 1;
-    max-width: 100vw;
   }
 }
diff --git a/client/src/components/Header/Header.module.scss b/client/src/components/Header/Header.module.scss
index 0ba88121..ef92efaa 100644
--- a/client/src/components/Header/Header.module.scss
+++ b/client/src/components/Header/Header.module.scss
@@ -87,8 +87,8 @@
   }
 
   .userName {
-    margin-right: 10px;
     display: none;
+    margin-right: 10px;
 
     @media only screen and (min-width: 797px) {
       display: block;
diff --git a/client/src/components/List/List.module.scss b/client/src/components/List/List.module.scss
index f1421b23..1063dead 100644
--- a/client/src/components/List/List.module.scss
+++ b/client/src/components/List/List.module.scss
@@ -111,7 +111,8 @@
     }
 
     @media only screen and (max-width: 797px) {
-      &:focus, &:active {
+      &:focus,
+      &:active {
         background: rgba(9, 30, 66, 0.13);
         color: #516b7a;
       }
diff --git a/client/src/components/Memberships/Memberships.module.scss b/client/src/components/Memberships/Memberships.module.scss
index 7f726ce1..7910a38e 100644
--- a/client/src/components/Memberships/Memberships.module.scss
+++ b/client/src/components/Memberships/Memberships.module.scss
@@ -11,6 +11,10 @@
     vertical-align: top;
     width: 36px;
 
+    @media only screen and (max-width: 797px) {
+      margin-left: 10px;
+    }
+
     &:hover {
       background: rgba(0, 0, 0, 0.32);
     }
