Fix subscribe button wrapping on mobile

Also normalises width selectors into their own file.

sass/includes/_dimensions.sass

@@ -0,0 +1,7 @@
+@mixin thin
+  @media screen and (max-width: 499px)
+    @content
+
+@mixin wide
+  @media screen and (min-width: 500px)
+    @content

sass/includes/channel-page.sass

@@ -1,5 +1,6 @@
 @use "colors.sass" as c
 @use "video-list-item.sass" as *
+@use "_dimensions.sass" as dimensions
 
 .channel-page
   padding: 40px 20px 20px
@@ -22,6 +23,10 @@
 
   .info
     display: flex
+    flex-wrap: wrap
+
+    +dimensions.thin
+      display: block
 
     .thumbnail-image
       $size: 120px

sass/includes/nav.sass

@@ -1,9 +1,6 @@
 @use "colors.sass" as c
 @use "buttons.sass" as *
-
+@use "_dimensions.sass" as dimensions
-@mixin thin
-  @media screen and (max-width: 499px)
-    @content
 
 .main-nav
   background-color: c.$bg-accent
@@ -11,13 +8,13 @@
   padding: 8px
   box-shadow: 0px 0px 20px 5px rgba(0, 0, 0, 0.1)
 
-  +thin
+  +dimensions.thin
     display: block
 
   .links
     display: flex
 
-    +thin
+    +dimensions.thin
       margin-bottom: 4px
       padding: 1px
 

sass/includes/video-list-item.sass

@@ -1,12 +1,5 @@
 @use "colors.sass" as c
-
+@use "_dimensions.sass" as dimensions
-@mixin thin
-  @media screen and (max-width: 499px)
-    @content
-
-@mixin wide
-  @media screen and (min-width: 500px)
-    @content
 
 @mixin video-list-item
   display: grid
@@ -77,7 +70,7 @@
   .title
     font-size: 17px
 
-  +wide
+  +dimensions.wide
     grid-gap: 16px
     grid-template-columns: auto 1fr
     margin-bottom: 20px
@@ -116,7 +109,7 @@
       font-size: 15px
       color: c.$fg-dim
 
-  +thin
+  +dimensions.thin
     .description
       display: none