css: move margin specific stuff to ui files

so we can use margin-start/margin-end instead of margin-left, margin-right

data/resources/style.css

@@ -4,7 +4,6 @@
 .pill-button {
   border-radius: 9999px;
 }
-
 .providers-list {
   background-color: @theme_base_bg;
 }
@@ -25,14 +24,7 @@
   background: @theme_base_bg;
   box-shadow: none;
 }
-.provider-row .title-3 {
-  margin-bottom: 6px;
-  margin-left: 6px;
-}
-.provider-image {
-  margin-bottom: 6px;
-  margin-right: 6px;
-}
+
 .totp-progress,
 .totp-progress trough progress,
 .totp-progress trough {
@@ -54,6 +46,7 @@ row .content row.account-row:last-child {
 .account-row {
   padding: 12px;
 }
+
 .account-otp {
   letter-spacing: 1.8px;
   font-size: medium;

data/resources/ui/provider_image.ui

@@ -1,6 +1,8 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <interface>
   <template class="ProviderImage" parent="GtkBox">
+    <property name="margin-bottom">6</property>
+    <property name="margin-end">6</property>
     <child>
       <object class="GtkStack" id="stack">
         <property name="transition-type">crossfade</property>
@@ -28,8 +30,5 @@
         </child>
       </object>
     </child>
-    <style>
-      <class name="provider-image" />
-    </style>
   </template>
 </interface>

data/resources/ui/provider_row.ui

@@ -21,6 +21,8 @@
             <child>
               <object class="GtkLabel" id="name_label">
                 <property name="halign">start</property>
+                <property name="margin-start">6</property>
+                <property name="margin-bottom">6</property>
                 <style>
                   <class name="title-3" />
                 </style>