Sticky footerの設定・ランダムIDの生成ページの作成等

nedew · Oct 23, 2020 · 2feaab8 · 2feaab8 · vercel · Oct 23, 2020
1 parent 31115a3
commit 2feaab8
Show file tree

Hide file tree

Showing 6 changed files with 57 additions and 8 deletions.
diff --git a/components/styles/footer.module.scss b/components/styles/footer.module.scss
@@ -8,6 +8,7 @@
   padding: 1.5rem 0;
   margin-top: auto;
   border-top: 1px solid #ededed;
+  margin-top: auto;
 }
 
 .footerContainer {

diff --git a/components/styles/layout.module.scss b/components/styles/layout.module.scss
@@ -17,6 +17,7 @@
   padding-left: $widePaddingLeft;
   padding-bottom: $widePaddingBottom;
 
+  // Mobile
   @media screen and (max-width: $breakPoint) {
     padding-top: $narrowPaddingTop;
     padding-right: $narrowPaddingRight;
@@ -29,8 +30,9 @@
   @media screen and (max-width: $maxWidth) {
     margin-top: 0px;
     margin-bottom: 0px;
-    z-index: -1;
+    // z-index: -1;
     border-radius: inherit;
+    box-shadow: inherit;
   }
 }
 
@@ -46,8 +48,8 @@
 
 // }
 
-// .area {
-//   display: flex;
-//   flex-direction: column;
-//   min-height: 100vh;
-// }
+.area {
+  display: flex;
+  flex-direction: column;
+  min-height: 100vh;
+}
diff --git a/lib/generateUniqueId.ts b/lib/generateUniqueId.ts
@@ -0,0 +1,14 @@
+export function generateUniqueId(ids: string[]) {
+  let uniqueId:string
+  let isDone:boolean = false
+
+  while (!isDone) {
+    uniqueId = ('00000' + Math.floor(Math.random() * 100000)).slice(-5)
+    if (ids.indexOf(uniqueId) !== -1) {
+      continue
+    }
+    isDone = true
+  }
+
+  return uniqueId
+}
diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -1,11 +1,11 @@
 import Document, { Html, Head, Main, NextScript } from 'next/document'
+import { siteName } from '../config/blog.config.json'
 
 export default class MyDocument extends Document {
   render() {
     return (
       <Html lang="ja">
         <Head>
-          {/* <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700&family=Audiowide&family=Mitr&family=Varela+Round&family=Bungee&family=Righteous&family=Russo+One&family=Luckiest+Guy&family=Montserrat+Alternates:wght@800;900&family=Six+Caps&family=Alegreya+Sans+SC:wght@900&display=swap" rel="stylesheet" /> */}
           <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@700&family=Orbitron:wght@900&display=swap" rel="stylesheet" />
         </Head>
         <body>

diff --git a/pages/generate-id.tsx b/pages/generate-id.tsx
@@ -0,0 +1,31 @@
+import Head from 'next/head'
+import { GetStaticProps } from 'next'
+import Layout from '../components/Layout'
+import utilStyles from '../components/styles/util.module.scss'
+import articleIds from '../gen/articleIds.json'
+import { siteName } from '../config/blog.config.json'
+import { generateUniqueId } from '../lib/generateUniqueId'
+
+export default ({ uniqueId }: { uniqueId: string }) => {
+  return (
+    <>
+      <Head>
+        <title>Generate article id | {siteName}</title>
+        <link rel="icon" href="/favicon.ico" />
+        <script type="text/javascript" src="/js/generateArticleId.js"></script>
+      </Head>
+      <Layout>
+        <h1 className={utilStyles.pageTitle}>GENERATE ID</h1>
+        <h2>Unique ID: {uniqueId}</h2>
+      </Layout>
+    </>
+  )
+}
+
+export const getStaticProps: GetStaticProps = async () => {
+  return {
+    props: {
+      uniqueId: generateUniqueId(Object.keys(articleIds)),
+    }
+  }
+}
diff --git a/pages/tags/[tag].tsx b/pages/tags/[tag].tsx
@@ -3,6 +3,7 @@ import ArticleList from '../../components/ArticleList'
 import Head from 'next/head'
 import utilStyles from '../../components/styles/util.module.scss'
 import { GetStaticProps, GetStaticPaths } from 'next'
+import { getSortedArticles } from '../../lib/getArticle'
 import tagMap from '../../gen/tagMap.json'
 import { siteName } from '../../config/blog.config.json'
 
@@ -46,7 +47,7 @@ export const getStaticProps: GetStaticProps = async ({ params }) => {
   return {
     props: {
       tag: tag,
-      articles: tagMap[tag],
+      articles: getSortedArticles(),
     }
   }
 }