Dont override default table with bootstrap class. Refactor table css

Dmitriy Zaporozhets
1 parent 550c1828
Showing 7 changed files with 31 additions and 96 deletions Show diff stats
app/assets/stylesheets/gitlab_bootstrap.scss
app/assets/stylesheets/gitlab_bootstrap/files.scss
app/assets/stylesheets/gitlab_bootstrap/mixins.scss
app/assets/stylesheets/gitlab_bootstrap/tables.scss
app/assets/stylesheets/sections/tree.scss
app/views/projects/tree/_tree.html.haml
app/views/projects/tree/_tree_item.html.haml
@@ -62,6 +62,5 @@ $baseLineHeight: 18px !default;
 @import "gitlab_bootstrap/buttons.scss";
 @import "gitlab_bootstrap/blocks.scss";
 @import "gitlab_bootstrap/files.scss";
-@import "gitlab_bootstrap/tables.scss";
 @import "gitlab_bootstrap/lists.scss";
 @import "gitlab_bootstrap/forms.scss";
@@ -6,6 +6,10 @@
   border: 1px solid #CCC;
   margin-bottom: 1em;
  
+  table {
+    @extend .table;
+  }
+
   .file-title {
     border-bottom: 1px solid #bbb;
     @include bg-dark-gray-gradient;
@@ -95,6 +95,14 @@
     font-size: 14px;
     line-height: 1.5;
   }
