From 17751eced94bd88a71555d23eb8188acf2e07a3f Mon Sep 17 00:00:00 2001
From: Jimmy Zelinskie <jimmy.zelinskie@coreos.com>
Date: Mon, 29 Dec 2014 15:39:04 -0500
Subject: [PATCH] css overflow ellipsis to titles and descriptions
---
static/css/quay.css | 12 ++++++++++++
static/partials/repo-list.html | 16 ++++++++--------
2 files changed, 20 insertions(+), 8 deletions(-)
diff --git a/static/css/quay.css b/static/css/quay.css
index 13bc91905..e62666b73 100644
--- a/static/css/quay.css
+++ b/static/css/quay.css
@@ -2541,6 +2541,12 @@ p.editable:hover i {
margin-bottom: 30px;
}
+.repo-panel-title-row {
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
.panel-body.starred {
background: -moz-linear-gradient(top, rgba(255,240,188,1) 0%, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0.49) 51%, rgba(255,255,255,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,240,188,1)), color-stop(50%,rgba(255,255,255,0.5)), color-stop(51%,rgba(255,255,255,0.49)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
@@ -2593,6 +2599,12 @@ p.editable:hover i {
padding-top: 13px;
}
+.repo-listing .description p:last-child {
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
.repo-build .build-id:before {
content: "Build ID: "
diff --git a/static/partials/repo-list.html b/static/partials/repo-list.html
index 268aedcde..312995e30 100644
--- a/static/partials/repo-list.html
+++ b/static/partials/repo-list.html
@@ -50,18 +50,18 @@
<div class="panel panel-default">
<div class="panel-body starred">
<div class="row">
- <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
+ <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10 repo-panel-title-row">
<span class="repo-icon repo-circle no-background" repo="repository"></span>
<a ng-href="/repository/{{repository.namespace}}/{{ repository.name }}" class="repo-panel-repo-link"
- data-repo="{{repository.namespace}}/{{ repository.name }}">
- {{repository.namespace}}/{{repository.name}}
+ data-repo="{{repository.namespace}}/{{ repository.name }}" title="{{repository.namespace}}/{{repository.name}}">
+ {{repository.namespace }}/{{ repository.name }}
</a>
</div>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
<i class="star-icon starred fa fa-star" ng-click="unstarRepo(repository)"></i>
</div>
</div>
- <!-- The description automatically gets put in a <p> which adds margin that throws off our .repo-panel padding -->
+ <!-- The description automatically gets put in a <p> which adds margin that throws off our .repo-panel padding -->
<div class="description markdown-view" content="repository.description" first-line-only="true"></div>
</div>
</div>
@@ -98,11 +98,11 @@
<div class="panel panel-default">
<div class="panel-body">
<div class="row">
- <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
+ <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10 repo-panel-title-row">
<span class="repo-icon repo-circle no-background" repo="repository"></span>
<a ng-href="/repository/{{repository.namespace}}/{{ repository.name }}" class="repo-panel-repo-link"
data-repo="{{repository.namespace}}/{{ repository.name }}">
- {{repository.namespace}}/{{repository.name}}
+ {{ repository.namespace }}/{{ repository.name }}
</a>
</div>
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
@@ -115,8 +115,8 @@
</div>
</div>
<div ng-show="namespace.value.length == 0">
- <div class="empty-primary-msg">There aren't any repositories yet.</div>
- <div class="empty-secondary-msg">This origanization does't have any repositories, or you have not been provided access. <a href="/new">Create a new repository</a>
+ <div class="empty-primary-msg">This namespace doesn't have any viewable repositories.</div>
+ <div class="empty-secondary-msg">You may be seeing this because you do not have permission to view any repositories. If you have permission, try <a href="/new">creating a new repository</a>.</div>
</div>
<!-- User/Org has no repositories -->