Fix formatting of welcome screen for external users

Add changelog file
Remove example db file
Revert schema back to master
Restructure HTML to reflect changes in blank-state

app/assets/stylesheets/framework/blank.scss

@@ -14,13 +14,12 @@
 .blank-state-row {
   display: flex;
   flex-wrap: wrap;
-  justify-content: space-around;
-  height: 100%;
+  justify-content: space-between;
 }
 
 .blank-state-welcome {
   text-align: center;
-  padding: 20px 0 40px;
+  padding: $gl-padding 0 ($gl-padding * 2);
 
   .blank-state-welcome-title {
     font-size: 24px;
@@ -32,22 +31,13 @@
 }
 
 .blank-state-link {
-  display: block;
   color: $gl-text-color;
   flex: 0 0 100%;
   margin-bottom: 15px;
 
-  @include media-breakpoint-up(sm) {
-    flex: 0 0 49%;
-
-    &:nth-child(odd) {
-      margin-right: 5px;
-    }
-
-    &:nth-child(even) {
-      margin-left: 5px;
-    }
-  }
+  // @include media-breakpoint-up(sm) {
+  //   flex: 0 0 49%;
+  // }
 
   &:hover {
     background-color: $gray-light;
@@ -63,15 +53,20 @@
 }
 
 .blank-state {
-  padding: 20px;
+  display: flex;
+  align-items: center;
+  padding: 20px 50px;
   border: 1px solid $border-color;
   border-radius: $border-radius-default;
+  min-height: 240px;
+  margin-bottom: $gl-padding * 2;
+  flex: 0 0 calc(50% - #{$gl-padding});
 
-  @include media-breakpoint-up(sm) {
-    display: flex;
-    height: 100%;
-    align-items: center;
-    padding: 50px 30px;
+  @include media-breakpoint-down(sm) {
+    flex: 0 0 100%;
+    flex-direction: column;
+    justify-content: center;
+    padding: 50px 20px;
   }
 }
 
@@ -90,7 +85,7 @@
   }
 
   .blank-state-body {
-    @include media-breakpoint-down(xs) {
+    @include media-breakpoint-down(sm) {
       text-align: center;
       margin-top: 20px;
     }
@@ -121,9 +116,3 @@
     }
   }
 }
-
-@include media-breakpoint-down(xs) {
-  .blank-state-icon svg {
-    width: 315px;
-  }
-}

app/views/dashboard/projects/_blank_state_admin_welcome.html.haml

 .blank-state-row
-  = link_to new_project_path, class: "blank-state-link" do
-    .blank-state
+  = link_to new_project_path, class: "blank-state blank-state-link" do
     .blank-state-icon
       = custom_icon("add_new_project", size: 50)
     .blank-state-body
@@ -10,8 +9,7 @@
         Projects are where you store your code, access issues, wiki and other features of GitLab.
 
   - if current_user.can_create_group?
-    = link_to new_group_path, class: "blank-state-link" do
-      .blank-state
+    = link_to new_group_path, class: "blank-state blank-state-link" do
       .blank-state-icon
         = custom_icon("add_new_group", size: 50)
       .blank-state-body
@@ -20,8 +18,7 @@
         %p.blank-state-text
           Groups are a great way to organize projects and people.
 
-    = link_to new_admin_user_path, class: "blank-state-link" do
-      .blank-state
+    = link_to new_admin_user_path, class: "blank-state blank-state-link" do
       .blank-state-icon
         = custom_icon("add_new_user", size: 50)
       .blank-state-body
@@ -30,8 +27,7 @@
         %p.blank-state-text
           Add your team members and others to GitLab.
 
-  = link_to admin_root_path, class: "blank-state-link" do
-    .blank-state
+  = link_to admin_root_path, class: "blank-state blank-state-link" do
     .blank-state-icon
       = custom_icon("configure_server", size: 50)
     .blank-state-body

app/views/dashboard/projects/_blank_state_welcome.html.haml

@@ -2,8 +2,7 @@
 
 .blank-state-row
   - if current_user.can_create_project?
-    = link_to new_project_path, class: "blank-state-link" do
-      .blank-state
+    = link_to new_project_path, class: "blank-state blank-state-link" do
       .blank-state-icon
         = custom_icon("add_new_project", size: 50)
       .blank-state-body
@@ -22,8 +21,7 @@
           If you are added to a project, it will be displayed here.
 
   - if current_user.can_create_group?
-    = link_to new_group_path, class: "blank-state-link" do
-      .blank-state
+    = link_to new_group_path, class: "blank-state blank-state-link" do
       .blank-state-icon
         = custom_icon("add_new_group", size: 50)
       .blank-state-body
@@ -33,8 +31,7 @@
           Groups are the best way to manage projects and members.
 
   - if public_project_count > 0
-    = link_to trending_explore_projects_path, class: "blank-state-link" do
-      .blank-state
+    = link_to trending_explore_projects_path, class: "blank-state blank-state-link" do
       .blank-state-icon
         = custom_icon("globe", size: 50)
       .blank-state-body
@@ -47,8 +44,7 @@
           Public projects are an easy way to allow
           everyone to have read-only access.
 
-  = link_to "https://docs.gitlab.com/", class: "blank-state-link" do
-    .blank-state
+  = link_to "https://docs.gitlab.com/", class: "blank-state blank-state-link" do
     .blank-state-icon
       = custom_icon("lightbulb", size: 50)
     .blank-state-body

changelogs/unreleased/45797-welcome-screen.yml

+---
+title: Fix formatting welcome screen external users
+merge_request: 32227
+author:
+type: fixed