From 7d82242fc9b5376bbd735c1df601571f6bdb9072 Mon Sep 17 00:00:00 2001
From: Aditya Anand M C <aditya.anandmc@gmail.com>
Date: Thu, 30 Apr 2020 08:09:18 +0530
Subject: [PATCH] fix up css in accounts

---
 .../profiles/header_sync_profile.html         | 24 +++++++++----------
 app/retail/templates/settings/account.html    | 18 +++++---------
 2 files changed, 17 insertions(+), 25 deletions(-)

diff --git a/app/dashboard/templates/profiles/header_sync_profile.html b/app/dashboard/templates/profiles/header_sync_profile.html
index d954834bae3..c8910803926 100644
--- a/app/dashboard/templates/profiles/header_sync_profile.html
+++ b/app/dashboard/templates/profiles/header_sync_profile.html
@@ -1,15 +1,13 @@
 {% load i18n static avatar_tags %}
-<div class="profile-header__sync d-inline-block d-inline-block mb-1 p-0 {% if not is_editable %}inactive{% endif %}">
-
-    <button id="sync-to-3box" class="btn btn-sm animate-verify" data-container="body" data-toggle="popover" data-html="true"
-      data-placement="bottom" data-trigger="hover" data-content='
-        <p class="h6 my-2 text-left">Backup Profile Data to 3Box <img width="24" src="{% static "v2/images/3box.svg" %}"></p>
-        <p>You can backup your Gitcoin profile data to the decentralized 3Box cloud. 3Box storage is simple, secure, and private by design.</p>
-        <p><b>Click this button</b> to start backing up your profile data to 3Box. <b>Long press this button</b> to enable/disable automatic backup of profile data. </p>
-        <p>Visit 3box.io to learn more about 3Box project.</p>
-        '>
-        <img class="action" src="{% static 'v2/images/3box.svg' %}" alt="">
-        <img class="loading" src="{% static 'v2/images/loading.gif' %}" alt="">
-      </button>
-
+<div class="profile-header__sync d-inline-block">
+  <button id="sync-to-3box" class="btn btn-sm animate-verify" data-container="body" data-toggle="popover" data-html="true"
+    data-placement="bottom" data-trigger="hover" data-content='
+      <p class="h6 my-2 text-left">Backup Profile Data to 3Box <img width="24" src="{% static "v2/images/3box.svg" %}"></p>
+      <p>You can backup your Gitcoin profile data to the decentralized 3Box cloud. 3Box storage is simple, secure, and private by design.</p>
+      <p><b>Click this button</b> to start backing up your profile data to 3Box. <b>Long press this button</b> to enable/disable automatic backup of profile data. </p>
+      <p>Visit 3box.io to learn more about 3Box project.</p>
+      '>
+    <img class="action" src="{% static 'v2/images/3box.svg' %}" alt="">
+    <img class="loading" src="{% static 'v2/images/loading.gif' %}" alt="">
+  </button>
 </div>
diff --git a/app/retail/templates/settings/account.html b/app/retail/templates/settings/account.html
index d53b99ec1b7..b2c96f32c89 100644
--- a/app/retail/templates/settings/account.html
+++ b/app/retail/templates/settings/account.html
@@ -56,27 +56,21 @@
     position: relative;
   }
 
-  .profile-header__sync.inactive {
-    display: none;
-  }
-
   .profile-header__sync img {
-    width: 32px;
+    width: 2rem;
+    position: relative;
+    top: -4px;
   }
 
   .profile-header__sync img.loading {
     display: none;
   }
-
 </style>
 <form id="settings" method="POST" action="{% url 'account_settings' %}" class="col-md-8 m-auto">
 
-
-  <div class="form-group mb-5">
-    <h5>  Backup Profile data to 3box:</h5>
-    <div>
-      {% include 'profiles/header_sync_profile.html' %}
-    </div>
+  <div class="form-group mb-4">
+    <h5 class="d-inline-block">Backup Profile data to 3box</h5>
+    {% include 'profiles/header_sync_profile.html' %}
   </div>
   <div class="form-group mb-5">
     <h5>{% trans "Account type" %}</h5>