aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/HomepageFeatures/index.js71
-rw-r--r--src/components/HomepageFeatures/styles.module.css11
-rw-r--r--src/components/MessageBubble.js11
-rw-r--r--src/components/MessageBubble.module.css130
-rw-r--r--src/css/custom.css48
-rw-r--r--src/pages/index.js43
-rw-r--r--src/pages/index.module.css23
-rw-r--r--src/pages/markdown-page.md7
-rw-r--r--src/pages/my-markdown-page.md3
-rw-r--r--src/pages/my-react-page.js11
-rw-r--r--src/theme/MDXComponents.js12
11 files changed, 370 insertions, 0 deletions
diff --git a/src/components/HomepageFeatures/index.js b/src/components/HomepageFeatures/index.js
new file mode 100644
index 00000000..6d4f5799
--- /dev/null
+++ b/src/components/HomepageFeatures/index.js
@@ -0,0 +1,71 @@
+import clsx from 'clsx';
+import Heading from '@theme/Heading';
+import styles from './styles.module.css';
+
+const FeatureList = [
+ {
+ title: '一般質問',
+ docs: '/docs/ippan-situmon',
+ Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default,
+ description: (
+ <>
+ 安竹のこれまでの一般質問をまとめています。
+ </>
+ ),
+ },
+ {
+ title: '議案等',
+ docs: '/docs/gian-tou',
+ Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default,
+ description: (
+ <>
+ 主な議案・請願等についてまとめています。
+ </>
+ ),
+ },
+ {
+ title: '発達',
+ docs: '/docs/hattatu',
+ Svg: require('@site/static/img/undraw_docusaurus_react.svg').default,
+ description: (
+ <>
+ 発達に関してまとめています。
+ </>
+ ),
+ },
+];
+
+function Feature({Svg, title, docs, description}) {
+ return (
+ <div className={clsx('col col--4')}>
+ <a
+ className={styles.feartureLink}
+ href={docs}
+ target='_blank'
+ rel='noopener noreferrer'
+ >
+ <div className="text--center">
+ <Svg className={styles.featureSvg} role="img" />
+ </div>
+ <div className="text--center padding-horiz--md">
+ <Heading as="h3">{title}</Heading>
+ <p>{description}</p>
+ </div>
+ </a>
+ </div>
+ );
+}
+
+export default function HomepageFeatures() {
+ return (
+ <section className={styles.features}>
+ <div className="container">
+ <div className="row">
+ {FeatureList.map((props, idx) => (
+ <Feature key={idx} {...props} />
+ ))}
+ </div>
+ </div>
+ </section>
+ );
+}
diff --git a/src/components/HomepageFeatures/styles.module.css b/src/components/HomepageFeatures/styles.module.css
new file mode 100644
index 00000000..b248eb2e
--- /dev/null
+++ b/src/components/HomepageFeatures/styles.module.css
@@ -0,0 +1,11 @@
+.features {
+ display: flex;
+ align-items: center;
+ padding: 2rem 0;
+ width: 100%;
+}
+
+.featureSvg {
+ height: 200px;
+ width: 200px;
+}
diff --git a/src/components/MessageBubble.js b/src/components/MessageBubble.js
new file mode 100644
index 00000000..d64cf6ed
--- /dev/null
+++ b/src/components/MessageBubble.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import styles from './MessageBubble.module.css';
+
+export default function MessageBubble({children, speaker, align, id}) {
+ let className = ("left" === align) ? [styles.bln, styles.bleft].join(' ') : [styles.bln, styles.bright].join(' ');
+ return (
+ <div className={className} data-speaker={speaker} id={id}>
+ {children}
+ </div>
+ );
+} \ No newline at end of file
diff --git a/src/components/MessageBubble.module.css b/src/components/MessageBubble.module.css
new file mode 100644
index 00000000..57d842b9
--- /dev/null
+++ b/src/components/MessageBubble.module.css
@@ -0,0 +1,130 @@
+:root {
+ --left-bg: var(--ifm-color-success-contrast-background);
+ --left-fg: var(--ifm-color-success-contrast-foreground);
+ --right-bg: var(--ifm-color-warning-contrast-background);
+ --right-fg: var(--ifm-color-warning-contrast-foreground);
+}
+
+.bln {
+ border-radius: 10px;
+ position: relative;
+ padding: 1rem;
+ max-width: 90%;
+ }
+ .bln.bleft {
+ background-color: var(--left-bg);
+ color: var(--left-fg);
+ margin: 1rem auto 1rem 4%;
+ }
+ .bln.bleft.gityo {
+ background-color: #ecedff;
+ }
+ .bln.bright {
+ background-color: var(--right-bg);
+ color: var(--right-fg);
+ margin: 1rem 4% 1rem auto;
+ }
+
+ /* 吹き出し三角部分 */
+ .bln::before{
+ border-style: solid;
+ content: '';
+ display: block;
+ position: absolute;
+ width: 0;
+ height: 0;
+ bottom: 3px;
+ }
+ .bln.bleft::before {
+ border-color: transparent var(--left-bg) transparent transparent;
+ border-width: 8px 22px 6px 0;
+ left: -15px;
+ rotate: -40deg;
+ }
+ .bln.bleft.gityo::before {
+ border-color: transparent #ecedff transparent transparent;
+ }
+ .bln.bright::before {
+ border-color: transparent transparent transparent var(--right-bg);
+ border-width: 8px 0 6px 22px;
+ right: -15px;
+ rotate: 40deg;
+ }
+
+ /* 吹き出し話者部分 */
+ .bln::after {
+ color: var(--ifm-color-content-secondary);
+ content: attr(data-speaker);
+ position: absolute;
+ font-size: 0.8rem;
+ top: -1.2rem;
+ white-space:nowrap;
+ }
+
+ .bln.bleft::after {
+ left: 0.5rem;
+ }
+ .bln.bright::after {
+ right: 0.5rem;
+ text-align:right;
+ }
+
+ /* 吹き出し内部 */
+ .bln>p:not(:last-child) {
+ margin-top: 0;
+ }
+ .bln>p:last-child {
+ margin: 0;
+ }
+
+ /* 吹き出しthougt, smile　*/
+ .bln.bleft.thought,
+ .bln.bleft.smile,
+ .bln.bleft.weary,
+ .bln.bleft.anger,
+ .bln.bleft.sorry,
+ .bln.bleft.search {
+ border: 6px dotted var(--left-bg-dark);
+ background-color:unset;
+ }
+ .bln.bleft.thought::before,
+ .bln.bleft.smile::before,
+ .bln.bleft.weary::before,
+ .bln.bleft.anger::before,
+ .bln.bleft.sorry::before,
+ .bln.bleft.search::before {
+ border-width: 0;
+ content: "🤔";
+ left: -2.5rem;
+ top:0;
+ }
+ .bln.bleft.smile::before {
+ content: "🙂";
+ }
+ .bln.bleft.weary::before {
+ content: "😩";
+ }
+ .bln.bleft.anger::before {
+ content: "💢";
+ }
+ .bln.bleft.sorry::before {
+ content: "🙏";
+ }
+ .bln.bleft.search::before {
+ content: "🔍";
+ }
+
+ @media only screen and (min-width: 800px) {
+ .bln {
+ max-width: 66%;
+ }
+ .bln.bleft.thought::before,
+ .bln.bleft.smile::before,
+ .bln.bleft.weary::before,
+ .bln.bleft.anger::before,
+ .bln.bleft.sorry::before,
+ .bln.bleft.search::before {
+ left: -3rem;
+ }
+ }
+ \ No newline at end of file
diff --git a/src/css/custom.css b/src/css/custom.css
new file mode 100644
index 00000000..ecc9f8f4
--- /dev/null
+++ b/src/css/custom.css
@@ -0,0 +1,48 @@
+/**
+ * Any CSS included here will be global. The classic template
+ * bundles Infima by default. Infima is a CSS framework designed to
+ * work well for content-centric websites.
+ */
+
+/* You can override the default Infima variables here. */
+:root {
+ --ifm-color-primary: #2e8555;
+ --ifm-color-primary-dark: #29784c;
+ --ifm-color-primary-darker: #277148;
+ --ifm-color-primary-darkest: #205d3b;
+ --ifm-color-primary-light: #33925d;
+ --ifm-color-primary-lighter: #359962;
+ --ifm-color-primary-lightest: #3cad6e;
+ --ifm-code-font-size: 95%;
+ --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
+}
+
+/* For readability concerns, you should choose a lighter palette in dark mode. */
+[data-theme='dark'] {
+ --ifm-color-primary: #25c2a0;
+ --ifm-color-primary-dark: #21af90;
+ --ifm-color-primary-darker: #1fa588;
+ --ifm-color-primary-darkest: #1a8870;
+ --ifm-color-primary-light: #29d5b0;
+ --ifm-color-primary-lighter: #32d8b4;
+ --ifm-color-primary-lightest: #4fddbf;
+ --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.3);
+}
+
+/* 短いメッセージでは吹き出しを縮小するため */
+#situgi {
+ display: flex;
+ flex-direction: column;
+}
+
+p, .menu__link, .table-of-contents li {
+ text-align: justify;
+}
+
+ul.table-of-contents a[href^="#bold-"] {
+ font-weight: bold;
+}
+
+.docusaurus-mermaid-container {
+ text-align: center;
+} \ No newline at end of file
diff --git a/src/pages/index.js b/src/pages/index.js
new file mode 100644
index 00000000..30b92acc
--- /dev/null
+++ b/src/pages/index.js
@@ -0,0 +1,43 @@
+import clsx from 'clsx';
+import Link from '@docusaurus/Link';
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import Layout from '@theme/Layout';
+import HomepageFeatures from '@site/src/components/HomepageFeatures';
+
+import Heading from '@theme/Heading';
+import styles from './index.module.css';
+
+function HomepageHeader() {
+ const {siteConfig} = useDocusaurusContext();
+ return (
+ <header className={clsx('hero hero--primary', styles.heroBanner)}>
+ <div className="container">
+ <Heading as="h1" className="hero__title">
+ {siteConfig.title}
+ </Heading>
+ <p className="hero__subtitle">{siteConfig.tagline}</p>
+ <div className={styles.buttons}>
+ <Link
+ className="button button--secondary button--lg"
+ to="https://yasutakeyohei.com/">
+ 安竹洋平のオフィシャルサイトはこちら
+ </Link>
+ </div>
+ </div>
+ </header>
+ );
+}
+
+export default function Home() {
+ const {siteConfig} = useDocusaurusContext();
+ return (
+ <Layout
+ title={`Hello from ${siteConfig.title}`}
+ description="Description will go into a meta tag in <head />">
+ <HomepageHeader />
+ <main>
+ <HomepageFeatures />
+ </main>
+ </Layout>
+ );
+}
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
new file mode 100644
index 00000000..9f71a5da
--- /dev/null
+++ b/src/pages/index.module.css
@@ -0,0 +1,23 @@
+/**
+ * CSS files with the .module.css suffix will be treated as CSS modules
+ * and scoped locally.
+ */
+
+.heroBanner {
+ padding: 4rem 0;
+ text-align: center;
+ position: relative;
+ overflow: hidden;
+}
+
+@media screen and (max-width: 996px) {
+ .heroBanner {
+ padding: 2rem;
+ }
+}
+
+.buttons {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
diff --git a/src/pages/markdown-page.md b/src/pages/markdown-page.md
new file mode 100644
index 00000000..9756c5b6
--- /dev/null
+++ b/src/pages/markdown-page.md
@@ -0,0 +1,7 @@
+---
+title: Markdown page example
+---
+
+# Markdown page example
+
+You don't need React to write simple standalone pages.
diff --git a/src/pages/my-markdown-page.md b/src/pages/my-markdown-page.md
new file mode 100644
index 00000000..f367dc6d
--- /dev/null
+++ b/src/pages/my-markdown-page.md
@@ -0,0 +1,3 @@
+# My Markdown page
+
+This is a Markdown page \ No newline at end of file
diff --git a/src/pages/my-react-page.js b/src/pages/my-react-page.js
new file mode 100644
index 00000000..2f6c2a34
--- /dev/null
+++ b/src/pages/my-react-page.js
@@ -0,0 +1,11 @@
+import React from 'react';
+import Layout from '@theme/Layout';
+
+export default function MyReactPage() {
+ return (
+ <Layout>
+ <h1>My React page</h1>
+ <p>This is a React page</p>
+ </Layout>
+ );
+} \ No newline at end of file
diff --git a/src/theme/MDXComponents.js b/src/theme/MDXComponents.js
new file mode 100644
index 00000000..5af587d9
--- /dev/null
+++ b/src/theme/MDXComponents.js
@@ -0,0 +1,12 @@
+import React from 'react';
+// Import the original mapper
+import MDXComponents from '@theme-original/MDXComponents';
+import MessageBubble from '@site/src/components/MessageBubble';
+
+export default {
+ // Re-use the default mapping
+ ...MDXComponents,
+ // Map the "<MessageBubble>" tag to our MessageBubble component
+ // `MessageBubble` will receive all props that were passed to `<MessageBubble>` in MDX
+ MessageBubble,
+}; \ No newline at end of file
generated by cgit v1.2.3-54-g00ecf (git 2.39.0) at 2024-11-15 04:36:40 +0000