Add home page and search page

pug/home.pug

@@ -0,0 +1,11 @@
+extends includes/layout.pug
+
+block content
+  main.home-page
+    h1.top-header CloudTube
+    h2.tagline An alternative front-end for YouTube.
+    .encouraging-message
+      p You're in control. Watch things your way.
+      p Go on. What do you want to watch?
+      form(method="get" action="/search").encouraging-search-form
+        input(type="text" name="q" placeholder="I'd like to watch..." autocomplete="off").search.base-border-look

pug/includes/layout.pug

@@ -10,6 +10,7 @@ html
   body.show-focus
     nav.main-nav
       a(href="/").link.home CloudTube
-      input(type="text" placeholder="Search" name="q" autocomplete="off").search
+      form(method="get" action="/search").search-form
+        input(type="text" placeholder="Search" name="q" autocomplete="off").search
 
     block content

pug/includes/video-list-item.pug

@@ -0,0 +1,16 @@
+mixin video_list_item(video)
+  - let link = `/watch?v=${video.videoId}`
+  a(href=link).thumbnail
+    img(src=`https://i.ytimg.com/vi/${video.videoId}/mqdefault.jpg` width=320 height=180 alt="").image
+    span.duration= video.second__lengthText
+  .info
+    div.title: a(href=link).title-link= video.title
+    div.author-line
+      a(href=`/channel/${video.authorId}`).author= video.author
+      if video.publishedText
+        = ` • `
+        span.published= video.publishedText
+      = ` • `
+      span.views= video.viewCountText || video.second__viewCountText
+    if video.descriptionHtml
+      div.description!= video.descriptionHtml

pug/search.pug

@@ -0,0 +1,9 @@
+extends includes/layout.pug
+
+include includes/video-list-item.pug
+
+block content
+  main.search-page
+    each result in results
+      .search-result
+        +video_list_item(result)

pug/video.pug

@@ -1,5 +1,7 @@
 extends includes/layout.pug
 
+include includes/video-list-item.pug
+
 block head
   title= video.title
   script(type="module" src=getStaticURL("html", "/static/js/player.js"))
@@ -56,13 +58,4 @@ block content
       h2.related-header Related videos
       each r in video.recommendedVideos
         .related-video
-          - let link = `/watch?v=${r.videoId}`
-          a(href=link).thumbnail
-            img(src=`https://i.ytimg.com/vi/${r.videoId}/mqdefault.jpg` width=320 height=180 alt="").image
-            span.duration= r.second__lengthText
-          .info
-            div.title: a(href=link).title-link= r.title
-            div.author-line
-              a(href=`/channel/${authorId}`).author= r.author
-              = ` • `
-              span.views= r.viewCountText
+          +video_list_item(r)