Changeset - 8ba69bf9236e
[Not reviewed]
default
0 2 0
Mads Kiilerich - 8 years ago 2018-01-03 03:45:35
mads@kiilerich.com
style: fix changeset tag container - fix vertical alignment of right aligned tags

Tags and comment count were not aligned with the line text at all, and a solid
background were hiding the separator lines and made it look even more messy.

extra-container and comments-container are now simplified with top right
positioning and less margin tweaking.

Minimal changes to the tags - just touching some external sizing so it fits in
the container: line-height and margin.
2 files changed with 2 insertions and 14 deletions:
0 comments (0 inline, 0 general)
kallithea/public/less/kallithea-tags.less
Show inline comments
 
@@ -16,203 +16,201 @@
 
  background-color: #AEA;
 
}
 
.metatag[data-tag="requires"] {
 
  background-color: #9CF;
 
}
 
.metatag[data-tag="recommends"] {
 
  background-color: #BDF;
 
}
 
.metatag[data-tag="lang"] {
 
  background-color: #FAF474;
 
}
 
.metatag[data-tag="license"] {
 
  border: solid 1px #9CF;
 
  background-color: #DEF;
 
}
 
.metatag[data-tag="see"] {
 
  border: solid 1px #CBD;
 
  background-color: #EDF;
 
}
 
a.metatag[data-tag="license"]:hover {
 
  background-color: #577632;
 
  color: #FFF;
 
  text-decoration: none;
 
}
 

	
 
#perms .perm_tag {
 
  position: relative;
 
  top: -2px;
 
  margin-left: 3px;
 
  padding: 3px 3px 1px 3px;
 
  font-size: 10px;
 
  font-weight: bold;
 
  text-transform: uppercase;
 
  white-space: nowrap;
 
  border-radius: 3px;
 
  &.admin {
 
    background-color: #B94A48;
 
    color: #ffffff;
 
  }
 
  &.write {
 
      background-color: #DB7525;
 
      color: #ffffff;
 
  }
 
  &.read {
 
      background-color: #468847;
 
      color: #ffffff;
 
  }
 
  &.none {
 
      background-color: #bfbfbf;
 
      color: #ffffff;
 
  }
 
}
 
.mergetag {
 
  padding: 1px 3px 1px 3px;
 
  background-color: #fca062;
 
  font-size: 10px;
 
  color: #ffffff;
 
  text-transform: uppercase;
 
  white-space: nowrap;
 
  border-radius: 3px;
 
  margin-right: 2px;
 
}
 
.parent {
 
  color: #666666;
 
  clear: both;
 
}
 
.logtags {
 
  line-height: 2.2em;
 
}
 
.phasetag,
 
.bumpedtag,
 
.divergenttag,
 
.extincttag,
 
.unstabletag,
 
.repotag,
 
.branchtag,
 
.logtags .tagtag,
 
.logtags .booktag {
 
  margin: 0px 2px;
 
}
 
.phasetag,
 
.bumpedtag,
 
.divergenttag,
 
.extincttag,
 
.unstabletag,
 
.repotag,
 
.branchtag,
 
.tagtag,
 
.booktag,
 
.spantag {
 
  padding: 1px 3px 1px 3px;
 
  font-size: 10px;
 
  color: #577632;
 
  white-space: nowrap;
 
  border-radius: 4px;
 
  border: 1px solid #d9e8f8;
 
  line-height: 1.5em;
 
}
 
table#changesets .phasetag,
 
table#changesets .bumpedtag,
 
table#changesets .divergenttag,
 
table#changesets .extincttag,
 
table#changesets .unstabletag,
 
table#changesets .branchtag,
 
table#changesets .tagtag,
 
table#changesets .booktag {
 
  margin: 1.1em 0;
 
  margin-right: 0.5em;
 
}
 
.phasetag,
 
.bumpedtag,
 
.divergenttag,
 
.extincttag,
 
.unstabletag,
 
.repotag,
 
.branchtag,
 
.tagtag,
 
.booktag {
 
  float: left;
 
  display: inline-block;
 
}
 
.logtags .phasetag,
 
.logtags .bumpedtag,
 
.logtags .divergenttag,
 
.logtags .extincttag,
 
.logtags .unstabletag,
 
.logtags .branchtag,
 
.logtags .tagtag,
 
.logtags .booktag,
 
.mergetag,
 
.merge {
 
  float: right;
 
  line-height: 1em;
 
  margin: 1px 1px !important;
 
  display: block;
 
}
 
.repotag {
 
  border-color: #56A546;
 
  color: #46A546;
 
  font-size: 8px;
 
  text-transform: uppercase;
 
}
 
