Style releases table

pypi · Jan 9, 2018 · 7553ce0 · 7553ce0
1 parent 134e3a0
commit 7553ce0
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 9 deletions.
diff --git a/warehouse/static/sass/blocks/_table.scss b/warehouse/static/sass/blocks/_table.scss
@@ -65,6 +65,7 @@
     td {
       border: 0;
       background-color: transparent;
+      padding: 10px 0;
     }
 
     th,
@@ -140,4 +141,26 @@
       }
     }
   }
+
+  &--releases {
+    box-sizing: border-box;
+    table-layout: fixed;
+    word-wrap: break-word;
+
+    .table__version,
+    .table__date {
+      width: 130px;
+    }
+
+    .table__options {
+      width: 110px;
+      text-align: right;
+    }
+
+    @media only screen and (max-width: $tablet){
+      .table__summary {
+        display: none;
+      }
+    }
+  }
 }
diff --git a/warehouse/templates/manage/project.html b/warehouse/templates/manage/project.html
@@ -65,26 +65,26 @@ <h1>{{ project.name }}</h1>
             {% block main %}
               <h2>Releases ({{ project.releases|length }})</h2>
               {% if project.releases %}
-                <table class="table table--light">
+                <table class="table table--light table--releases">
                   <thead>
-                    <th>Version</th>
-                    <th>Release Date</th>
-                    <th>Summary</th>
-                    <th></th>
+                    <th class="table__version">Version</th>
+                    <th class="table__date">Release Date</th>
+                    <th class="table__summary">Summary</th>
+                    <th class="table__options"></th>
                   </thead>
                   <tbody>
                     {% for release in project.releases %}
                       <tr>
-                        <td><a href="TODO: link to release edit page">{{ release.version }}</a></td>
-                        <td><time class="-js-relative-time" datetime="{{ release.created|format_datetime('yyyy-MM-ddTHH:mm:ss') }}">{{ release.created|format_date()}}</time></td>
-                        <td>
+                        <td class="table__version"><a href="TODO: link to release edit page">{{ release.version }}</a></td>
+                        <td class="table__date"><time class="-js-relative-time" datetime="{{ release.created|format_datetime('yyyy-MM-ddTHH:mm:ss') }}">{{ release.created|format_date()}}</time></td>
+                        <td class="table__summary">
                           {% if release.summary %}
                             {{ release.summary }}
                           {% else %}
                             &mdash;
                           {% endif %}
                           </td>
-                        <td>
+                        <td class="table__options">
                           <div class="dropdown">
                             <button class="dropdown__trigger button">
                               Options