Fix alignment of navigation theme options

This commit fixes the alignment of the color theme options in
User Settings > Preferences > Navigation Theme when the name of the
theme is long.

app/assets/stylesheets/pages/profiles/preferences.scss

@@ -19,11 +19,6 @@
   $ui-light-bg: #dfdfdf;
   $ui-dark-mode-bg: #1f1f1f;
 
-  label {
-    margin: 0 $gl-padding-32 $gl-padding 0;
-    text-align: center;
-  }
-
   .preview {
     font-size: 0;
     height: 48px;

app/views/profiles/preferences/show.html.haml

@@ -8,11 +8,12 @@
     %p
       = s_('Preferences|Customize the appearance of the application header and navigation sidebar.')
   .col-lg-8.application-theme
-    - Gitlab::Themes.each do |theme|
-      = label_tag do
-        .preview{ class: theme.css_class }
-        = f.radio_button :theme_id, theme.id, checked: Gitlab::Themes.for_user(@user).id == theme.id
-        = theme.name
+    .row
+      - Gitlab::Themes.each do |theme|
+        %label.col-6.col-sm-4.col-md-3.gl-mb-5.gl-text-center
+          .preview{ class: theme.css_class }
+          = f.radio_button :theme_id, theme.id, checked: Gitlab::Themes.for_user(@user).id == theme.id
+          = theme.name
 
   .col-sm-12
     %hr

changelogs/unreleased/nfriend-fix-theme-alignment.yml

+---
+title: Fix alignment of navigation theme options
+merge_request: 35041
+author:
+type: fixed