Sort out style of project list

This commit is contained in:
James Allen 2014-06-09 08:51:12 +01:00
parent 3cbf5fa4f4
commit 68aff781af
4 changed files with 34 additions and 31 deletions

View file

@ -27,17 +27,20 @@ block content
mixin projectList(projects)
-each project in projects
- project_id = project._id.toString()
li.project_entry(id=project_id)
label.checkbox.select-item
input(type="checkbox")
span.title
a.projectName(href="/project/#{project._id}") #{project.name}
span.project-tags(data-project-id=project_id)
- each tag in project.tags
mixin tag(project_id, tag.name, true)
span.owner
mixin formatOwnerText(project.accessLevel, project.publicAccesLevel)
span.last-modified.isoDate #{project.lastUpdated.toISOString()}
li.project_entry(id=project_id).container-fluid
.row
.col-md-6
input(type="checkbox").select-item
span.title
a.projectName(href="/project/#{project._id}") #{project.name}
span.project-tags(data-project-id=project_id)
- each tag in project.tags
mixin tag(project_id, tag.name, true)
.col-md-2
span.owner
mixin formatOwnerText(project.accessLevel, project.publicAccesLevel)
.col-md-4
span.last-modified.isoDate #{project.lastUpdated.toISOString()}
.content.content-alt
.container
@ -154,12 +157,15 @@ block content
.card.card-thin
- if (projects.length > 0)
ul.list-unstyled.project-list
li
label.checkbox.select-all
input(type="checkbox")
span.title TITLE
span.owner OWNER
span.last-modified LAST MODIFIED
li.container-fluid
.row
.col-md-6
input(type="checkbox").select-all
span.title TITLE
.col-md-2
span.owner OWNER
.col-md-4
span.last-modified LAST MODIFIED
mixin projectList(projects)
- else
.row

View file

@ -38,13 +38,12 @@ form.project-search {
ul.project-list {
list-style-type: none;
height: 420px;
margin: 0;
overflow: hidden;
overflow-y: scroll;
li {
border-bottom: 1px solid @gray-lighter;
padding: (@line-height-base / 4) 0;
border-bottom: 1px solid @gray-lightest;
padding: (@line-height-computed / 4) 0;
&:first-child {
.last-modified, .owner {
font-size: 1rem;
@ -54,34 +53,30 @@ ul.project-list {
border-bottom: 0 none;
}
&:hover {
background-color: @gray-lighter;
background-color: @gray-lightest;
}
&:first-child:hover {
background-color: white;
}
a {
color: lighten(@blue, 10%);
color: darken(@blue, 10%);
}
.select-item, .select-all, .title, .last-modified, .owner {
display: inline-block;
vertical-align: top;
margin-right: @line-height-base;
margin-right: @line-height-computed;
}
.select-item, .select-all {
margin-left: @line-height-base / 4;
}
.title {
width: 50%;
margin-left: @line-height-computed / 4;
}
.last-modified, .owner {
font-size: .8rem;
width: 15%;
}
.owner {
margin-right: 0;
}
.projectName {
margin-right: @line-height-base;
margin-right: @line-height-computed;
}
}
.project_entry {

View file

@ -9,8 +9,7 @@
// For recommendations on resolving such conflicts, see
// http://getbootstrap.com/getting-started/#third-box-sizing
* {
.box-sizing(border-box);
}
.box-sizing(border-box);}
*:before,
*:after {
.box-sizing(border-box);

View file

@ -2,6 +2,9 @@
// Typography
// --------------------------------------------------
* {
-webkit-font-smoothing: antialiased;
}
// Headings
// -------------------------