kallithea Changeset - 8ba69bf9236e

Changeset - 8ba69bf9236e

Parent rev.

Child rev.

[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:

kallithea/public/less/kallithea-tags.less

kallithea/public/less/style.less

0 comments (0 inline, 0 general)

kallithea/public/less/kallithea-tags.less

➞

Show inline comments

 .metatag {
   display: inline-block;
   margin-right: 1px;
   border-radius: 4px 4px 4px 4px;
   border: solid 1px #9CF;
   padding: 2px 3px 2px 3px !important;
   background-color: #DEF;
+}
 .metatag[data-tag="dead"] {
   background-color: #E44;
+}
 .metatag[data-tag="stale"] {
   background-color: #EA4;
+}
 .metatag[data-tag="featured"] {
   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;
   white-space: nowrap;
   border-radius: 3px;
+}
 .logbooks .booktag,
 .logbooks .booktag a,
 .right .logtags .booktag,
 .logtags .booktag a {
   color: #ffffff;
+}
 .logbooks .booktag,
 .logbooks .booktag a:hover,
 .logtags .booktag,
 .logtags .booktag a:hover,
 .booktag a,
 .booktag a:hover {
   text-decoration: none;
   color: inherit;
+}

kallithea/public/less/style.less

➞

Show inline comments

@@ @@ -234,406 +234,396 @@ div.panel div.panel-heading { @@
 #quick_login .email {
   padding: 3px 3px 3px 0;
+}
 #quick_login :not(input) {
   color: @kallithea-theme-inverse-color;
   padding-bottom: 3px;
+}
 #register div.form div.form-group > label {
   width: 135px;
   float: left;
   text-align: right;
   margin: 2px 10px 0 0;
   padding: 5px 0 0 5px;
+}
 #register div.form div.form-group > div input {
   width: 300px;
+}
 #register div.form div.buttons {
   border-top: 1px solid #DDD;
   margin: 0;
   padding: 10px 0 0 145px;
+}
 #journal .journal_user {
   color: #747474;
   font-size: 14px;
   font-weight: bold;
   height: 30px;
+}
 #journal .journal_user.deleted {
   color: #747474;
   font-size: 14px;
   font-weight: normal;
   height: 30px;
   font-style: italic;
+}
 #journal .journal_icon {
   clear: both;
   float: left;
   padding-right: 4px;
   padding-top: 3px;
+}
 #journal .journal_action {
   padding-top: 4px;
   min-height: 2px;
   float: left;
+}
 #journal .journal_action_params {
   clear: left;
   padding-left: 22px;
+}
 #journal .date {
   clear: both;
   color: #777777;
   font-size: 11px;
   padding-left: 22px;
+}
 #journal .journal_repo_name {
   font-weight: bold;
   font-size: 1.1em;
+}
 #journal .compare_view {
   padding: 5px 0px 5px 0px;
   width: 95px;
+}
 .trending_language_tbl,
 .trending_language_tbl td {
   border: 0 !important;
   margin: 0 !important;
   padding: 0 !important;
+}
 .trending_language_tbl,
 .trending_language_tbl tr {
   border-spacing: 1px;
+}
 h3.files_location {
   font-size: 1.8em;
   font-weight: 700;
   border-bottom: none !important;
   margin: 10px 0 !important;
+}
 .file_history {
   padding-top: 10px;
   font-size: 16px;
+}
 .file_author {
   float: left;
+}
 .file_author .item {
   float: left;
   padding: 5px;
   color: #888;
+}
 .changeset_id {
   color: #666666;
   margin-right: -3px;
+}
 .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;
   float: right;
+}
 .currently_following {
   padding-left: 10px;
   padding-bottom: 5px;
+}
 #switch_repos {
   position: absolute;
   height: 25px;
   z-index: 1;
+}
 #switch_repos select {
   min-width: 150px;
   max-height: 250px;
   z-index: 1;
+}
 .breadcrumbs {
   border: medium none;
   color: #FFF;
   font-weight: 700;
   font-size: 14px;
+}
 table#permissions_manage span.private_repo_msg {
   font-size: 0.8em;
   opacity: 0.6;
+}
 table#permissions_manage td.private_repo_msg {
   font-size: 0.8em;
+}
 table#permissions_manage tr#add_perm_input td {
   vertical-align: middle;
+}
 div.gravatar {
   float: left;
   background-color: #FFF;
   margin-right: 0.7em;
   padding: 1px 1px 1px 1px;
   line-height: 0;
   border-radius: 3px;
+}
 div.gravatar img {
   border-radius: 2px;
+}
 .panel-body.settings > ul.nav-stacked {
   float: left;
   width: 150px;
   padding-right: 35px;
   color: #393939;
   font-weight: 700;
+}
 .panel-body.settings .nav-pills > li {
   padding: 0 !important;
+}
 .panel-body.settings .nav-pills > li > a {
   border-radius: 4px;
   padding: 10px;
   display: block;
   position: relative;
   color: inherit;
+}
 .panel-body.settings > ul.nav-stacked li.active > a,
 .panel-body.settings > ul.nav-stacked li.active:hover > a {
   color: #fff;
   background-color: #577632;
+}
 .panel-body.settings > ul.nav-stacked li:hover > a {
   text-decoration: none;
   background-color: #eee;
+}
 .panel-body.settings > div,
 .panel-body.settings > form {
   float: left;
   width: 750px;
   margin: 0;
+}
 .panel-body.no-padding {
   padding: 0;
+}
 .panel-body ~ .panel-body {
   padding-top: 0;
+}
 .panel-body.no-padding ~ .panel-body {
   padding-top: 15px;
+}
 .panel-body > :last-child {
   margin-bottom: 0;
+}
 .panel-body.settings .text-muted {
   margin: 5px 0;
+}
 ins,
 div.options a:hover {
   text-decoration: none;
+}
 img,
 nav.navbar #quick li a:hover span.normal,

0 comments (0 inline, 0 general)