Skip to content

Commit

Permalink
Merge pull request #25 from cloudspace/63998894_write_css_to_reflect_…
Browse files Browse the repository at this point in the history
…the_current_design_comps

63998894 write css to reflect the current design comps
  • Loading branch information
Nicholas Thomson committed Jan 21, 2014
2 parents 106b0dd + 2e697da commit 2b65a72
Show file tree
Hide file tree
Showing 21 changed files with 2,232 additions and 118 deletions.
Binary file added .DS_Store
Binary file not shown.
Binary file added app/.DS_Store
Binary file not shown.
Binary file added app/fonts/.DS_Store
Binary file not shown.
Binary file added app/fonts/BebasNeue.eot
Binary file not shown.
1,991 changes: 1,991 additions & 0 deletions app/fonts/BebasNeue.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/fonts/BebasNeue.ttf
Binary file not shown.
Binary file added app/fonts/BebasNeue.woff
Binary file not shown.
Binary file added app/fonts/guilder.otf
Binary file not shown.
Binary file added app/img/cloud.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/img/logo.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
11 changes: 8 additions & 3 deletions app/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
<!-- build:css({.tmp,app}) styles/main.css -->
<link rel="stylesheet" href="vendor/bootstrap/dist/css/bootstrap.css">
<link href="http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet/less" type="text/css" href="styles/main.less">
<link rel="stylesheet" href="styles/boilerplate.css">
<link rel="stylesheet" href="vendor/leaflet-dist/leaflet.css">
<link rel="stylesheet" href="vendor/leaflet.markerclusterer/dist/MarkerCluster.css">
Expand All @@ -26,10 +26,14 @@
<body>
<!-- Add your site or application content here -->
<header>
<div class="navbar navbar-default" role="navigation">
<div class="navbar" role="navigation">
<div class="container">
<div class="row">
<div class="navbar-header"><a class="navbar-brand" href="#">Crunchinator</a></div>
<img src="img/logo.png"/>
<div class="header-text">
<h1><a href="#">Crunch<span>inator</span></a></h1>
<h2>Crunchbase search and visualization built using Angular.js and D3.</h2>
</div>
</div>
</div>
</div>
Expand All @@ -54,6 +58,7 @@
<script src="vendor/leaflet.markerclusterer/dist/leaflet.markercluster.js"></script>
<script src="vendor/ngInfiniteScroll/ng-infinite-scroll.js"></script>
<script src="vendor/crossfilter/crossfilter.js"></script>
<script src="vendor/less.js/dist/less-1.6.1.js"></script>
<script src='vendor/Faker/Faker.js'></script>
<!-- endbuild -->

Expand Down
4 changes: 0 additions & 4 deletions app/styles/boilerplate.css
Original file line number Diff line number Diff line change
Expand Up @@ -27,10 +27,6 @@ pre {
margin-top: 20px;
}

h2 {
margin: 20px 0;
color: #666;
}

/**
* Navigation
Expand Down
78 changes: 0 additions & 78 deletions app/styles/main.css

This file was deleted.

192 changes: 192 additions & 0 deletions app/styles/main.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,192 @@
@white: #ffffff;
@bright-blue: #60beff;
@pale-blue: #cdebff;
@grey-blue: #4c6d84;
@dark-grey: #3d3d3d;
@transparent-blue: rgba(70, 84, 93, 0.5);

@font-face {
font-family: 'Guilder';
src: url('../fonts/guilder.otf');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'BebasNeue';
src: url('../fonts/BebasNeue.eot');
src: url('../fonts/BebasNeue.eot?#iefix') format('embedded-opentype'),
url('../fonts/BebasNeue.woff') format('woff'),
url('../fonts/BebasNeue.ttf') format('truetype'),
url('../fonts/BebasNeue.svg#BebasNeue') format('svg');
font-weight: normal;
font-style: normal;
}

/* Space out content a bit */
body {
padding-bottom: 20px;
background-color: @dark-grey;
}

header{

background-image: url('../img/cloud.png');
padding-bottom: 15px;

.row{
margin-top: 30px;
padding-bottom: 20px;
border-bottom: 1px solid @bright-blue;
}

img{
display: inline;
float: left;
}

.header-text{
margin-left: 30px;
float: left;
h1{
margin-top: 0px;
margin-bottom: 0px;
font-family: 'BebasNeue';
font-size: 68px;

a{
color: @pale-blue;

span{
color: @white;
}
}
}

h2{
margin-top: 0px;
font-size: 13px;
color: @white;
}
}
}