+
+  table {
+    @extend .table;
+    @extend .table-bordered;
+    th {
+      background: #EEE;
+    }
+  }
 }
  
 @mixin page-title {
@@ -1,68 +0,0 @@
-table {
-  @extend .table;
-  @extend .table-striped;
-  border: 1px solid #CCC;
-  width: 100%;
-
-  &.low {
-    td {
-      line-height: 18px;
-    }
-  }
-
-  &.headless {
-    tr:first-child td{
-      border-top: 1px solid #CCC;
-    }
-  }
-
-  th {
-    font-weight: normal;
-    font-size: 15px;
-    vertical-align: middle;
-    border-bottom: 1px solid #CCC;
-    text-shadow: 0 1px 1px #fff;
-
-    ul.nav {
-      text-shadow: none;
-      margin: 0;
-    }
-  }
-
-  th, td {
-    padding: 10px;
-    line-height: 18px;
-    text-align: left;
-  }
-
-  td {
-    border-color: #f1f1f1;
-    line-height: 28px;
-
-    .s16 {
-      margin-top: 5px;
-      margin-right: 5px;
-    }
-
-    &:first-child {
-      border-left: 1px solid #CCC;
-    }
-
-    &:last-child {
-      border-right: 1px solid #CCC;
-    }
-  }
-
-  &.bordered {
-    @extend .table-bordered;
-  }
-
-  &.lite {
-    border: none;
-    box-shadow: none;
-    tr, td {
-      border: none;
-      background:none !important;
-    }
-  }
-}
@@ -13,13 +13,21 @@
   }
  
   .tree-table {
+    @extend .table;
     @include border-radius(0);
-    .tree-item {
-      td {
+
+    tr {
+      td, th {
         padding: 8px 10px;
-        strong {
-          font-weight: normal;
-        }
+        line-height: 20px;
+      }
+      th {
+        font-weight: normal;
+        font-size: 15px;
+        border-bottom: 1px solid #CCC;
+      }
+      td {
+        border-color: #F1F1F1;
       }
       &:hover {
         td {
@@ -29,12 +37,11 @@
         }
         cursor: pointer;
       }
-
       &.selected {
         td {
-          background: $hover;
-          border-top: 1px solid #ADF;
-          border-bottom: 1px solid #ADF;
+          background: #f5f5f5;
+          border-top: 1px solid #EEE;
+          border-bottom: 1px solid #EEE;
         }
       }
     }
@@ -56,21 +63,6 @@
     }
   }
  
-  .tree-table {
-    border: none;
-
-    th .btn {
-      margin: -2px -1px;
-      padding: 2px 10px;
-    }
-    td {
-      line-height: 20px;
-      background: #fff;
-      border-left: none;
-      border-right: none;
-    }
-  }
-
   .tree_author {
     padding-right: 8px;
  
@@ -125,4 +117,4 @@
 .tree-ref-holder {
   float: left;
   margin-top: 5px;
-}
 \ No newline at end of file
+}
@@ -26,7 +26,7 @@
             = link_to @commit.short_id, project_commit_path(@project, @commit)
             &ndash;
             = truncate(@commit.title, length: 50)
-        %th= link_to "history", project_commits_path(@project, @id), class: "btn btn-tiny pull-right"
+        %th= link_to "history", project_commits_path(@project, @id), class: "pull-right"
  
     - if tree.up_dir?
       %tr.tree-item
 %tr{ class: "tree-item #{tree_hex_class(tree_item)}" }
   %td.tree-item-file-name
     = tree_icon(type)
-    %strong= link_to truncate(tree_item.name, length: 40), project_tree_path(@project, tree_join(@id || @commit.id, tree_item.name))
+    %span= link_to truncate(tree_item.name, length: 40), project_tree_path(@project, tree_join(@id || @commit.id, tree_item.name))
   %td.tree_time_ago.cgray
     %span.log_loading.hide
       Loading commit data...
...	...	@@ -62,6 +62,5 @@ $baseLineHeight: 18px !default;
62	62	@import "gitlab_bootstrap/buttons.scss";
63	63	@import "gitlab_bootstrap/blocks.scss";
64	64	@import "gitlab_bootstrap/files.scss";
65		-@import "gitlab_bootstrap/tables.scss";
66	65	@import "gitlab_bootstrap/lists.scss";
67	66	@import "gitlab_bootstrap/forms.scss";
...	...
...	...	@@ -6,6 +6,10 @@
6	6	border: 1px solid #CCC;
7	7	margin-bottom: 1em;
8	8
	9	+ table {
	10	+ @extend .table;
	11	+ }
	12	+
9	13	.file-title {
10	14	border-bottom: 1px solid #bbb;
11	15	@include bg-dark-gray-gradient;
...	...
...	...	@@ -95,6 +95,14 @@
95	95	font-size: 14px;
96	96	line-height: 1.5;
97	97	}
	98	+
	99	+ table {
	100	+ @extend .table;
	101	+ @extend .table-bordered;
	102	+ th {
	103	+ background: #EEE;
	104	+ }
	105	+ }
98	106	}
99	107
100	108	@mixin page-title {
...	...
...	...	@@ -1,68 +0,0 @@
1		-table {
2		- @extend .table;
3		- @extend .table-striped;
4		- border: 1px solid #CCC;
5		- width: 100%;
6		-
7		- &.low {
8		- td {
9		- line-height: 18px;
10		- }
11		- }
12		-
13		- &.headless {
14		- tr:first-child td{
15		- border-top: 1px solid #CCC;
16		- }
17		- }
18		-
19		- th {
20		- font-weight: normal;
21		- font-size: 15px;
22		- vertical-align: middle;
23		- border-bottom: 1px solid #CCC;
24		- text-shadow: 0 1px 1px #fff;
25		-
26		- ul.nav {
27		- text-shadow: none;
28		- margin: 0;
29		- }
30		- }
31		-
32		- th, td {
33		- padding: 10px;
34		- line-height: 18px;
35		- text-align: left;
36		- }
37		-
38		- td {
39		- border-color: #f1f1f1;
40		- line-height: 28px;
41		-
42		- .s16 {
43		- margin-top: 5px;
44		- margin-right: 5px;
45		- }
46		-
47		- &:first-child {
48		- border-left: 1px solid #CCC;
49		- }
50		-
51		- &:last-child {
52		- border-right: 1px solid #CCC;
53		- }
54		- }
55		-
56		- &.bordered {
57		- @extend .table-bordered;
58		- }
59		-
60		- &.lite {
61		- border: none;
62		- box-shadow: none;
63		- tr, td {
64		- border: none;
65		- background:none !important;
66		- }
67		- }
68		-}
...	...	@@ -13,13 +13,21 @@
13	13	}
14	14
15	15	.tree-table {
	16	+ @extend .table;
16	17	@include border-radius(0);
17		- .tree-item {
18		- td {
	18	+
	19	+ tr {
	20	+ td, th {
19	21	padding: 8px 10px;
20		- strong {
21		- font-weight: normal;
22		- }
	22	+ line-height: 20px;
	23	+ }
	24	+ th {
	25	+ font-weight: normal;
	26	+ font-size: 15px;
	27	+ border-bottom: 1px solid #CCC;
	28	+ }
	29	+ td {
	30	+ border-color: #F1F1F1;
23	31	}
24	32	&:hover {
25	33	td {
...	...	@@ -29,12 +37,11 @@
29	37	}
30	38	cursor: pointer;
31	39	}
32		-
33	40	&.selected {
34	41	td {
35		- background: $hover;
36		- border-top: 1px solid #ADF;
37		- border-bottom: 1px solid #ADF;
	42	+ background: #f5f5f5;
	43	+ border-top: 1px solid #EEE;
	44	+ border-bottom: 1px solid #EEE;
38	45	}
39	46	}
40	47	}
...	...	@@ -56,21 +63,6 @@
56	63	}
57	64	}
58	65
59		- .tree-table {
60		- border: none;
61		-
62		- th .btn {
63		- margin: -2px -1px;
64		- padding: 2px 10px;
65		- }
66		- td {
67		- line-height: 20px;
68		- background: #fff;
69		- border-left: none;
70		- border-right: none;
71		- }
72		- }
73		-
74	66	.tree_author {
75	67	padding-right: 8px;
76	68
...	...	@@ -125,4 +117,4 @@
125	117	.tree-ref-holder {
126	118	float: left;
127	119	margin-top: 5px;
128		-}
129	120	\ No newline at end of file
	121	+}
...	...
...	...	@@ -26,7 +26,7 @@
26	26	= link_to @commit.short_id, project_commit_path(@project, @commit)
27	27	–
28	28	= truncate(@commit.title, length: 50)
29		- %th= link_to "history", project_commits_path(@project, @id), class: "btn btn-tiny pull-right"
	29	+ %th= link_to "history", project_commits_path(@project, @id), class: "pull-right"
30	30
31	31	- if tree.up_dir?
32	32	%tr.tree-item
...	...
1	1	%tr{ class: "tree-item #{tree_hex_class(tree_item)}" }
2	2	%td.tree-item-file-name
3	3	= tree_icon(type)
4		- %strong= link_to truncate(tree_item.name, length: 40), project_tree_path(@project, tree_join(@id \|\| @commit.id, tree_item.name))
	4	+ %span= link_to truncate(tree_item.name, length: 40), project_tree_path(@project, tree_join(@id \|\| @commit.id, tree_item.name))
5	5	%td.tree_time_ago.cgray
6	6	%span.log_loading.hide
7	7	Loading commit data...
...	...