Skip to content

Commit 70b8a05

Browse files
giorgiouboldigiorgiouboldi
committed
map template styling
1 parent 38cb4c9 commit 70b8a05

File tree

3 files changed

+59
-20
lines changed

3 files changed

+59
-20
lines changed

‎index.html

+4-3
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,8 @@
22
<html lang="en" ng-app="tipot">
33

44
<head>
5-
<!-- Google Fonts -->
5+
<!-- Google Fonts and Font Awesome-->
6+
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
67
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic' rel='stylesheet' type='text/css'>
78
<link href='http://fonts.googleapis.com/css?family=Crimson+Text:400,400italic,600,600italic,700,700italic' rel='stylesheet' type='text/css'>
89
<!-- Bootstrap -->
@@ -24,7 +25,7 @@
2425

2526
<div id="layout" ng-cloak ng-controller="layoutCtrl">
2627
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
27-
<div class="container">
28+
<div class="container-fluid">
2829
<!-- Brand and toggle get grouped for better mobile display -->
2930
<div class="navbar-header">
3031
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
@@ -33,7 +34,7 @@
3334
<span class="icon-bar"></span>
3435
<span class="icon-bar"></span>
3536
</button>
36-
<a class="navbar-brand" href="#">Emaps</a>
37+
<a class="navbar-brand" href="#"><i class="fa fa-bars"></i></a>
3738
</div>
3839
<!-- /.navbar-collapse -->
3940
</div>

‎src/css/style.css

+47-9
Original file line numberDiff line numberDiff line change
@@ -4,39 +4,77 @@
44
border-color: #f0ecec;
55
}
66

7+
.navbar-header{
8+
margin-right: 0;
9+
margin-left: 100px;
10+
}
11+
712
p {
813
font-family: 'Crimson Text', serif;
9-
font-size: 1.5em;
14+
font-size: 1.2em;
1015

1116
}
1217

1318
/*Map Template*/
1419
.full-width-image{
15-
max-height:80%;
16-
width: 100%;
20+
position: relative;
21+
border-bottom: 1px solid #f0ecec;
22+
}
23+
24+
.full-width-image img{
25+
display: block;
26+
width: auto;
27+
max-height: 80%; /* corresponds to max height of 450px */
28+
margin: 0 auto;
1729
}
1830

31+
.main-map{
32+
padding-left: 100px;
33+
}
34+
35+
.content-main-map{
36+
border-right: 1px solid #f0ecec;
37+
padding-right: 70px;
38+
padding-top: 30px;
39+
}
1940

2041
.sidebar-map{
21-
padding-top: 30px;
42+
}
43+
44+
.content-sidebar-map{
45+
padding-left: 10px;
46+
padding-right: 100px;
47+
padding-top: 30px;
2248
}
2349

2450
.sidebar-map p{
51+
margin: 0;
52+
}
53+
54+
.sidebar-map h1{
55+
padding-top: 1.2em;
56+
color: #ff5a52;
2557
}
2658

2759
.sidebar-map h3{
2860
font-family: 'Source Sans Pro', sans-serif;
2961
font-weight: 400;
3062
font-size: 1em;
3163
line-height: 150%;
32-
padding-bottom: 30px;
3364
}
3465

35-
.main-map{
36-
padding-top: 30px;
37-
border-right: 1px solid #ccc;
66+
.sidebar-map h3::before {
67+
content: "\f106";
68+
font-family: "FontAwesome";
69+
font-weight: normal;
70+
font-style: normal;
71+
display: inline-block;
72+
text-decoration: inherit;
73+
margin-right: 3px;
74+
color: #ff5a52;
3875
}
3976

77+
4078
.title{
4179
font-family: 'Crimson Text', serif;
4280
font-size: 2.5em;
@@ -62,4 +100,4 @@ h2 {
62100
text-transform: uppercase;
63101
font-size: 1.5em;
64102
letter-spacing: 1px;
65-
}
103+
}

‎src/partials/page.html

+8-8
Original file line numberDiff line numberDiff line change
@@ -15,33 +15,32 @@
1515
<div ng-switch-when="image">
1616
<p></p>
1717
<div class="container-fluid">
18-
<div class="row">
19-
<img ng-src="{{file.src}}" class"full-width-image">
18+
<div class="row full-width-image">
19+
<img ng-src="{{file.src}}">
2020
</div>
2121
</div>
2222
</div>
2323
</div>
2424
</div>
2525

26-
<div class="container">
26+
<div class="container-fluid">
2727
<div class="row">
2828
<div class="col-md-8 main-map">
2929
<div ng-repeat="file in files">
3030
<a id="file-{{file.id}}"></a>
3131
<div ng-switch="file.type">
3232
<div ng-switch-when="image">
33-
<p></p>
34-
3533
<!--<div class="caption">{{file.title}}</div>-->
3634
</div>
3735
<div ng-switch-when="PDF">
3836
<!-- img ng-src="{{file.src}}" this is the file preview...-->
3937
<a target="_blank" href="https://docs.google.com/file/d/0ByZTyEnzm9qqbWRTcE9sSmZkeTA">view file online</a>
4038
</div>
4139

40+
<div class="content-main-map">
4241
<div ng-switch-when="Document">
4342
<!--<h2 class="filename">{{file.title}}</h2>-->
44-
<div lazy-file file="file"></div>
43+
<div lazy-file file="file" class="document"></div>
4544
</div>
4645

4746
<div ng-switch-when="Finding">
@@ -58,14 +57,15 @@ <h2 class="filename">{{file.title}}</h2>
5857
<a target="_blank" href="https://docs.google.com/spreadsheets/d/{{file.id}}">view spreadsheet online<!-- img ng-src="{{file.src}}" --></a>
5958
</div>
6059
</div>
60+
</div>
6161
</div>
6262
</div>
63-
<div class="col-md-4 sidebar-map">
63+
<div class="col-md-4 sidebar-map">
6464
<div ng-repeat="file in files">
6565
<div ng-switch="file.type">
6666
<div ng-switch-when="Metadata">
6767
<!--<h2 class="filename">{{file.title}} metadata</h2>-->
68-
<div lazy-file file="file"></div>
68+
<div lazy-file file="file" class="content-sidebar-map"></div>
6969
</div>
7070
</div>
7171
</div>

0 commit comments

Comments
 (0)