Navigation between admin/upload and project page

style/_common.scss

@@ -70,11 +70,7 @@ textarea:focus, input:focus {
 	outline: 1px solid #CCC;
 }
 
-body {
-	overflow: hidden;
-}
-
-body, textarea, input, button {
+body, textarea, input, button, a.button {
 	font-size: 14px;
 	font-family: 'Ubuntu', sans-serif;
 	margin: 0;
@@ -84,17 +80,35 @@ textarea {
 	resize: none;
 }
 
-button {
-	cursor: pointer;
-	font-weight: bold;
+a.button {
+	text-decoration: none;
+	display: inline-block;
 }
 
-input, textarea, button {
+button, a.button {
+	cursor: pointer;
+	font-weight: bold;
+	color: #000;
+	background: #eee;
+
+	&:hover {
+		color: #eee;
+		background: #000;
+	}
+}
+
+input, textarea, button, a.button {
 	border: none;
 	padding: 0.5em 1em;
 	border-radius: 3px;
 }
 
+h1 {
+	font-size: 2em;
+	font-weight: bold;
+	margin: 1em 0 0.5em;
+}
+
 /* Feedback */
 
 .feedback {

style/_fa.scss

@@ -37,6 +37,20 @@ $fa-css-prefix: fa;
 	}
 }
 
+/* Navigation */
+.#{$fa-css-prefix}-menu:before { content: fa-content($fa-var-bars); }
+.#{$fa-css-prefix}-error:before { content: fa-content($fa-var-exclamation-square); }
+.#{$fa-css-prefix}-warning:before { content: fa-content($fa-var-exclamation-triangle); }
+.#{$fa-css-prefix}-success:before { content: fa-content($fa-var-check-circle); }
+.#{$fa-css-prefix}-new:before { content: fa-content($fa-var-plus); }
+.#{$fa-css-prefix}-refresh:before { content: fa-content($fa-var-sync); }
+.#{$fa-css-prefix}-refresh:before { content: fa-content($fa-var-sync); }
+.#{$fa-css-prefix}-cancel:before { content: fa-content($fa-var-image); }
+.#{$fa-css-prefix}-prev:before,
+.#{$fa-css-prefix}-back:before { content: fa-content($fa-var-chevron-left); }
+.#{$fa-css-prefix}-next:before { content: fa-content($fa-var-chevron-right); }
+.#{$fa-css-prefix}-close:before { content: fa-content($fa-var-times-circle); }
+
 /* Map */
 .#{$fa-css-prefix}-map:before { content: fa-content($fa-var-map-marked); }
 .#{$fa-css-prefix}-track-off-track:before { content: fa-content($fa-var-hiking); }
@@ -49,17 +63,16 @@ $fa-css-prefix: fa;
 .#{$fa-css-prefix}-distance:before { content: fa-content($fa-var-arrow-circle-right); }
 .#{$fa-css-prefix}-elev-drop:before { content: fa-content($fa-var-arrow-circle-down); }
 .#{$fa-css-prefix}-elev-gain:before { content: fa-content($fa-var-arrow-circle-up); }
-.#{$fa-css-prefix}-download:before { content: fa-content($fa-var-file-download);  }
+.#{$fa-css-prefix}-download:before { content: fa-content($fa-var-file-download); }
 
-/* Settings */
-.#{$fa-css-prefix}-menu:before { content: fa-content($fa-var-bars); }
+/* Admin */
 .#{$fa-css-prefix}-newsletter:before { content: fa-content($fa-var-wifi); }
 .#{$fa-css-prefix}-project:before { content: fa-content($fa-var-hiking); }
-.#{$fa-css-prefix}-error:before { content: fa-content($fa-var-exclamation-square); }
-.#{$fa-css-prefix}-warning:before { content: fa-content($fa-var-exclamation-triangle); }
-.#{$fa-css-prefix}-success:before { content: fa-content($fa-var-check-circle); }
 .#{$fa-css-prefix}-unsubscribe:before { content: fa-content($fa-var-times); }
 .#{$fa-css-prefix}-credits:before { content: fa-content($fa-var-paw); }
+.#{$fa-css-prefix}-admin:before { content: fa-content($fa-var-tools); }
+.#{$fa-css-prefix}-config:before { content: fa-content($fa-var-cogs); }
+.#{$fa-css-prefix}-upload:before { content: fa-content($fa-var-cloud-upload); }
 
 /* Feed */
 .#{$fa-css-prefix}-post:before { content: fa-content($fa-var-comment); }
@@ -83,16 +96,8 @@ $fa-css-prefix: fa;
 .#{$fa-css-prefix}-send:before { content: fa-content($fa-var-paper-plane); }
 
 /* Lightbox */
-.#{$fa-css-prefix}-cancel:before { content: fa-content($fa-var-image); }
-.#{$fa-css-prefix}-prev:before { content: fa-content($fa-var-chevron-left); }
-.#{$fa-css-prefix}-next:before { content: fa-content($fa-var-chevron-right); }
-.#{$fa-css-prefix}-close:before { content: fa-content($fa-var-times-circle); }
 .#{$fa-css-prefix}-timezone:before { content: fa-content($fa-var-globe); }
 
-/* Admin */
-.#{$fa-css-prefix}-new:before { content: fa-content($fa-var-plus); }
-.#{$fa-css-prefix}-refresh:before { content: fa-content($fa-var-sync); }
-
 /* Weather */
 .#{$fa-css-prefix}-temperature:before { content: fa-content($fa-var-thermometer-three-quarters); }
 .#{$fa-css-prefix}-clear-day:before { content: fa-content($fa-var-sun); }

style/_mask_admin.scss

@@ -1,15 +1,6 @@
 #admin {
 	margin: 1em;
 	
-	button.main-btn {
-		color: #000;
-		background: #eee;
-		&:hover {
-			color: #eee;
-			background: #000;
-		}
-	}
-	
 	table {
 		margin-bottom: 1em;
 		border-collapse: collapse;
@@ -35,6 +26,7 @@
 			
 				button {
 					color: #AAA;
+					background: none;
 					&:hover {
 						color: #666;
 					}

style/_mask_project.scss

@@ -29,6 +29,12 @@ $track-hitchhiking-color: #FF7814;
 $legend-color: $post-color;
 
 #projects {
+	overflow: hidden;
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
 
 	/* Panels movements */
 	&.with-feed {
@@ -374,14 +380,24 @@ $legend-color: $post-color;
 			color: $post-color;
 		}
 
-		button {
+		button, a.button {
 			background-color: $post-color;
 			color: $post-bg;
 
-			&:hover {
+			&:hover, &:hover a, &:hover a:visited {
 				background-color: $post-input-bg;
 				color: $post-color;
 			}
+
+			a, a:visited {
+				background-color: $post-color;
+				color: $post-bg;
+				text-decoration: none;
+			}
+
+			&+ button, &+ a.button {
+				margin-left: $elem-spacing;
+			}
 		}
 
 		#feed-panel, #settings-panel {
@@ -765,12 +781,19 @@ $legend-color: $post-color;
 					h1 {
 						margin: 0 0 $block-spacing;
 						color: $title-color;
+						font-size: 1.5em;
 					}
 
 					label {
 						margin-bottom: .3em;
 						display: block;
 						cursor: pointer;
+
+						& > div {
+							text-overflow: ellipsis;
+							overflow: hidden;
+							white-space: nowrap;
+						}
 					}
 
 					&.newsletter {

style/_mask_upload.scss

@@ -1,12 +1,5 @@
 #upload {
 	padding: 1em;
-		
-	h1 {
-		font-size: 2em;
-		border-bottom: 2px solid black;
-		margin: 0 0 1em 0;
-		padding-bottom: 0.5em;
-	}
 	
 	.bar {
 		height: 18px;