bigger tap area for buttons

src/status_im/chats_list/styles.cljs

@@ -46,19 +46,18 @@
    :ios             {:margin-top 14}})
 
 (defstyle chat-options-container
-  {:margin-right 16
-   :padding-top  10
-   :android      {:margin-top 16}
-   :ios          {:margin-top 14}})
+  {:padding-top 10})
 
-(def item-upper-container
-  {:flex            1
-   :flex-direction  :row})
+(defstyle item-upper-container
+  {:flex           1
+   :flex-direction :row
+   :padding-right  16})
 
 (defstyle item-lower-container
   {:flex            1
    :flex-direction  :row
    :justify-content :space-between
+   :padding-right   16
    :android         {:margin-top 4}
    :ios             {:margin-top 6}})
 
@@ -152,12 +151,13 @@
   {:flex-direction :row
    :padding-right  14})
 
-(def opts-btn
-  {:width           24
-   :height          24
-   :align-items     :center
+(def opts-btn-container
+  {:align-items     :center
    :justify-content :center})
 
+(def opts-btn
+  {:padding 16})
+
 (def create-icon
   {:fontSize 20
    :height   22

src/status_im/chats_list/views/inner_item.cljs

@@ -90,10 +90,12 @@
   (let [options [{:value        #(dispatch [:remove-chat chat-id])
                   :text         (label :t/delete-chat)
                   :destructive? true}]]
-    [view st/opts-btn
+    [view st/opts-btn-container
      [context-menu
       [icon :options_gray]
-      options]]))
+      options
+      nil
+      st/opts-btn]]))
 
 (defn chat-list-item-name [name group-chat? public?]
   (let [private-group? (and group-chat? (not public?))

src/status_im/components/common/common.cljs

@@ -53,5 +53,7 @@
       [view st/form-title-extend-container
        [context-menu
         [icon :options_gray]
-        options]])]
+        options
+        nil
+        st/form-title-extend-button]])]
    [top-shadow]])

src/status_im/components/common/styles.cljs

@@ -55,13 +55,14 @@
                     :margin-top       8}})
 
 (defstyle form-title-extend-container
-  {:padding-right 16
-   :ios          {:margin-top 16
-                  :padding-top 16
+  {:ios          {:margin-top 16
                   :background-color color-white}
-   :android      {:margin-top 24
+   :android      {:margin-top 8
                   :background-color color-light-gray}})
 
+(def form-title-extend-button
+  {:padding 16})
+
 (defstyle form-title
   {:flex-shrink 1
    :ios         {:color          text1-color
@@ -84,4 +85,4 @@
 
 (defstyle list-header-footer-spacing
   {:android {:background-color color-white
-             :height           8}})
+             :height           8}})

src/status_im/components/contact/contact.cljs

@@ -33,10 +33,12 @@
     [view st/contact-container
      [contact-inner-view {:contact contact :info info}]
      (when extended?
-       [view st/more-btn
+       [view st/more-btn-container
         [context-menu
          [icon :options_gray]
-         extend-options]])]]])
+         extend-options
+         nil
+         st/more-btn]])]]])
 
 (defview toogle-contact-view [{:keys [whisper-identity] :as contact} selected-key on-toggle-handler]
   [checked [selected-key whisper-identity]]
@@ -47,4 +49,4 @@
                                 (when checked {:style st/selected-contact}))]
      [view (st/icon-check-container checked)
       (when checked
-        [icon :check_on st/check-icon])]]]])
+        [icon :check_on st/check-icon])]]]])

src/status_im/components/contact/styles.cljs

@@ -33,14 +33,14 @@
 (def contact-container
   {:flex-direction   :row
    :align-items      :center
-   :background-color common/color-white
-   :padding-right    16})
+   :background-color common/color-white})
+
+(def more-btn-container
+  {:alignItems     :center
+   :justifyContent :center})
 
 (def more-btn
-  {:width          24
-   :height         24
-   :alignItems     :center
-   :justifyContent :center})
+  {:padding 16})
 
 (def selected-contact
   {:background-color common/selected-contact-color})
@@ -64,4 +64,4 @@
 
 (def check-icon
   {:width  12
-   :height 12})
+   :height 12})

src/status_im/profile/screen.cljs

@@ -98,7 +98,9 @@
    (when options
      [context-menu
       [icon :options_gray]
-      options])])
+      options
+      nil
+      st/profile-info-item-button])])
 
 (defn show-qr [contact qr-source]
   #(dispatch [:navigate-to-modal :qr-code-view {:contact   contact

src/status_im/profile/styles.cljs

@@ -26,6 +26,9 @@
 (defstyle profile-info-container
   {:background-color color-white})
 
+(def profile-info-item-button
+  {:padding 16})
+
 (def status-prompt
   {:padding-left  16
    :padding-right 16
@@ -95,7 +98,6 @@
   {:flex-direction :row
    :align-items    :center
    :padding-left   16
-   :padding-right  16
    :ios            {:height 73}
    :android        {:height 72}})