darkkirb/harness-drone
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

styled the repository page

Browse source
This commit is contained in:
Brad Rydzewski 2014-07-09 10:13:08 -07:00
parent f97c6f6e1a
commit 353ae1cd6f
4 changed files with 171 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

80
server/app/styles/drone.css
View file

@ -666,9 +666,87 @@ nav a span.fa {
width: 100%;
}
#repospage section {
max-width: 1180px;
border-bottom: 1px solid #eee;
max-width: 768px;
margin: 0px auto;
margin-top: 30px;
margin-bottom: 30px;
}
#repospage section .search {
margin-bottom: 25px;
}
#repospage section .search input[type="text"],
#repospage section .search input[type="search"] {
-webkit-transition: 0.4s border linear;
-moz-transition: 0.4s border linear;
-ms-transition: 0.4s border linear;
-o-transition: 0.4s border linear;
transition: 0.4s border linear;
border: 1px solid #ccc;
border-radius: 0px;
box-shadow: none;
padding: 12px;
}
#repospage section .search input[type="text"]:focus,
#repospage section .search input[type="search"]:focus {
border-color: #129FEA;
}
#repospage section .repo {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
text-decoration: none;
}
#repospage section .repo:last-child > div {
border-bottom: 1px solid #fff;
}
#repospage section .repo > div {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #eee;
border-bottom: 1px solid #fff;
-webkit-transition: 0.4s border linear;
-moz-transition: 0.4s border linear;
-ms-transition: 0.4s border linear;
-o-transition: 0.4s border linear;
transition: 0.4s border linear;
}
#repospage section .repo > div > div {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
padding: 20px 25px;
}
#repospage section .repo > div > div:last-child div {
text-align: right;
}
#repospage section .repo > div:hover {
border: 1px solid #262626;
}
#repospage section .repo h4 {
font-size: 20px;
margin-bottom: 2px;
color: #262626;
}
#repospage section .repo span {
color: #666;
font-size: 14px;
}
#repospage section .repo i {
color: #DDD;
font-size: 22px;
margin-left: 20px;
margin-top: 15px;
}
#repospage section .repo i.fa-check-circle-o {
color: #68c598;
}
#userspage {
width: 100%;

68
server/app/styles/drone.less
View file

@ -596,9 +596,75 @@ nav {
#repospage {
width:100%;
section {
max-width:1180px;
border-bottom:1px solid #eee;
max-width:768px;
margin:0px auto;
margin-top:30px;
margin-bottom:30px;
.search {
margin-bottom: 25px;
input[type="text"],
input[type="search"] {
.transition(.4s border linear);
border: 1px solid #ccc;
border-radius: 0px;
box-shadow: none;
padding: 12px;
&:focus {
border-color: #129FEA;
}
}
}
.repo {
.border_box;
text-decoration:none;
&:last-child > div {
border-bottom:1px solid #fff;
}
&> div {
.border_box;
border:1px solid #eee;
border-bottom:1px solid #fff;
.transition(.4s border linear);
& > div {
.border_box;
padding:20px 25px;
&:last-child div {
text-align:right;
}
}
&:hover {
border:1px solid @c0;
}
}
h4 {
font-size:20px;
margin-bottom:2px;
color:@c0;
}
span {
color:#666;
font-size:14px;
}
i {
color: #DDD;
font-size: 22px;
margin-left:20px;
margin-top:15px;
&.fa-check-circle-o {
color:@cok;
}
}
}
}
}

2
server/app/styles/drone.min.css vendored
View file

File diff suppressed because one or more lines are too long

31
server/app/views/repo_list.html
View file

@ -1,13 +1,30 @@
<article id="repospage">
<div id="repospage">
<nav>
<a href="/"><span class="fa fa-th"></span></a>
<a href="/account/repos">repositories</a>
<a href="/">repositories</a>
</nav>
<section>
<ul>
<li ng-repeat="repo in repos"><a href="/{{ repo | fullPath }}">{{ repo | fullName }}</a></li>
</ul>
<form class="pure-form search pure-g">
<input type="search" placeholder="FILTER" class="pure-u-1" id="search" ng-model="search" autofocus />
</form>
<a class="repo" ng-repeat="repo in repos | filter:search" href="/{{ repo | fullPath }}">
<div class="pure-g">
<div class="pure-u-5-6">
<div>
<h4>{{ repo.name }}</h4>
<span class="url">{{ repo | fullPath }}</span>
</div>
</div>
<div class="pure-u-1-6">
<div>
<i class="fa fa-circle-o" ng-if="repo.active == false"></i>
<i class="fa fa-check-circle-o" ng-if="repo.active == true"></i>
</div>
</div>
</div>
</a>
</section>
</article>
</div>