Issue 4961 - Fix card group field alignment on acceptableads.com

static/scss/layout/_sidebar.scss

 // This file is part of acceptableads.org.
 // Copyright (C) 2016 Eyeo GmbH
 //
 // acceptableads.org is free software: you can redistribute it and/or modify
 // it under the terms of the GNU General Public License as published by
 // the Free Software Foundation, either version 3 of the License, or
 // (at your option) any later version.
 //
 // acceptableads.org is distributed in the hope that it will be useful,
 // but WITHOUT ANY WARRANTY; without even the implied warranty of
@@ skipping 19 matching lines @@
     margin: 0;
     padding: 0;
     text-align: inherit;
   }
 
   li::before
   {
     @extend .unstyle-list;
   }
 
+  a,
+  a%active
+  {
+    display: block;
+    text-decoration: none;
+    color: inherit;
+  }
+
   // #sidebar-brank blocks
   // #sidebar-logo is visible on desktop
   // #sidebar-open, #sidebar-close, and #sidebar-tittle are visible on mobile
 
   #sidebar-brand
   {
     height: $lg;
     line-height: $lg;
   }
 
   #sidebar-logo
   {
     display: block;
     padding: 0 $md;
     text-align: inherit;
     background-color: $accent;
 
     img
     {
       width: $md;
       height: $md;
       vertical-align: middle;
     }
   }
 
   #sidebar-open,
   #sidebar-close,
-  .site-title
+  #sidebar-title
   {
     display: none;
   }
 
   #sidebar-close img
   {
     width: 20px;
     height: 20px;
   }
 
   #sidebar-open img
   {
     width: 36px;
     height: 18px;
   }
 }
 
-#sidebar-menus
-{
-  a,
-  a%active
-  {
-    display: block;
-    text-decoration: none;
-    color: inherit;
-  }
-}
-
 // Positioning the sidebar on desktop
 @media(min-width: $sidebar-breakpoint-x)
 {
   // since the primary navigation collapses only when javascript is enabled
   // we must position this absolute by default so that it can scroll
   #sidebar
   {
     position: absolute;
     top: 0;
     width: $sidebar-width;
@@ skipping 53 matching lines @@
   }
 
   html[dir="rtl"].js #sidebar
   {
     text-align: right;
   }
 
   #sidebar
   {
     // show sidebar navbar title and open button by default
-    .site-title,
+    #sidebar-title,
     #sidebar-open
     {
       display: block;
     }
 
     // Toggle open/close buttons
     &.open
     {
       #sidebar-open
       {
         display: none;
       }
       #sidebar-close
       {
         display: block;
       }
     }
 
     // Style sidebar navbar blocks
 
     #sidebar-brand
     {
       background-color: $inverted-fg;
     }
 
     #sidebar-open,
     #sidebar-close,
     #sidebar-logo,
-    .site-title
+    #sidebar-title
     {
       padding: 0 $sm;
     }
 
     #sidebar-open,
     #sidebar-close,
-    .site-title
+    #sidebar-title
     {
       height: $lg;
       line-height: $lg;
     }
 
     #sidebar-open,
     #sidebar-close
     {
       width: $lg;
       min-width: $lg;
       margin: 0;
       color: $inverted-fg;
       border: none;
       background-color: $inverted-bg;
       font-size: $md;
     }
+
+    #sidebar-title img
+    {
+      display: inline-block;
+      height: $sm;
+      vertical-align: middle;
+    }
   }
 
   // align blocks left/right ltr/rtl in navbar
 
   html[dir="ltr"] #sidebar-open,
   html[dir="ltr"] #sidebar-close,
   html[dir="ltr"] #sidebar-logo,
-  html[dir="ltr"] #sidebar .site-title
+  html[dir="ltr"] #sidebar-title
   {
     float: left;
   }
 
   html[dir="rtl"] #sidebar-open,
   html[dir="rtl"] #sidebar-close,
   html[dir="rtl"] #sidebar-logo,
-  html[dir="rtl"] #sidebar .site-title
+  html[dir="rtl"] #sidebar-title
   {
     float: right;
   }
 }
 
 // Primary navigation //////////////////////////////////////////////////////////
 
 #primary-navigation
 {
   li
@@ skipping 201 matching lines @@
   }
   .js #secondary-navigation
   {
     display: none;
   }
   .js #sidebar.open #secondary-navigation
   {
     display: block;
   }
 }