Merge pull request #124 from ryo4004/add-get-terms

最新の利用規約が表示されるようにする
winds-nagaoka · Apr 26, 2024 · 9b3dc32 · 9b3dc32
2 parents 2715736 + 65ca798
commit 9b3dc32
Show file tree

Hide file tree

Showing 5 changed files with 60 additions and 584 deletions.
diff --git a/src/config/index.ts b/src/config/index.ts
@@ -3,3 +3,4 @@ export const APP_API_URL = process.env.REACT_APP_APP_API_URL as string
 export const SCORE_API_URL = process.env.REACT_APP_SCORE_API_URL as string
 export const API_PATH = process.env.REACT_APP_API_PATH as string
 export const VERSION = process.env.REACT_APP_VERSION as string
+export const GITHUB_WINDS_TERMS = 'https://raw.githubusercontent.com/winds-nagaoka/terms/master/terms.txt'
diff --git a/src/features/setting/api/getWindsTerms.ts b/src/features/setting/api/getWindsTerms.ts
@@ -0,0 +1,14 @@
+import { useQuery } from 'react-query'
+import { GITHUB_WINDS_TERMS } from '../../../config'
+import { getTextApi } from '../../../library/fetch'
+
+const getWindsTerms = async () => {
+  return await getTextApi(GITHUB_WINDS_TERMS)
+}
+
+export const useWindsTerms = () => {
+  return useQuery({
+    queryKey: ['winds-terms'],
+    queryFn: async () => await getWindsTerms(),
+  })
+}
diff --git a/src/features/setting/components/TermsDetail.module.scss b/src/features/setting/components/TermsDetail.module.scss
@@ -44,163 +44,16 @@
     }
   }
 
-  .provision {
-    margin: 16px 0;
-
-    display: grid;
-    grid-template-columns: 64px 1fr;
-    grid-template-columns: max-content 1fr;
-
-    .sub-title {
-      grid-row: 1/2;
-      grid-column: 1/3;
-    }
-
-    & > div {
-      margin: 2px 0;
-    }
-
-    .list-number {
-      grid-row: 2/3;
-      grid-column: 1/2;
-      text-align: left;
-
-      & + div {
-        grid-row: 2/3;
-        grid-column: 2/3;
-      }
-    }
-
-    .list-number-second {
-      grid-row: 3/4;
-      grid-column: 1/2;
-      text-align: right;
-
-      & + div {
-        grid-row: 3/4;
-        grid-column: 2/3;
-      }
-    }
-
-    .list-number-third {
-      grid-row: 4/5;
-      grid-column: 1/2;
-      text-align: right;
-
-      & + div {
-        grid-row: 4/5;
-        grid-column: 2/3;
-      }
-    }
-
-    .list-number-fourth {
-      grid-row: 5/6;
-      grid-column: 1/2;
-      text-align: right;
-
-      & + div {
-        grid-row: 5/6;
-        grid-column: 2/3;
-      }
-    }
-
-    .list-number-fifth {
-      grid-row: 6/7;
-      grid-column: 1/2;
-      text-align: right;
-
-      & + div {
-        grid-row: 6/7;
-        grid-column: 2/3;
-      }
-    }
-
-    .list-number-sixth {
-      grid-row: 7/8;
-      grid-column: 1/2;
-      text-align: right;
-
-      & + div {
-        grid-row: 7/8;
-        grid-column: 2/3;
-      }
-    }
+  .monospaced {
+    font-family: 'Courier New', Consolas, monospace;
   }
 
-  .supplementary-provision {
+  .sub-title {
     h3 {
-      font-weight: bold;
-      color: #333;
-
-      &:before {
-        content: none;
-      }
-
-      &:after {
-        content: none;
-      }
-    }
-  }
-
-  h3 {
-    margin: 0;
-    font-weight: normal;
-    font-size: 14px;
-    color: #666;
-
-    &:before {
-      content: '(';
-    }
-
-    &:after {
-      content: ')';
-    }
-  }
-
-  h2 {
-    margin: 0 0.5em 0 0;
-    font-weight: bold;
-    font-size: 14px;
-  }
-
-  p {
-    margin: 0;
-    font-size: 14px;
-  }
-
-  table {
-    font-size: 14px;
-    text-align: left;
-
-    th {
-      padding: 0 0.5em 0 0;
+      margin: 0;
       font-weight: normal;
-    }
-
-    td {
-      padding: 0;
-    }
-  }
-
-  ol {
-    margin: 0;
-    padding: 0;
-    // list-style-type: cjk-ideographic;
-    list-style-type: none;
-    font-size: 14px;
-
-    li {
-      span {
-        margin-right: 0.5em;
-
-        &:before {
-          content: '(';
-        }
-
-        &:after {
-          content: ')';
-        }
-      }
+      font-size: 14px;
+      color: #666;
     }
   }
 }