Skip to content

G
gitlab-ce
Commit 809413d9 authored by Dmitriy Zaporozhets's avatar Dmitriy Zaporozhets
Browse files
Options

minimalistic UI: issues index, css refactoring

parent ffc6ab41
Hide whitespace changes
Inline Side-by-side
Showing with 279 additions and 268 deletions
app/assets/stylesheets/common.scss
View file @ 809413d9
$text_color:#222;
$lite_text_color: #666;
$link_color:#FFF;
$link_color:#111;
$active_link_color:#2FA0BB;
$active_bg_color:#79C3E0;
$active_bd_color: #2FA0BB;
$border_color:#FFF;
$border_color:#CCC;
$lite_border_color:#EEE;
$app_width:980px;
$app_padding:20px;
$bg_color: #FFF;
......@@ -95,6 +96,9 @@ body.collapsed {
}
}
a {
color: $link_color;
}
@import "style.scss";
@import "projects.css.scss";
......@@ -108,3 +112,4 @@ body.collapsed {
@import "top_panel.scss";
@import "dashboard.scss";
@import "tree.scss";
app/assets/stylesheets/dashboard.scss
View file @ 809413d9
......@@ -3,24 +3,28 @@ body.dashboard-page header{margin-bottom: 0}
body.dashboard-page .news-feed{margin-left: 285px; min-height: 600px; margin-top: 20px; margin-right:2px; padding:20px;}
body.dashboard-page .dashboard-content{ position: relative; float: left; width: 100%; height: 100%; }
body.dashboard-page .news-feed h2{float: left;}
body.dashboard-page aside{ min-height: 820px; position: relative; top: 0; bottom: 0; right: 0; width: 260px; float: left; border-right: 1px solid #ccc; padding:20px; padding-right:0; }
body.dashboard-page aside h4{margin: 0; border-bottom: 1px solid #ccc; padding: 20px 20px 20px 0px; font-size: 11px; font-weight: bold; text-transform: uppercase;}
body.dashboard-page aside h4 a.button-small{float: right; text-transform: none; border-radius: 4px; margin-right: 2%; margin-top: -4px; display: block;}
body.dashboard-page aside .project-list {list-style: none; margin: 0; padding: 0;}
body.dashboard-page aside .project-list li a {background: white; color: #{$blue_link}; display: block; border-bottom: 1px solid #eee; padding: 14px 6% 14px 0px;}
//body.dashboard-page aside .project-list li a:hover {background: #f1f1f1}
//body.dashboard-page aside .project-list li a:hover span.arrow{background-color: #E3E5EA;}
body.dashboard-page aside .project-list li a span.project-name{font-size: 14px; display: block; margin-bottom: 8px}
body.dashboard-page aside .project-list li a span.time{color: #666; font-weight: normal; font-size: 11px}
body.dashboard-page aside .project-list li a span.arrow{float: right; background: #E3E5EA; padding: 10px; border-radius: 5px; margin-top: 2px; text-shadow: none; color: #999}
body.dashboard-page .news-feed .project-updates {margin-bottom: 20px; display: block; width: 100%;}
body.dashboard-page .news-feed .project-updates .data{ padding: 0}
body.dashboard-page .news-feed .project-updates a.project-update {padding: 10px; overflow: hidden; display: block;}
body.dashboard-page .news-feed .project-updates a.project-update:last-child{border-bottom: 0}
body.dashboard-page .news-feed .project-updates a.project-update img{float: left; margin-right: 10px;}
body.dashboard-page .news-feed .project-updates a.project-update span.update-title, .dashboard-page .news-feed .project-updates li a span.update-author{display: block;}
body.dashboard-page .news-feed .project-updates a.project-update span.update-title{margin-bottom: 10px}
body.dashboard-page .news-feed .project-updates a.project-update span.update-author{color: #999; font-weight: normal; font-style: italic;}
body.dashboard-page .news-feed .project-updates a.project-update span.update-author strong{font-weight: bold; font-style: normal;}
body.dashboard-page aside{
min-height: 820px; position: relative; top: 0; bottom: 0; right: 0; width: 260px; float: left; border-right: 1px solid $border_color; padding:20px; padding-right:0;
h4{margin: 0; border-bottom: 1px solid #ccc; padding: 20px 20px 20px 0px; font-size: 11px; font-weight: bold; text-transform: uppercase;}
h4 a.button-small{float: right; text-transform: none; border-radius: 4px; margin-right: 2%; margin-top: -4px; display: block;}
.project-list {list-style: none; margin: 0; padding: 0;}
.project-list li a {background: white; color: #{$blue_link}; display: block; border-bottom: 1px solid $lite_border_color; padding: 14px 6% 14px 0px;}
.project-list li a span.project-name{font-size: 14px; display: block; margin-bottom: 8px}
.project-list li a span.time{color: #666; font-weight: normal; font-size: 11px}
.project-list li a span.arrow{float: right; background: #E3E5EA; padding: 10px; border-radius: 5px; margin-top: 2px; text-shadow: none; color: #999}
}
body.dashboard-page .news-feed .project-updates {
margin-bottom: 20px; display: block; width: 100%;
.data{ padding: 0}
a.project-update {padding: 10px; overflow: hidden; display: block;}
a.project-update:last-child{border-bottom: 0}
a.project-update img{float: left; margin-right: 10px;}
a.project-update span.update-title, .dashboard-page .news-feed .project-updates li a span.update-author{display: block;}
a.project-update span.update-title{margin-bottom: 10px}
a.project-update span.update-author{color: #999; font-weight: normal; font-style: italic;}
a.project-update span.update-author strong{font-weight: bold; font-style: normal;}
}
/* eo Dashboard Page */
app/assets/stylesheets/issues.css.scss
View file @ 809413d9
......@@ -72,3 +72,13 @@ body.project-page .edit_snippet table td
}
}
#issues-table {
tr {
border-top: 1px solid $lite_border_color;
&:first-child {
border:none;
}
}
}
app/assets/stylesheets/projects.css.scss
View file @ 809413d9
......@@ -26,7 +26,7 @@ body.project-page .project-sidebar {
padding: $app_padding;
padding-right:0px;
margin: 0;
border-right: 1px solid #ddd;
border-right: 1px solid $border_color;
}
body.projects-page input.text.git-url { font-size: 12px; border-radius: 5px; color: #666; box-shadow: 0 1px 2px rgba(0,0,0,.2) inset; padding: 8px 0 8px 30px; margin-bottom: 20px; background: white url('images.png') no-repeat 8px -40px; width: 136px}
......@@ -95,90 +95,7 @@ table.round-borders {
text-align: left;
}
a {
color: #111;
}
/** FILE CONTENT VIEW **/
.view_file_content{
.old_line, .new_line {
background:#ECECEC;
color:#777;
width:15px;
float:left;
padding: 0px 10px;
border-right: 1px solid #ccc;
}
.old_line{
display:none;
}
}
.view_file .view_file_header,
.diff_file .diff_file_header {
background-image: -webkit-gradient(linear, 0 0, 0 26, color-stop(0.076, #fefefe), to(#F6F7F8));
background-image: -webkit-linear-gradient(#fefefe 7.6%, #F6F7F8);
background-image: -moz-linear-gradient(#fefefe 7.6%, #F6F7F8);
background-image: -o-linear-gradient(#fefefe 7.6%, #F6F7F8);
margin: 0;
font-weight: normal;
font-weight: bold;
text-align: left;
color: #666;
border-bottom: 1px solid #DEE2E3;
padding: 7px 10px;
}
.view_file {
border:1px solid #CCC;
margin-bottom:1em;
.view_file_content {
background:#fff;
color:#514721;
font-size: 11px;
}
.view_file_content_image {
background:#eee;
text-align:center;
img {
padding:100px;
max-width:300px;
}
}
}
td.code {
width: 100%;
.highlight {
margin-left: 55px;
overflow:auto;
overflow-y:hidden;
border-left: 1px solid #DEE2E3;
background: white;
}
}
.highlight pre {
white-space: pre;
word-wrap:normal;
}
table.highlighttable {
border: none;
background: #F7F7F7;
}
body.project-page table.highlighttable td { border: none }
table.highlighttable tr:hover { background:none;}
table.highlighttable pre{
line-height:16px !important;
font-size:12px !important;
}
table.highlighttable .linenodiv pre {
text-align: right;
padding-right: 4px;
}
/** PROJECTS **/
input.ssh_project_url {
......@@ -204,68 +121,6 @@ input.ssh_project_url {
clear: both;
}
/** FORM INPUTS **/
.new_merge_request,
.edit_merge_request,
.user_new,
.new_key,
.new_issue,
.new_note,
.edit_user,
.edit_issue,
.new_project,
.new_snippet,
.edit_snippet,
.edit_project {
input[type='text'],
input[type='email'],
input[type='password'],
textarea {
width:400px;
padding:8px;
font-size:14px;
@include round-borders-all(4px);
}
}
.text_field {
width:400px;
padding:8px;
font-size:14px;
@include round-borders-all(4px);
}
.input_button {
padding:8px;
font-size:14px;
cursor:pointer;
background-color: #F5F5F5;
border-color: #EEEEEE #DEDEDE #DEDEDE #EEEEEE;
border-right: 1px solid #DEDEDE;
border-style: solid;
border-width: 1px;
}
/** FLASH **/
#flash_container {
height:45px;
position:fixed;
z-index:10001;
top:0px;
width:100%;
margin-bottom:15px;
overflow:hidden;
background:white;
cursor:pointer;
border-bottom:1px solid #777;
h4 {
color:#444;
font-size:22px;
padding-top:5px;
margin:2px;
}
}
/** Buttons **/
.lbutton,
......@@ -434,7 +289,8 @@ body.project-page table .commit {
}
#holder {
border: solid 1px #999;
background:#FAFAFA;
border: 1px solid #EEE;
cursor: move;
height: 70%;
overflow: hidden;
......@@ -673,20 +529,6 @@ h4.dash-tabs {
color: white;
}
.rss-icon {
margin:0 15px;
padding:5px;
border:1px solid #ccc;
border-radius:3px;
float:left;
}
body.project-page h2.icon.loading {
span {
background-position: 0px 0px;
background: url("ajax-loader-tree.gif") no-repeat;
}
}
.dark_scheme_box {
padding:20px 0;
......@@ -718,24 +560,6 @@ a.project-update.titled {
padding: 6px 12px;
}
.tree_progress {
float:left;
width:16px;
height:16px;
margin:6px;
&.loading {
background-position: 0px 0px;
background: url("ajax-loader-facebook.gif") no-repeat;
}
}
#tree-breadcrumbs {
h2 {
margin:0;
margin-bottom:20px;
float:left;
}
}
tr.line_notes_row {
&:hover {
......@@ -764,9 +588,3 @@ tr.line_notes_row {
}
}
}
app/assets/stylesheets/style.scss
View file @ 809413d9
......@@ -646,12 +646,70 @@ body.projects-page .browse-code{margin-right: 10px}
h2, h3 { page-break-after: avoid; }
}
/**
* author:DZ
* date: Nov 09
* fix different fonts for firefox & webkit
*/
body, button, input, select, textarea {
font-family: "Helvetica", sans-serif;
}
/** FORM INPUTS **/
.new_merge_request,
.edit_merge_request,
.user_new,
.new_key,
.new_issue,
.new_note,
.edit_user,
.edit_issue,
.new_project,
.new_snippet,
.edit_snippet,
.edit_project {
input[type='text'],
input[type='email'],
input[type='password'],
textarea {
width:400px;
padding:8px;
font-size:14px;
@include round-borders-all(4px);
}
}
.text_field {
width:400px;
padding:8px;
font-size:14px;
@include round-borders-all(4px);
}
.input_button {
padding:8px;
font-size:14px;
cursor:pointer;
background-color: #F5F5F5;
border-color: #EEEEEE #DEDEDE #DEDEDE #EEEEEE;
border-right: 1px solid #DEDEDE;
border-style: solid;
border-width: 1px;
}
/** FLASH **/
#flash_container {
height:45px;
position:fixed;
z-index:10001;
top:0px;
width:100%;
margin-bottom:15px;
overflow:hidden;
background:white;
cursor:pointer;
border-bottom:1px solid #777;
h4 {
color:#444;
font-size:22px;
padding-top:5px;
margin:2px;
}
}
app/assets/stylesheets/top_panel.scss
View file @ 809413d9
......@@ -144,3 +144,11 @@ body header {
}
}
}
.rss-icon {
margin:0 15px;
padding:5px;
border:1px solid #ccc;
border-radius:3px;
float:left;
}
app/assets/stylesheets/tree.scss 0 → 100644
View file @ 809413d9
#tree-breadcrumbs {
div {
margin:0;
margin-bottom:20px;
float:left;
font-size:14px;
}
}
.tree_progress {
float:left;
width:16px;
height:16px;
margin:2px 6px;
&.loading {
background-position: 0px 0px;
background: url("ajax-loader-facebook.gif") no-repeat;
}
}
/** FILE CONTENT VIEW **/
.view_file_content{
.old_line, .new_line {
background:#ECECEC;
color:#777;
width:15px;
float:left;
padding: 0px 10px;
border-right: 1px solid #ccc;
}
.old_line{
display:none;
}
}
.view_file .view_file_header,
.diff_file .diff_file_header {
background-image: -webkit-gradient(linear, 0 0, 0 26, color-stop(0.076, #fefefe), to(#F6F7F8));
background-image: -webkit-linear-gradient(#fefefe 7.6%, #F6F7F8);
background-image: -moz-linear-gradient(#fefefe 7.6%, #F6F7F8);
background-image: -o-linear-gradient(#fefefe 7.6%, #F6F7F8);
margin: 0;
font-weight: normal;
font-weight: bold;
text-align: left;
color: #666;
border-bottom: 1px solid #DEE2E3;
padding: 7px 10px;
.mode_text,
.file_icon {
margin-right:15px;
padding-right:15px;
border-right:1px solid $lite_border_color;
float:left;
color:#aaa;
}
.file_icon {
padding-left:15px;
}
}
.view_file {
border:1px solid #CCC;
margin-bottom:1em;
.view_file_content {
background:#fff;
color:#514721;
font-size: 11px;
}
.view_file_content_image {
background:#eee;
text-align:center;
img {
padding:100px;
max-width:300px;
}
}
}
td.code {
width: 100%;
.highlight {
margin-left: 55px;
overflow:auto;
overflow-y:hidden;
border-left: 1px solid #DEE2E3;
background: white;
}
}
.highlight pre {
white-space: pre;
word-wrap:normal;
}
table.highlighttable {
border: none;
background: #F7F7F7;
}
body.project-page table.highlighttable td { border: none }
table.highlighttable tr:hover { background:none;}
table.highlighttable pre{
line-height:16px !important;
font-size:12px !important;
}
table.highlighttable .linenodiv pre {
text-align: right;
padding-right: 4px;
color:#888;
}
app/decorators/tree_decorator.rb
View file @ 809413d9
......@@ -6,7 +6,7 @@ class TreeDecorator < ApplicationDecorator
part_path = ""
parts = path.split("\/")
parts = parts[0...-1] if is_blob?
#parts = parts[0...-1] if is_blob?
yield(h.link_to("..", "#", :remote => :true)) if parts.count > max_links
......
app/views/issues/index.html.haml
View file @ 809413d9
.top-tabs
= link_to project_issues_path(@project), :class => "tab #{'active' if current_page?(project_issues_path(@project)) }" do
%span
Issues
-#= link_to project_issues_path(@project), :class => "tab" do
%span
Milestones
- if current_page?(project_issues_path(@project))
- if can? current_user, :write_issue, @project
= link_to new_project_issue_path(@project), :class => "add_new", :title => "New Issue", :remote => true do
= image_tag "add_new.png", :width => 14
- if current_user.private_token
= content_for :rss_icon do
.rss-icon
......@@ -5,32 +20,29 @@
= image_tag "rss_icon_gray.png", :width => 16, :title => "feed"
%div#issues-table-holder
%table.round-borders#issues-table
%thead
%th
.top_panel_issues
- if can? current_user, :write_issue, @project
%div{:class => "left", :style => "margin-right: 10px;" }
= link_to 'New Issue', new_project_issue_path(@project), :remote => true, :class => "grey-button", :style => "margin-top:5px;"
= form_tag search_project_issues_path(@project), :method => :get, :remote => true, :class => :left, :id => "issue_search_form" do
= hidden_field_tag :project_id, @project.id, { :id => 'project_id' }
= search_field_tag :issue_search, nil, { :placeholder => 'Search', :class => 'issue_search' }
.top_panel_issues
= form_tag search_project_issues_path(@project), :method => :get, :remote => true, :class => :left, :id => "issue_search_form" do
= hidden_field_tag :project_id, @project.id, { :id => 'project_id' }
= search_field_tag :issue_search, nil, { :placeholder => 'Search', :class => 'issue_search' }
.right.issues_filter
= form_tag project_issues_path(@project), :method => :get do
.left
= radio_button_tag :f, 0, (params[:f] || "0") == "0", :onclick => "setIssueFilter(this.form, 0)", :id => "open_issues", :class => "status"
= label_tag "open_issues","Open"
.left
= radio_button_tag :f, 2, params[:f] == "2", :onclick => "setIssueFilter(this.form, 2)", :id => "closed_issues", :class => "status"
= label_tag "closed_issues","Closed"
.left
= radio_button_tag :f, 3, params[:f] == "3", :onclick => "setIssueFilter(this.form, 3)", :id => "my_issues", :class => "status"
= label_tag "my_issues","To Me"
.left
= radio_button_tag :f, 1, params[:f] == "1", :onclick => "setIssueFilter(this.form, 1)", :id => "all_issues", :class => "status"
= label_tag "all_issues","All"
.right.issues_filter
= form_tag project_issues_path(@project), :method => :get do
.left
= radio_button_tag :f, 0, (params[:f] || "0") == "0", :onclick => "setIssueFilter(this.form, 0)", :id => "open_issues", :class => "status"
= label_tag "open_issues","Open"
.left
= radio_button_tag :f, 2, params[:f] == "2", :onclick => "setIssueFilter(this.form, 2)", :id => "closed_issues", :class => "status"
= label_tag "closed_issues","Closed"
.left
= radio_button_tag :f, 3, params[:f] == "3", :onclick => "setIssueFilter(this.form, 3)", :id => "my_issues", :class => "status"
= label_tag "my_issues","To Me"
.left
= radio_button_tag :f, 1, params[:f] == "1", :onclick => "setIssueFilter(this.form, 1)", :id => "all_issues", :class => "status"
= label_tag "all_issues","All"
.clear
%hr
%table.no-borders#issues-table
= render "issues"
%br
:javascript
......
app/views/layouts/_head_panel.html.haml
View file @ 809413d9
......@@ -9,8 +9,6 @@
= link_to admin_root_path, :class => "admin", :title => "Admin" do
= image_tag "Gear-UI.PNG", :width => 20
- if project_layout
.project_name
= truncate @project.name, :length => 28
......@@ -24,7 +22,7 @@
- elsif profile_layout
.dashboard_links
= link_to "Activities", dashboard_path, :class => "#{"active" if current_page?(dashboard_path) || current_page?(root_path) }"
= link_to "Projects", projects_path, :class => "#{"active" if current_page?(projects_path)}"
-#= link_to "Projects", projects_path, :class => "#{"active" if current_page?(projects_path)}"
= link_to "Issues", dashboard_issues_path, :class => "#{"active" if current_page?(dashboard_issues_path)}", :id => "issues_slide"
= link_to "Merge Requests", dashboard_merge_requests_path, :class => "#{"active" if current_page?(dashboard_merge_requests_path)}", :id => "merge_requests_slide"
.search
......
app/views/layouts/project.html.haml
View file @ 809413d9
......@@ -32,16 +32,12 @@
= link_to "Network", graph_project_path(@project), :class => current_page?(:controller => "projects", :action => "graph", :id => @project) ? "current" : nil
= link_to project_issues_filter_path(@project), :class => (controller.controller_name == "issues") ? "current" : nil do
Issues
-#- if @project.issues.open_for(current_user).count > 0
%span{ :class => "number" }= @project.issues.open_for(current_user).count
= link_to wall_project_path(@project), :class => current_page?(:controller => "projects", :action => "wall", :id => @project) ? "current" : nil do
Wall
- if @project.common_notes.today.count > 0
%span{ :class => "number" }= @project.common_notes.today.count
= link_to project_merge_requests_path(@project), :class => (controller.controller_name == "merge_requests") ? "current" : nil do
Requests
-#- if @project.merge_requests.opened.count > 0
%span{ :class => "number" }= @project.merge_requests.opened.count
......
app/views/projects/_side_panel.html.haml deleted 100644 → 0
View file @ ffc6ab41
%h3.notice{:style => "width:235px;"}
= @project.name
%p
%b Path:
= @project.path
%p
%b Description:
= truncate @project.description
.left.append-bottom
= link_to "Tree", tree_project_path(@project), :class => "button"
= link_to "Commits", project_commits_path(@project), :class => "button"
= link_to 'Team', team_project_path(@project), :class => "button"
- if can? current_user, :admin_project, @project
= link_to 'Edit', edit_project_path(@project), :class => "button positive"
app/views/projects/graph.html.haml
View file @ 809413d9
%h2.icon
%span>
Network Graph
.clear
.top-tabs
= link_to graph_project_path(@project), :class => "tab #{'active' if current_page?(graph_project_path(@project)) }" do
%span
Network Graph
#holder.graph
:javascript
......
app/views/refs/_tree.html.haml
View file @ 809413d9
#tree-breadcrumbs
%h2
%div
= link_to tree_project_ref_path(@project, @ref, :path => nil), :remote => true do
= @project.code
- tree.breadcrumbs(4) do |link|
- tree.breadcrumbs(6) do |link|
\/
= link
&nbsp;
......@@ -19,7 +19,7 @@
%th Last Update
%th
Last commit
= link_to "history", tree.history_path, :class => "right"
= link_to "History", tree.history_path, :class => "right"
- if tree.up_dir?
%tr{ :class => "tree-item", :url => tree.up_dir_path }
......
app/views/refs/_tree_file.html.haml
View file @ 809413d9
......@@ -2,10 +2,11 @@
.view_file
.view_file_header
%strong
= name
%span.file_icon= image_tag "txt.png"
%span.mode_text= file.mode
%span.file_name= name
= link_to "raw", blob_project_ref_path(@project, @ref, :path => params[:path] ), :class => "right", :target => "_blank"
= link_to "history", project_commits_path(@project, :path => params[:path], :ref => @ref ), :class => "right", :style => "margin-right:10px;"
-#= switch_colorscheme_link(:class => "right", :style => "margin-right:10px;color:orange")
%br/
- if file.text?
.view_file_content
......
app/views/refs/_tree_item.html.haml
View file @ 809413d9
......@@ -8,7 +8,7 @@
- else
= image_tag "dir.png"
= link_to truncate(content.name, :length => 40), tree_file_project_ref_path(@project, @ref || @commit.id, file), :remote => :true
%td
%td.cgray
= time_ago_in_words(content_commit.committed_date)
ago
%td.commit
......
spec/support/shared_examples.rb
View file @ 809413d9
......@@ -11,7 +11,7 @@ shared_examples_for :tree_view do
it "should have Tree View of project" do
should have_content("app")
should have_content("history")
should have_content("History")
should have_content("Gemfile")
end
end
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7