Sass: set project_nav-width sizes

src/styles/_config.sass

@@ -100,7 +100,11 @@ $screen-md-max: $screen-lg-min - 1 !default
 $sidebar-width: 40px !default
 
 /* Project specifics */
-$project_nav-width: 250px !default
+$project_nav-width: 275px !default
+$project_nav-width-lg: $project_nav-width * 1.2 !default
+$project_nav-width-md: $project_nav-width
+$project_nav-width-sm: $project_nav-width * 0.8 !default
+$project_nav-width-xs: 100% !default
 $project-sidebar-width: 40px !default
 $project_header-height: 40px !default
 

src/styles/_project.sass

@@ -6,19 +6,6 @@ body.workshops
 	#project-container
 		+container-behavior
 
-body.blog
-	background-color: white
-
-	#project_nav,
-	#project_nav-container
-		+media-md
-			width: $project_nav-width * 1.4
-		+media-sm
-			width: $project_nav-width * 1.1
-		+media-xs
-			width: 100%
-		width: $project_nav-width * 1.5
-
 #project-container
 	display: flex
 	flex-direction: row
@@ -38,10 +25,18 @@ body.blog
 		flex-direction: column-reverse
 
 
+#project_nav,
 #project_nav-container
 	+media-lg
-		width: $project_nav-width * 1.33
+		width: $project_nav-width-lg
+	+media-sm
+		width: $project_nav-width-sm
+	+media-xs
+		width: $project_nav-width-xs
 
+	width: $project_nav-width
+
+#project_nav-container
 	+media-xs
 		display: block
 		width: 100%
@@ -50,8 +45,6 @@ body.blog
 
 	position: fixed
 	z-index: $z-index-base + 5
-	width: $project_nav-width
-
 
 #project_sidebar
 	width: $project-sidebar-width
@@ -78,18 +71,6 @@ body.blog
 			height: $project-sidebar-width
 			position: relative
 
-			+media-xs
-				border-bottom: 2px solid transparent
-			+media-sm
-				border-bottom: 2px solid transparent
-			+media-md
-				border-left: 2px solid transparent
-			+media-lg
-				border-left: 2px solid transparent
-
-			&:first-child
-				border-top: thin solid transparent
-
 			&:hover,
 			&.active
 				cursor: pointer
@@ -124,10 +105,11 @@ body.blog
 /* Container for navigation on the left */
 #project_nav
 	+media-lg
-		width: $project_nav-width * 1.33
+		width: $project_nav-width-lg
-
+	+media-sm
+		width: $project_nav-width-sm
 	+media-xs
-		width: initial
+		width: $project_nav-width-xs
 
 	display: block
 	left: 0