Refactor scss

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

app/assets/stylesheets/application.scss

@@ -37,6 +37,7 @@
 @import "generic/issue_box.scss";
 @import "generic/files.scss";
 @import "generic/lists.scss";
+@import "generic/flash.scss";
 @import "generic/forms.scss";
 @import "generic/selects.scss";
 @import "generic/highlight.scss";

app/assets/stylesheets/generic/blocks.scss

@@ -2,3 +2,18 @@
   background: #f9f9f9;
   padding: 15px;
 }
+
+.centered-light-block {
+  text-align: center;
+  color: #888;
+  margin: 20px;
+}
+
+.nothing-here-block {
+  text-align: center;
+  padding: 20px;
+  color: #666;
+  font-weight: normal;
+  font-size: 16px;
+  line-height: 36px;
+}

app/assets/stylesheets/generic/common.scss

@@ -11,8 +11,6 @@
 .bgred { background: #F2DEDE!important }
 
 /** COMMON CLASSES **/
-.left { float:left }
-
 .prepend-top-10 { margin-top:10px }
 .prepend-top-20 { margin-top:20px }
 .prepend-left-10 { margin-left:10px }
@@ -24,32 +22,9 @@
 .append-bottom-20 { margin-bottom:20px }
 .inline { display: inline-block }
 
-.padded { padding:20px }
-.ipadded { padding:20px!important }
-.lborder { border-left:1px solid #eee }
-.underlined_link { text-decoration: underline; }
+.underlined-link { text-decoration: underline; }
 .hint { font-style: italic; color: #999; }
 .light { color: #888 }
-.tiny { font-weight: normal }
-.vtop { vertical-align: top !important; }
-
-
-/** ALERT MESSAGES **/
-.alert.alert-disabled {
-  background: #EEE;
-  color: #777;
-  border-color: #DDD;
-}
-
-/** HELPERS **/
-.nothing_here_message {
-  text-align: center;
-  padding: 20px;
-  color: #666;
-  font-weight: normal;
-  font-size: 16px;
-  line-height: 36px;
-}
 
 .slead {
   color: #666;
@@ -59,53 +34,23 @@
   line-height: 24px;
 }
 
-
 .tab-content {
   overflow: visible;
 }
 
-@media (max-width: 1200px) {
-  .only-wide {
-    display: none;
+pre {
+  &.clean {
+    background: none;
+    border: none;
+    margin: 0;
+    padding: 0;
   }
-}
 
-pre.well-pre {
+  &.well-pre {
     border: 1px solid #EEE;
     background: #f9f9f9;
     border-radius: 0;
     color: #555;
-}
-
-.input-append .btn.active, .input-prepend .btn.active {
-  background: #CCC;
-  border-color: #BBB;
-  text-shadow: 0 1px 1px #fff;
-  font-weight: bold;
-  @include box-shadow(inset 0 2px 4px rgba(0,0,0,.15));
-}
-
-/** Big Labels **/
-.state-label {
-  font-size: 14px;
-  padding: 9px 25px;
-  text-align: center;
-  text-shadow: none;
-  margin-right: 20px;
-
-  &.state-label-blue {
-    background: #31708f;
-    color: #FFF;
-  }
-
-  &.state-label-green {
-    background: #4A4;
-    color: #FFF;
-  }
-
-  &.state-label-red {
-    background: #DA4E49;
-    color: #FFF;
   }
 }
 
@@ -135,31 +80,6 @@ pre.well-pre {
 }
 
 /** FLASH message **/
-.flash-container {
-  display: none;
-  cursor: pointer;
-  margin: 0;
-  text-align: center;
-  color: #fff;
-  font-size: 14px;
-  position: fixed;
-  bottom: 0;
-  width: 100%;
-  opacity: 0.8;
-  z-index: 100;
-
-  .flash-notice {
-    background: #49C;
-    padding: 10px;
-    text-shadow: 0 1px 1px #178;
-  }
-
-  .flash-alert {
-    background: #C67;
-    text-shadow: 0 1px 1px #945;
-    padding: 10px;
-  }
-}
 .author_link {
   color: $link_color;
 }
@@ -279,22 +199,6 @@ li.note {
   cursor: pointer;
 }
 
-.merge-request,
-.issue {
-  &.today{
-    background: #EFE;
-    border-color: #CEC;
-  }
-  &.closed {
-    background: #F5f5f5;
-    border-color: #E5E5E5;
-  }
-  &.merged {
-    background: #F5f5f5;
-    border-color: #E5E5E5;
-  }
-}
-
 .git_error_tips {
   @extend .col-md-6;
   text-align: left;
@@ -358,15 +262,6 @@ li.note {
   }
 }
 
-pre {
-  &.clean {
-    background: none;
-    border: none;
-    margin: 0;
-    padding: 0;
-  }
-}
-
 .milestone {
   &.milestone-closed {
     background: #eee;
@@ -450,40 +345,6 @@ table {
   margin-bottom: 20px;
 }
 
-.ajax-users-select {
-  width: 400px;
-
-  &.input-large {
-    width: 210px;
-  }
-
-  &.input-clamp {
-    max-width: 100%;
-  }
-}
-
-.user-result {
-  .user-image {
-    float: left;
-  }
-  .user-name {
-  }
-  .user-username {
-    color: #999;
-  }
-}
-
-.namespace-result {
-  .namespace-kind {
-    color: #AAA;
-    font-weight: normal;
-  }
-  .namespace-path {
-    margin-left: 10px;
-    font-weight: bolder;
-  }
-}
-
 .btn-sign-in {
   margin-top: 7px;
   text-shadow: none;

app/assets/stylesheets/generic/flash.scss

+.flash-container {
+  display: none;
+  cursor: pointer;
+  margin: 0;
+  text-align: center;
+  color: #fff;
+  font-size: 14px;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  opacity: 0.8;
+  z-index: 100;
+
+  .flash-notice {
+    background: #49C;
+    padding: 10px;
+    text-shadow: 0 1px 1px #178;
+  }
+
+  .flash-alert {
+    background: #C67;
+    text-shadow: 0 1px 1px #945;
+    padding: 10px;
+  }
+}

app/assets/stylesheets/generic/issue_box.scss

@@ -48,4 +48,27 @@
       margin: 0;
     }
   }
+
+  .state-label {
+    font-size: 14px;
+    padding: 9px 25px;
+    text-align: center;
+    text-shadow: none;
+    margin-right: 20px;
+
+    &.state-label-blue {
+      background: #31708f;
+      color: #FFF;
+    }
+
+    &.state-label-green {
+      background: #4A4;
+      color: #FFF;
+    }
+
+    &.state-label-red {
+      background: #DA4E49;
+      color: #FFF;
+    }
+  }
 }

app/assets/stylesheets/generic/selects.scss

@@ -87,3 +87,37 @@ select {
     padding-top: 4px;
   }
 }
+
+.ajax-users-select {
+  width: 400px;
+
+  &.input-large {
+    width: 210px;
+  }
+
+  &.input-clamp {
+    max-width: 100%;
+  }
+}
+
+.user-result {
+  .user-image {
+    float: left;
+  }
+  .user-name {
+  }
+  .user-username {
+    color: #999;
+  }
+}
+
+.namespace-result {
+  .namespace-kind {
+    color: #AAA;
+    font-weight: normal;
+  }
+  .namespace-path {
+    margin-left: 10px;
+    font-weight: bolder;
+  }
+}

app/assets/stylesheets/sections/issues.scss

@@ -125,3 +125,21 @@
 form.edit-issue {
   margin: 0;
 }
+
+.merge-request,
+.issue {
+  &.today {
+    background: #EFE;
+    border-color: #CEC;
+  }
+
+  &.closed {
+    background: #F5f5f5;
+    border-color: #E5E5E5;
+  }
+
+  &.merged {
+    background: #F5f5f5;
+    border-color: #E5E5E5;
+  }
+}

app/views/admin/projects/index.html.haml

@@ -53,5 +53,5 @@
               = link_to 'Edit', edit_project_path(project), id: "edit_#{dom_id(project)}", class: "btn btn-small"
               = link_to 'Destroy', [project], data: { confirm: remove_project_message(project) }, method: :delete, class: "btn btn-small btn-remove"
         - if @projects.blank?
-          %p.nothing_here_message 0 projects matches
+          .nothing-here-block 0 projects matches
     = paginate @projects, theme: "gitlab"

app/views/dashboard/_activities.html.haml

@@ -4,6 +4,6 @@
 - if @events.any?
   .content_list
 - else
-  %p.nothing_here_message Projects activity will be displayed here
+  .nothing-here-block Projects activity will be displayed here
 
 = spinner

app/views/dashboard/_groups.html.haml

@@ -17,4 +17,4 @@
             %i.icon-angle-right
     - if groups.blank?
       %li
-        %h3.nothing_here_message You have no groups yet.
+        .nothing-here-block You have no groups yet.

app/views/dashboard/_projects.html.haml

@@ -14,7 +14,7 @@
 
     - if projects.blank?
       %li
-        %h3.nothing_here_message There are no projects here.
+        .nothing-here-block There are no projects here.
     - if @projects_count > @projects_limit
       %li.bottom
         %span.light

app/views/dashboard/projects.html.haml

@@ -67,7 +67,7 @@
 
         - if @projects.blank?
           %li
-            %h3.nothing_here_message There are no projects here.
+            .nothing-here-block There are no projects here.
     .bottom
       = paginate @projects, theme: "gitlab"
 

app/views/groups/_filter.html.haml

@@ -21,7 +21,7 @@
               = project.name_with_namespace
               %small.pull-right= entities_per_project(project, entity)
       - if @projects.blank?
-        %p.nothing_here_message This group has no projects yet
+        .nothing-here-block This group has no projects yet
 
   %fieldset
     %hr

app/views/groups/_projects.html.haml

@@ -8,7 +8,7 @@
           New project
   %ul.well-list
     - if projects.blank?
-      %p.nothing_here_message This groups has no projects yet
+      .nothing-here-block This groups has no projects yet
     - projects.each do |project|
       %li.project-row
         = link_to project_path(project), class: dom_class(project) do

app/views/groups/edit.html.haml

@@ -80,7 +80,7 @@
                   = link_to 'Edit', edit_project_path(project), id: "edit_#{dom_id(project)}", class: "btn btn-small"
                   = link_to 'Remove', project, data: { confirm: remove_project_message(project)}, method: :delete, class: "btn btn-small btn-remove"
             - if @group.projects.blank?
-              %p.nothing_here_message This group has no projects yet
+              .nothing-here-block This group has no projects yet
 
       .tab-pane#tab-remove
         .ui-box.ui-box-danger

app/views/groups/show.html.haml

@@ -10,7 +10,7 @@
     - if @events.any?
       .content_list
     - else
-      %p.nothing_here_message Project activity will be displayed here
+      .nothing-here-block Project activity will be displayed here
     = spinner
   .side.col-md-4
     .light-well.append-bottom-20

app/views/profiles/keys/index.html.haml

@@ -17,6 +17,6 @@
     = render @keys
     - if @keys.blank?
       %li
-        %h3.nothing_here_message There are no SSH keys with access to your account.
+        .nothing-here-block There are no SSH keys with access to your account.
 
 

app/views/projects/blob/_text.html.haml

@@ -10,4 +10,4 @@
     - unless blob.empty?
       = render 'shared/file_hljs', blob: blob
     - else
-      %p.nothing_here_message Empty file
+      .nothing-here-block Empty file

app/views/projects/commits/_diffs.html.haml

@@ -8,18 +8,18 @@
       - if current_controller?(:commit) or current_controller?(:merge_requests)
         Please, download the diff as
         - if current_controller?(:commit)
-          = link_to "plain diff", project_commit_path(@project, @commit, format: :diff), class: "underlined_link"
+          = link_to "plain diff", project_commit_path(@project, @commit, format: :diff), class: "underlined-link"
           or
-          = link_to "email patch", project_commit_path(@project, @commit, format: :patch), class: "underlined_link"
+          = link_to "email patch", project_commit_path(@project, @commit, format: :patch), class: "underlined-link"
         - else
-          = link_to "plain diff", project_merge_request_path(@project, @merge_request, format: :diff), class: "underlined_link"
+          = link_to "plain diff", project_merge_request_path(@project, @merge_request, format: :diff), class: "underlined-link"
           or
-          = link_to "email patch", project_merge_request_path(@project, @merge_request, format: :patch), class: "underlined_link"
+          = link_to "email patch", project_merge_request_path(@project, @merge_request, format: :patch), class: "underlined-link"
         instead.
     - unless @force_suppress_diff
       %p
         If you still want to see the diff
-        = link_to "click this link", url_for(force_show_diff: true), class: "underlined_link"
+        = link_to "click this link", url_for(force_show_diff: true), class: "underlined-link"
 
 %p.commit-stat-summary
   Showing
@@ -74,4 +74,4 @@
             - old_file = project.repository.blob_at(@commit.parent_id, diff.old_path) if @commit.parent_id
             = render "projects/commits/image", diff: diff, old_file: old_file, file: file, index: i
           - else
-            %p.nothing_here_message No preview for this file type
+            .nothing-here-block No preview for this file type

app/views/projects/deploy_keys/index.html.haml

@@ -20,7 +20,7 @@
       = render @enabled_keys
       - if @enabled_keys.blank?
         .light-well
-          %p.nothing_here_message Create a #{link_to 'new deploy key', new_project_deploy_key_path(@project)} or add an existing one
+          .nothing-here-block Create a #{link_to 'new deploy key', new_project_deploy_key_path(@project)} or add an existing one
   .col-md-6.available-keys
     %h5
       %strong Deploy keys
@@ -29,4 +29,4 @@
       = render @available_keys
       - if @available_keys.blank?
         .light-well
-          %p.nothing_here_message Deploy keys from projects you have access to will be displayed here
+          .nothing-here-block Deploy keys from projects you have access to will be displayed here

app/views/projects/edit.html.haml

@@ -93,10 +93,11 @@
 
 
 
-    %center.light.prepend-top-20.padded
+    .centered-light-block
       %h3
         %i.icon-warning-sign
         Dangerous settings
+
       %p Project settings below may result in data loss!
       = link_to '#', class: 'btn js-toggle-visibility-link' do
         Show it to me
@@ -132,7 +133,7 @@
                   data: { confirm: "Are you sure that you want to archive this project?\nAn archived project cannot be committed to." },
                   method: :post, class: "btn btn-remove"
       - else
-        %p.nothing_here_message Only the project owner can archive a project
+        .nothing-here-block Only the project owner can archive a project
 
       - if can?(current_user, :change_namespace, @project)
         .ui-box.ui-box-danger
@@ -153,7 +154,7 @@
               .form-actions
                 = f.submit 'Transfer', class: "btn btn-remove"
       - else
-        %p.nothing_here_message Only the project owner can transfer a project
+        .nothing-here-block Only the project owner can transfer a project
 
       .ui-box.ui-box-danger
         .title Rename repository
@@ -185,7 +186,7 @@
 
             = link_to 'Remove project', @project, data: { confirm: remove_project_message(@project) }, method: :delete, class: "btn btn-remove"
       - else
-        %p.nothing_here_message Only project owner can remove a project
+        .nothing-here-block Only project owner can remove a project
 
 .save-project-loader.hide
   %center

app/views/projects/issues/_issues.html.haml

@@ -66,7 +66,7 @@
     = render @issues
     - if @issues.blank?
       %li
-        %h4.nothing_here_message No issues to show
+        .nothing-here-block No issues to show
 
 - if @issues.present?
   .pull-right

app/views/projects/labels/index.html.haml

@@ -7,4 +7,4 @@
 
 - else
   .light-well
-    %h3.nothing_here_message Add first label to your issues or #{link_to 'generate', generate_project_labels_path(@project), method: :post} default set of labels
+    .nothing-here-block Add first label to your issues or #{link_to 'generate', generate_project_labels_path(@project), method: :post} default set of labels

app/views/projects/merge_requests/index.html.haml

@@ -65,7 +65,7 @@
         = render @merge_requests
         - if @merge_requests.blank?
           %li
-            %h4.nothing_here_message No merge requests to show
+            .nothing-here-block No merge requests to show
     - if @merge_requests.present?
       .pull-right
         %span.cgray.pull-right #{@merge_requests.total_count} merge requests for this filter

app/views/projects/merge_requests/show/_commits.html.haml

@@ -29,7 +29,7 @@
             = render "projects/commits/commit", commit: commit, project: @merge_request.source_project
 
 - else
-  %h4.nothing_here_message
+  .nothing-here-block
     Nothing to merge from
     %span.label-branch #{@merge_request.source_branch}
     to

app/views/projects/merge_requests/show/_diffs.html.haml

 - if @merge_request_diff.collected?
   = render "projects/commits/diffs", diffs: @merge_request.diffs, project: @merge_request.source_project
 - elsif @merge_request_diff.empty?
-  %h4.nothing_here_message Nothing to merge from #{@merge_request.source_branch} into #{@merge_request.target_branch}
+  .nothing-here-block Nothing to merge from #{@merge_request.source_branch} into #{@merge_request.target_branch}
 - else
   .bs-callout.bs-callout-warning
     %h4

app/views/projects/milestones/index.html.haml

@@ -26,6 +26,6 @@
 
           - if @milestones.blank?
             %li
-              %h3.nothing_here_message No milestones to show
+              .nothing-here-block No milestones to show
 
       = paginate @milestones, theme: "gitlab"

app/views/projects/milestones/show.html.haml

@@ -3,19 +3,13 @@
   Milestone ##{@milestone.iid}
   %small
     = @milestone.expires_at
-  - if @milestone.closed?
-    %span.state-label.state-label-red Closed
-  - elsif @milestone.expired?
-    %span.state-label.state-label-red Expired
-  - else
-    %span.state-label.state-label-green Open
   .pull-right
     - if can?(current_user, :admin_milestone, @project)
       = link_to edit_project_milestone_path(@project, @milestone), class: "btn btn-grouped" do
         %i.icon-edit
         Edit
       - if @milestone.active?
-        = link_to 'Close Milestone', project_milestone_path(@project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-remove grouped"
+        = link_to 'Close Milestone', project_milestone_path(@project, @milestone, milestone: {state_event: :close }), method: :put, class: "btn btn-remove btn-grouped"
       - else
         = link_to 'Reopen Milestone', project_milestone_path(@project, @milestone, milestone: {state_event: :activate }), method: :put, class: "btn btn-grouped"
 
@@ -29,6 +23,14 @@
 
 
 .issue-box
+  .state
+    - if @milestone.closed?
+      %span.state-label.state-label-red Closed
+    - elsif @milestone.expired?
+      %span.state-label.state-label-red Expired
+    - else
+      %span.state-label.state-label-green Open
+
   %h4.title
     = gfm escape_once(@milestone.title)
 

app/views/projects/protected_branches/index.html.haml

@@ -9,7 +9,7 @@
       %ul
         %li keep stable branches secured
         %li forced code review before merge to protected branches
-      %p Read more about project permissions #{link_to "here", help_permissions_path, class: "underlined_link"}
+      %p Read more about project permissions #{link_to "here", help_permissions_path, class: "underlined-link"}
 
     - if can? current_user, :admin_project, @project
       = form_for [@project, @protected_branch], html: { class: 'form-horizontal' } do |f|

app/views/projects/snippets/index.html.haml

@@ -12,4 +12,4 @@
   = render partial: "projects/snippets/snippet", collection: @snippets
   - if @snippets.empty?
     %li
-      %h3.nothing_here_message Nothing here.
+      .nothing-here-block Nothing here.

app/views/projects/tags/index.html.haml

@@ -18,7 +18,7 @@
   = paginate @tags, theme: 'gitlab'
 
 - else
-  %h3.nothing_here_message
+  .nothing-here-block
     Repository has no tags yet.
     %br
     %small

app/views/public/projects/index.html.haml

@@ -63,6 +63,6 @@
             %i.icon-warning-sign
             Empty repository
     - unless @projects.present?
-      %h3.nothing_here_message No public projects
+      .nothing-here-block No public projects
 
   = paginate @projects, theme: "gitlab"

app/views/shared/_issues.html.haml

@@ -11,5 +11,5 @@
           = render 'projects/issues/issue', issue: issue
   = paginate @issues, theme: "gitlab"
 - else
-  %p.nothing_here_message No issues to show
+  .nothing-here-block No issues to show
 

app/views/shared/_merge_requests.html.haml

@@ -11,4 +11,4 @@
   = paginate @merge_requests, theme: "gitlab"
 
 - else
-  %h3.nothing_here_message No merge requests to show
+  .nothing-here-block No merge requests to show

app/views/snippets/_blob_content.html.haml

@@ -11,4 +11,4 @@
       = render 'shared/file_hljs', blob: @snippet
 - else
   .file-content.code
-    %p.nothing_here_message Empty file
+    .nothing-here-block Empty file

app/views/snippets/_snippets.html.haml

@@ -2,6 +2,6 @@
   = render partial: 'snippet', collection: @snippets
   - if @snippets.empty?
     %li
-      %h3.nothing_here_message Nothing here.
+      .nothing-here-block Nothing here.
 
 = paginate @snippets, theme: 'gitlab'