kallithea Changeset - 228dd29e79da

Changeset - 228dd29e79da

Parent rev.

Child rev.

[Not reviewed]

default

0 2 0

domruf - 8 years ago 2017-10-28 23:35:04
dominikruf@gmail.com

less: clean up changelog style

- use table-layout: fixed
Since we already use a fixed width for the most cells, this makes it easier
(faster) for the browser to render specially big tables.
And it allows to use 'text-overflow: ellipsis'. The old ellipsis settings
have no effect.

- use nowrap and 'text-overflow: ellipsis' for all cells
A table is easier (faster) to read for a user if all the row have the same height.
Therefore don't wrap lines and in case of overflow use ellipsis.

- remove unnecessary height
Up until now the row was bigger then 31px so this had no effect.
And it look wrong to make the row bigger then its content.

- remove unnecessary border-color
bootstrap default is almost the same color

- remove unnecessary text-align
left is the default

- remove font-size or use bootstrap .small
Making fonts too small hurts the readability.

- remove some padding and margin

- don't use special colors
The differences are hardly noticable or in case of the gray dates hurt readability.

- remove obsolete table#changesets .logtags style

2 files changed with 40 insertions and 115 deletions:

kallithea/public/less/kallithea-variables.less

kallithea/public/less/style.less

115

0 comments (0 inline, 0 general)

kallithea/public/less/kallithea-variables.less

➞

Show inline comments

@@ @@ -28,6 +28,7 @@ @@
 @dropdown-link-color:               @navbar-inverse-color;
 @dropdown-bg:                       @navbar-inverse-bg;
 @headings-font-weight:              700;
 @table-cell-padding:                2px 4px;
 /* custom variables */
 @highlight-color:                   #FAFFA6;

kallithea/public/less/style.less

➞

Show inline comments

@@ @@ -360,12 +360,6 @@ h3.files_location { @@
 #changeset_compare_view_content .compare_view_commits td {
   padding: 0px 0px 0px 12px !important;
+}
 td.author {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 210px;
+}
 #graph_nodes {
   position: absolute;
   width: 100px;
@@ @@ -384,115 +378,6 @@ table#changesets tr.mergerow, @@
 table#changesets tr.out-of-range {
   opacity: 0.6;
+}
 table#changesets tr > td {
   height: 31px;
   border-color: #cdcdcd;
   text-align: left;
+}
 table#changesets tr > td.checkbox-column {
   width: 14px;
   font-size: 0.85em;
+}
 table#changesets tr > td.status {
   width: 14px;
   font-size: 0.85em;
+}
 table#changesets tr > td.hash {
   width: 100px;
   font-size: 0.85em;
+}
 table#changesets tr > td.date {
   width: auto !important;
   color: #666;
   font-size: 10px;
   white-space: nowrap;
+}
 table#changesets tr > td.mid {
   width: 100%;
   padding: 0;
+}
 table#changesets .log-container {
   position: relative;
   margin-top: 8px;
+}
 table#changesets tr #singlerange,
 table#changesets tr .changeset_range {
   float: left;
   margin: 2px 0;
+}
 table#changesets tr > td.author img {
   vertical-align: middle;
+}
 table#changesets tr > td.author .user {
   color: #444444;
+}
 table#changesets tr > td.mid .message,
 #graph_content_pr .compare_view_commits .message {
   white-space: nowrap;
   padding: 0;
   overflow: hidden;
+}
 #graph_content_pr .compare_view_commits .message {
   padding: 0 !important;
+}
 table#changesets tr > td.mid .message.expanded,
 #graph_content_pr .compare_view_commits .message.expanded {
   height: auto;
   overflow: initial;
+}
 table#changesets tr .extra-container {
   display: block;
   position: absolute;
   top: 0;
   right: 0;
+}
 .comments-container,
 table#changesets .logtags {
   display: block;
   float: left;
   overflow: hidden;
   padding: 0;
   margin: 0;
   white-space: nowrap;
+}
 table#changesets .tagcontainer {
   width: 80px;
   position: relative;
   float: right;
   height: 100%;
   top: 7px;
   margin-left: 0.5em;
+}
 table#changesets .logtags {
   min-width: 80px;
   height: 1.1em;
   position: absolute;
   left: 0px;
   width: auto;
   top: 0px;
+}
 table#changesets .logtags.tags {
   top: 14px;
+}
 table#changesets .logtags:hover {
   overflow: visible;
   position: absolute;
   width: auto;
   right: 0;
   left: initial;
+}
 table#changesets .logtags .booktag,
 table#changesets .logtags .tagtag {
   float: left;
   line-height: 1em;
   margin-bottom: 1px;
   margin-right: 1px;
   padding: 1px 3px;
   font-size: 10px;
+}
 table#changesets tr > td.mid .message a:hover {
   text-decoration: none;
+}
 #updaterevs-graph {
   position: relative;
   width: 40px;
@@ @@ -892,6 +777,45 @@ div.comment-prev-next-links div.next-com @@
   margin-left: 100px;
+}
 /* changelog table columns */
 .table#changesets {
   table-layout: fixed;
   td {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+  }
   .checkbox-column {
     width: 24px;
     /* the optional second checkbox will be inline-block but should wrap to a new line */
     white-space: normal;
+  }
   .changeset-logical-index,
   .expand_commit,
   .status {
     width: 28px;
+  }
   .author {
     width: 200px;
+  }
   .hash {
     .small;
     width: 110px;
+  }
   .date {
     .small;
     width: 100px;
+  }
   .mid > .log-container {
     position: relative;
     > .extra-container {
       position: absolute;
       top: 0;
       right: 0;
+    }
+  }
+}
 /* undo Bootstrap chrome/webkit blue outline on focus in navbar */
 .navbar-inverse .navbar-nav > li > a:focus {
   outline: 0;

0 comments (0 inline, 0 general)