/* Everything but the jumbotron gets side spacing for mobile first views */
.header,
.marketing,
.footer {
padding-left: 15px;
padding-right: 15px;
}

/* Custom page header */
.header {
border-bottom: 1px solid #e5e5e5;
}
/* Make the masthead heading the same height as the navigation */
.header h3 {
margin-top: 0;
margin-bottom: 0;
line-height: 40px;
padding-bottom: 19px;
}

/* Custom page footer */
.footer {
padding-top: 19px;
color: #777;
border-top: 1px solid #e5e5e5;
}

.total-raised-bar {
float: left;
}

.count {
margin-top: 25px;
}

.hq-map {
width: 100%;
height: 100%;
min-height: 360px;
}

.cloud{
clear:both;
}

.data-set-container{
border-top: 1px solid @bright-blue;
background-color: @transparent-blue;
padding: 20px;
box-sizing: border-box;

h3{
font-family: 'Guilder';
font-size: 53px;
color: #ffffff;
vertical-align: bottom;
}

p{
margin-top: 50px;
color: @white;
}

.textlist{
border: 1px solid @bright-blue;
}

.form-group{
margin-bottom: 0px;
margin-top: 0px;
}

.textlist.select-list .dataset {
height: 251px;
}

.dataset {
height: 300px;
overflow: scroll;
background-color: @transparent-blue;
color: #ceecff;
}

tbody tr td{
border-top: 1px solid @bright-blue;
}

.input-group{
display: block;
}

input{
border-radius: 0px;
border: none;
border-bottom: 1px solid @bright-blue;
width: 100%;
background-color: @transparent-blue;
color: @white;
}

::-webkit-scrollbar {
display: none;
}
}

.spacing-med {
margin-top: 10px;
margin-bottom: 10px;
}

.clear-both {
clear: both;
}

.remove-selected {
text-align: right;
}
12 changes: 7 additions & 5 deletions app/views/d3-cloud.tpl.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<h3 class='pull-left'>{{title}}</h3>
<p class="pull-right count">
{{data.length}} of {{total}}
</p>
<div class='cloud'></div>
<div class='data-set-container'>
<h3 class='pull-left'>{{title}}</h3>
<p class="pull-right count">
{{data.length}} of {{total}}
</p>
<div class='cloud'></div>
</div>
2 changes: 1 addition & 1 deletion app/views/list-display.tpl.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ <h3 class='pull-left'>
<div class='textlist clear-both'>
<div class='dataset'>
<table
class='table table-striped table-hover'
class='table table-hover'
infinite-scroll="updateScrollItems()"
infinite-scroll-distance="2"
>
Expand Down
51 changes: 26 additions & 25 deletions app/views/list-select.tpl.html
Original file line number Diff line number Diff line change
@@ -1,29 +1,30 @@
<h3 class="pull-left">{{title}}</h3>
<div class="select-list textlist clear-both">
<div class="form-group">
<div class="controls">
<div class="input-group">
<span class="input-group-addon"><i class="glyphicon glyphicon-bullhorn"></i></span>
<input type="text" class="form-control"
ng-model="selectedItem"
typeahead-min-length="2"
typeahead-wait-ms="200"
typeahead-on-select="selectItem()"
typeahead="item as item.name for item in items | filter:{name: $viewValue} | limitTo: 3"
/>
<div class="data-set-container">
<h3 class="pull-left">{{title}}</h3>
<div class="select-list textlist clear-both">
<div class="form-group">
<div class="controls">
<div class="input-group data">
<input type="text" placeholder="search" class="form-control"
ng-model="selectedItem"
typeahead-min-length="2"
typeahead-wait-ms="200"
typeahead-on-select="selectItem()"
typeahead="item as item.name for item in items | filter:{name: $viewValue} | limitTo: 3"
/>
</div>
</div>
</div>
</div>
<div class="dataset">
<table class="table">
<tbody>
<tr ng-repeat="item in selectedItems">
<td>{{item.name}}</td>
<td class="remove-selected">
<span class="glyphicon glyphicon-remove-circle remove-selected" ng-click="removeItem(item)"></span>
</td>
</tr>
</tbody>
</table>
<div class="dataset">
<table class="table">
<tbody>
<tr ng-repeat="item in selectedItems">
<td>{{item.name}}</td>
<td class="remove-selected">
<span class="glyphicon glyphicon-remove-circle remove-selected" ng-click="removeItem(item)"></span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
Loading

0 comments on commit 2b65a72

Please sign in to comment.