#context-bar .repotag,
 
.repo-icons .repotag {
 
  border-color: white;
 
  color: white;
 
  margin-top: 3px;
 
}
 
.repo-icons .repotag {
 
  margin-top: 0px;
 
  padding-top: 0px;
 
  padding-bottom: 0px;
 
}
 
.booktag {
 
  border-color: #46A546;
 
  color: #46A546;
 
}
 
.tagtag {
 
  border-color: #62cffc;
 
  color: #62cffc;
 
}
 
.bumpedtag,
 
.divergenttag,
 
.extincttag,
 
.unstabletag {
 
  background-color: #f00;
 
  border-color: #600;
 
  color: #fff;
 
}
 
.phasetag {
 
  border-color: #1F14CE;
 
  color: #1F14CE;
 
}
 
.logtags .branchtag a:hover,
 
.logtags .branchtag a,
 
.branchtag a,
 
.branchtag a:hover {
 
  text-decoration: none;
 
  color: inherit;
 
}
 
.logtags .tagtag {
 
  padding: 1px 3px 1px 3px;
 
  background-color: #62cffc;
 
  font-size: 10px;
 
  color: #ffffff;
 
  white-space: nowrap;
 
  border-radius: 3px;
 
}
 
.tagtag a,
 
.tagtag a:hover,
 
.logtags .tagtag a,
 
.logtags .tagtag a:hover {
 
  text-decoration: none;
 
  color: inherit;
 
}
 
.logbooks .booktag,
 
.logbooks .booktag,
 
.logtags .booktag,
 
.logtags .booktag {
 
  padding: 1px 3px 1px 3px;
 
  background-color: #46A546;
 
  font-size: 10px;
 
  color: #ffffff;
kallithea/public/less/style.less
Show inline comments
 
@@ -330,214 +330,204 @@ h3.files_location {
 
.changeset-logical-index {
 
  color: #666666;
 
  font-style: italic;
 
  font-size: 85%;
 
  padding-right: 0.5em;
 
  text-align: right;
 
}
 
#changeset_compare_view_content .compare_view_commits {
 
  width: auto !important;
 
}
 
#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;
 
}
 
#graph_content,
 
#graph_content_pr,
 
#graph .container_header {
 
  margin-left: 100px;
 
}
 
#graph_content {
 
  position: relative;
 
}
 
table#updaterevs-table tr.mergerow,
 
table#updaterevs-table tr.out-of-range,
 
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: -15px;
 
  top: 0;
 
  right: 0;
 
  padding-left: 5px;
 
  background: #FFFFFF;
 
  height: 41px;
 
}
 
#pull_request_overview .comments-container,
 
#changeset_compare_view_content .comments-container,
 
table#changesets .comments-container,
 
#shortlog_data .comments-container,
 
.comments-container,
 
table#changesets .logtags {
 
  display: block;
 
  float: left;
 
  overflow: hidden;
 
  padding: 0;
 
  margin: 0;
 
  white-space: nowrap;
 
}
 
table#changesets .comments-container {
 
  margin: 0.8em 0;
 
  margin-right: 0.5em;
 
}
 
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;
 
  height: 0;
 
}
 
#updaterevs-table {
 
  margin-left: 40px !important;
 
}
 
.issue-tracker-link {
 
  color: #3F6F9F;
 
  font-weight: bold !important;
 
}
 
/* changeset statuses (must be the same name as the status) */
 
.changeset-status-not_reviewed {
 
  color: #bababa;
 
}
 
.changeset-status-approved {
 
  color: #81ba51;
 
}
 
.changeset-status-rejected {
 
  color: #d06060;
 
}
 
.changeset-status-under_review {
 
  color: #ffc71e;
 
}
 
.pull-right .changes {
 
  clear: both;
 
}
 
.pull-right .changes .changed_total {
 
  display: block;
 
  float: right;
 
  text-align: center;
 
  min-width: 45px;
 
  cursor: pointer;
 
  color: #444444;
 
  background: #FEA;
 
  border-radius: 0px 0px 0px 6px;
 
  padding: 1px;
 
}
 
.pull-right .changes .added,
 
.pull-right .changes .changed,
 
.pull-right .changes .deleted {
 
  color: #444444;
 
}
 
.pull-right .changes .added {
 
  background: #CFC;
 
}
 
.pull-right .changes .changed {
 
  background: #FEA;
 
}
 
.pull-right .changes .deleted {
 
  background: #FAA;
 
}
 

	
 
#repo_size {
 
  display: block;
 
  margin-top: 4px;
 
  color: #666;
0 comments (0 inline, 0 general)