From f8a32e841c7e244b422e8f8539764108891b2abe Mon Sep 17 00:00:00 2001
From: Niels Simenon <niels.simenon@gmail.com>
Date: Sun, 5 Jul 2020 04:40:57 +0200
Subject: [PATCH] Defined new breakpoint names.

---
 assets/components/entities/entity.vue |  4 ++--
 assets/components/header/header.vue   | 12 +++++++++---
 webpack.config.babel.js               |  1 +
 3 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/assets/components/entities/entity.vue b/assets/components/entities/entity.vue
index 51a759b8..b1dcf1d6 100644
--- a/assets/components/entities/entity.vue
+++ b/assets/components/entities/entity.vue
@@ -168,7 +168,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import 'theme';
+@import 'breakpoints';
 
 .info {
 	display: flex;
@@ -231,7 +231,7 @@ export default {
 	display: none;
 }
 
-@media(max-width: $breakpoint0) {
+@media(max-width: $breakpoint-micro) {
 	.logo-parent,
 	.link-child .icon {
 		display: none;
diff --git a/assets/components/header/header.vue b/assets/components/header/header.vue
index 3575becc..e998eb46 100644
--- a/assets/components/header/header.vue
+++ b/assets/components/header/header.vue
@@ -178,7 +178,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import 'theme';
+@import 'breakpoints';
 
 .header {
     height: 3rem;
@@ -320,7 +320,7 @@ export default {
     }
 }
 
-@media(max-width: $breakpoint2) {
+@media(max-width: $breakpoint-kilo) {
     .search-full {
         display: none;
     }
@@ -334,7 +334,7 @@ export default {
     }
 }
 
-@media(max-width: $breakpoint0) {
+@media(max-width: $breakpoint-micro) {
     .nav {
         display: none;
     }
@@ -347,4 +347,10 @@ export default {
         padding: 0 0 0 .5rem;
     }
 }
+
+@media(max-width: $breakpoint-nano) {
+	.header-toggles {
+		display: none;
+	}
+}
 </style>
diff --git a/webpack.config.babel.js b/webpack.config.babel.js
index 52e2650a..2f1f93eb 100644
--- a/webpack.config.babel.js
+++ b/webpack.config.babel.js
@@ -67,6 +67,7 @@ export default {
 	resolve: {
 		alias: {
 			theme: path.join(__dirname, 'assets/css/_theme.scss'),
+			breakpoints: path.join(__dirname, 'assets/css/_breakpoints.scss'),
 			config: path.join(__dirname, `assets/js/config/${process.env.NODE_ENV || 'default'}.js`),
 		},
 	},