From 2694332f4625ac60a11a2fc3cd79dcfa0206cfb7 Mon Sep 17 00:00:00 2001 From: kokoakuma Date: Wed, 13 Mar 2024 13:08:27 +0000 Subject: [PATCH 01/68] add privacy policy text --- apps/web/app/content/en/privacy/index.md | 110 ++++++++++++++++++++++ apps/web/app/content/ja/privacy/index.md | 111 +++++++++++++++++++++++ 2 files changed, 221 insertions(+) create mode 100644 apps/web/app/content/en/privacy/index.md create mode 100644 apps/web/app/content/ja/privacy/index.md diff --git a/apps/web/app/content/en/privacy/index.md b/apps/web/app/content/en/privacy/index.md new file mode 100644 index 00000000..afc94ee7 --- /dev/null +++ b/apps/web/app/content/en/privacy/index.md @@ -0,0 +1,110 @@ +Vue Fes Japan 2024 (the "Conference") recognizes the importance of protecting the personal information of conference participants and sponsors (the "Users"). + +In order to comply with the laws regarding the protection of personal information, we are committed to the appropriate handling, protection, and continual improvement of personal information in accordance with the following privacy policy (hereinafter referred to as the "Privacy Policy"). + +## Definition of Personal Information + +In this Privacy Policy, "personal information" means information about a living individual as defined in the Personal Information Protection Law that can be used to identify a specific individual by name, date of birth, or other description contained in the information (including information that can be easily cross-checked with other information and thereby used to identify a specific individual). (including information that can be easily matched with other information to identify a specific individual), or information that contains a personal identification code. + +## Collection of Personal Information + +This conference shall obtain personal information by legal and fair means, and shall not obtain personal information illegally against the user's will. + +The conference handles the following personal information of users + +- Email address + - Email address entered on this website + - Email address entered on various application form such as sponsors, CFP, etc + - Email address entered when purchasing tickets on PassMarket +- Name + - Name entered on various application form such as sponsors, CFP, etc + - Name entered when creating a name card + - Name entered when purchasing tickets on PassMarket +- Avator image + - Avator image uploaded when creating a name card +- Others + - Occupation, age, years of work experience entered when purchasing tickets on PassMarket + +## Purpose of use of personal information + +The Conference will use the personal information collected from users for the following purposes + +1. To provide updated and related information on this conference +2. To respond to inquiries and information regarding our conference +3. To request users to provide their opinions and impressions of our conference +4. To issue a warning or caution to a user who has committed or may commit an act that violates any of the terms and conditions of this conference +5. When requesting a user who owes a debt to this conference to fulfill that debt +6. When notifying a User of changes to the terms and conditions of this Conference + +## Changes to the Purpose of Use of Personal Information + +This conference may change the purposes for which personal information is used to the extent that it is reasonably deemed to be relevant, and will notify or publicly announce any such changes to those involved with this conference. Any changes to this Privacy Policy shall become effective when this Privacy Policy is posted on this website. + +## Term of Use of Personal Information + +The Conference will use personal information collected from users until November 30, 2024, the month in which the conference is held. After the expiration date, the personal information will be completely deleted as soon as possible. + +## Safe Management of Personal Information + +The conference will exercise necessary and appropriate supervision over the Vue.js Japan User Group and its related parties to ensure the safe management of personal information against risks such as loss, destruction, alteration, and leakage of personal information. + +## Outsourcing of Personal Information + +In order to provide better services to our customers, we may outsource a part of our business operations. In such cases, personal information may be entrusted to the subcontractor. In such cases, we will select a subcontractor that satisfies sufficient standards for the protection of personal information, conclude a subcontracting agreement regarding the protection of personal information, and implement management and supervision of the subcontractor. + +## Provision of Personal Information to Third Parties + +The Conference will not disclose or provide collected personal information to third parties other than subcontractors in accordance with the Personal Information Protection Law. However, this shall not apply in the following cases + +- When disclosure is permitted by law +- When disclosure is required by law +- When disclosure is necessary for the protection of the life, body, or property of an individual and it is difficult to obtain the consent of the individual. +- When disclosure is requested by the police, prosecutors, courts, or other public authorities. + +## Maintenance of Up-to-dateness and Accuracy of Personal Information, etc. + +The Conference will endeavor to maintain accurate and up-to-date personal information to the extent necessary to achieve the purpose of use. + +## Reference, Correction, Deletion, etc. of Personal Information + +When a user requests that the conference reference, correct, add, delete, stop using, or erase the user's personal information, the conference will confirm the identity of the user. If we determine that the inquiry is made by the user himself/herself, we will respond to the inquiry within a reasonable period of time. + +## Use and Purpose of Cookies and Similar Technologies + +The Conference's website uses cookies and similar technologies. These technologies use cookies to collect information in order to improve the usability of this website and to analyze its usage. + +## Third Party Cookies Used + +In order to improve the use and usability of this website, we use a service provided by a third party, which may set cookies. The Third Party services used by the Conference are as follows + +- Google Analytics +- Google Forms +- Google Presentations +- Fortee + +The data acquired through the use of third party cookies is acquired and managed in accordance with the privacy policy of the operator of each service. + +Please refer to the privacy policy of the operator of the respective service for a description of their cookies. + +- Google's Privacy Policy +- Fortee's Privacy Policy + +## Deleting or Disabling Cookies + +Most web browsers are initially set up to automatically receive cookies, but you can change your browser settings to refuse cookies or to warn you when a cookie is being sent. + +For more information on adjusting or changing your web browser settings, please refer to your web browser's help screen. Please note that if you disable cookies used on the Conference website, it may affect your use of the website, for example, you may not be able to access certain parts of the website or you may not be able to use all or part of the website. Please be aware of this beforehand. + +Cookies on this website are stored for a maximum of two years from the date of the user's last visit to this website. + +## Continuous Improvement + +The Conference will review its handling of personal information from time to time in an effort to make continual improvements, and may change this Privacy Policy from time to time as necessary. + +## Inquiries + +For requests for disclosure, opinions, questions, complaints, and other inquiries regarding the handling of personal information, please contact us by e-mail at vuefes+privacy@gmail.com. + +## Supplementary Provisions + +The Conference shall not disclose or provide collected personal information to third parties other than subcontractors in accordance with the Personal Information Protection Law. However, this does not apply in the following cases. diff --git a/apps/web/app/content/ja/privacy/index.md b/apps/web/app/content/ja/privacy/index.md new file mode 100644 index 00000000..e4b8d3a6 --- /dev/null +++ b/apps/web/app/content/ja/privacy/index.md @@ -0,0 +1,111 @@ +Vue Fes Japan 2024(以下、 カンファレンス)では、カンファレンスへの参加者およびスポンサー(以下、ユーザー)の個人情報保護の重要性について認識しています。 + +個人情報の保護に関する法律を遵守できるよう、以下のプライバシーポリシー(以下、本プライバシーポリシー)に従い、適切な取扱い、保護そして継続的改善に努めます。 + +## 個人情報の定義 + +本プライバシーポリシーにおいて、「個人情報」とは、個人情報保護法にいう、生存する個人に関する情報であり、当該情報に含まれる氏名、生年月日その他の記述等により特定の個人を識別することができるもの(他の情報と容易に照合することができ、それにより特定の個人を識別することができることとなるものを含みます)、もしくは個人識別符号が含まれる情報を意味するものとします。 + +## 個人情報の収集 + +当カンファレンスは、個人情報の入手を適法かつ公正な手段によって行うものとし、ユーザーの意思に反する不正な入手を行わないものとします。 + +当カンファレンスでは、ユーザーの以下の個人情報を取り扱います。 + +- メールアドレス + - 本ウェブサイトで入力されたメールアドレス + - スポンサー、CFP など各種お申し込みフォームで入力されたメールアドレス + - PassMarket でのチケット購入時に入力されたメールアドレス +- 名前 + - スポンサー、CFP など各種お申し込みフォームで入力されたお名前 + - ネームカード作成時に入力されたお名前 + - PassMarket でのチケット購入時に入力されたお名前 +- アバター画像 + - ネームカード作成時にアップロードされたアバター画像 +- その他 + - PassMarket でのチケット購入時に入力された職業、年齢、仕事の経験年数 + +## 個人情報の利用目的 + +当カンファレンスは、ユーザーから収集した個人情報を、以下の目的で利用するものとします。 + +1. 当カンファレンスの更新情報、関連情報をご提供する場合 +1. 当カンファレンスに関するご案内、お問い合わせ等へ対応する場合 +1. ユーザーに対して当カンファレンスに対する意見、感想のご提供を求める場合 +1. 当カンファレンス各規約等に違反する行為又はその恐れのある行為を行ったユーザーに対して注意又は警告を行う場合 + 当カンファレンスに対する債務を有するユーザーに同債務の履行を要求する場合 +1. 当カンファレンスに関する規約等の変更などを通知する場合 + +## 個人情報利用目的の変更 + +当カンファレンスは、個人情報の利用目的を、関連性を有すると合理的に認められる範囲内において変更することがあり、変更した場合には当カンファレンスに関わる皆様に通知又は公表します。本プライバシーポリシーの変更は、本プライバシーポリシーを本ウェブサイト上に掲載した時点で効力を生じるものとします。 + +## 個人情報の利用期限 + +当カンファレンスは、ユーザーから収集した個人情報を開催月の 2024 年 11 月 30 日まで利用するものとします。その利用期限が過ぎましたら、速やかに個人情報を完全に削除します。 + +## 個人情報の安全管理 + +当カンファレンスは、個人情報の紛失、破壊、改ざん及び漏洩などのリスクに対して、個人情報の安全管理が図られるよう、Vue.js 日本ユーザーグループおよびその関係者に対し、必要かつ適切な監督を行います。 + +## 個人情報の委託 + +当カンファレンスは、業務運営上、お客様により良いサービスを提供するために、業務の一部を外部に委託することがあります。その際に業務委託先に個人情報を預けることがあります。この場合、十分な個人情報の保護の水準を満たしている委託先を選定し、個人情報の保護に関する委託契約を締結すると共に、委託先に対する管理・監督を実施いたします。 + +## 個人情報の第三者提供 + +当カンファレンスは、収集した個人情報を個人情報保護法に基づき業務委託先以外の第三者に対して開示又は提供しないものとします。ただし、以下に該当する場合は、この限りではありません。 + +- 法令により開示が認められている場合 +- 法令により開示を求められた場合 +- 人の生命、身体又は財産の保護のために必要がある場合であって、本人の同意を得ることが困難である場合 +- 警察、検察、裁判所等公的機関等によって開示を求められた場合 + +## 個人情報等の最新性、正確性の維持 + +当カンファレンスは、利用目的の達成に必要な範囲内において、ユーザーの個人情報等を正確かつ最新の内容に保つよう努めるものとします。 + +## 個人情報の照会、訂正、削除等 + +当カンファレンスは、ユーザーより当該ユーザーの個人情報の照会、訂正、追加、削除、利用の停止又は消去を求められた場合、本人確認を行うものとします。なお、当カンファレンスは、ユーザー本人による照会等であると当カンファレンスが判断した場合、合理的な期間内に同照会等に対応するものとします。 + +## Cookie または類似技術の利用と目的 + +当カンファレンスのウェブサイトは、Cookie 及び類似技術を利用します。これらの技術で、本ウェブサイトの利便性の向上および利用状況を分析するために、Cookie を利用して情報を収集しています。 + +## 使用する Third Party Cookie + +当カンファレンスでは、本ウェブサイトの利用状況や利便性を向上させるために、Third Party が提供するサービスを利用しており、その Third Party によって Cookie が設定されることがあります。当カンファレンスで利用している Third Party のサービスは以下のとおりです。 + +- Google Analytics +- Google フォーム +- Google プレゼンテーション + +Third Party それぞれの Cookie の利用により取得されたデータは、各サービスの運営会社が定めるプライバシーポリシーに従って取得、管理されます。 + +当該運営会社のプライバシーポリシーや Cookie に関する説明は、以下をご参照ください。 + +- Google 社の [プライバシーポリシー](https://policies.google.com/privacy?hl=ja){:target="\_blank"} + +## Cookie の削除又は無効化 + +ほとんどのウェブブラウザでは自動的に Cookie を受信するよう初期設定されていますが、ユーザー自身で Cookie を拒否したり、Cookie が送信された際に警告が表示されたりするように設定変更できます。Cookie の管理にはいくつもの方法があります。 + +ウェブブラウザ設定の調整、変更に関する詳細は、お使いのウェブブラウザのヘルプ画面等をご覧ください。なお、ユーザーが当カンファレンスのウェブサイトで使用する Cookie を無効化すると、本ウェブサイトの特定箇所にアクセスできなかったり、本ウェブサイトの全部又は一部が利用できなくなったりする等、本ウェブサイトご利用中の動作に影響を及ぼす可能性があります。予めご了承ください。 + +本ウェブサイト上における Cookie の保存期間は、ユーザーが本ウェブサイトに最後に訪問した日から最長で 2 年間です。 + +## 継続的改善 + +当カンファレンスでは、個人情報の取扱いに関する運用状況を適宜見直し、継続的な改善に努めるものとし、必要に応じて、本プライバシーポリシーを変更することがあります。 + +## お問い合わせ + +開示等のお申出、ご意見、ご質問、苦情のお申出その他個人情報の取扱いに関するお問い合わせは、メールにて [vuefes+privacy@gmail.com](mailto:vuefes+privacy@gmail.com){:target="\_blank"} にお問い合わせください。 + +## 附則 + +当カンファレンスは、収集した個人情報を個人情報保護法に基づき業務委託先以外の第三者に対して開示又は提供しないものとします。ただし、以下に該当する場合は、この限りではありません。 + +- 2023 年 4 月 13 日 制定・施行 +- 2023 年 8 月 10 日 改定 From 1607b2fcb75f9ef128d94d8d50e59f7d6592d5c9 Mon Sep 17 00:00:00 2001 From: kokoakuma Date: Thu, 14 Mar 2024 14:13:00 +0000 Subject: [PATCH 02/68] move text file --- apps/web/app/composables/useLocale.ts | 1 + .../en/{privacy/index.md => privacy.md} | 24 ++++++++---------- .../ja/{privacy/index.md => privacy.md} | 25 +++++++++---------- 3 files changed, 24 insertions(+), 26 deletions(-) rename apps/web/app/content/en/{privacy/index.md => privacy.md} (89%) rename apps/web/app/content/ja/{privacy/index.md => privacy.md} (90%) diff --git a/apps/web/app/composables/useLocale.ts b/apps/web/app/composables/useLocale.ts index c50dcc6f..12b9d1a0 100644 --- a/apps/web/app/composables/useLocale.ts +++ b/apps/web/app/composables/useLocale.ts @@ -9,6 +9,7 @@ export function useLocale(path: Path) { const docPath = computed(() => match(path) .with('form', () => `/${locale.value}/contact`) + .with('privacy', () => `/${locale.value}/privacy`) .exhaustive(), ) diff --git a/apps/web/app/content/en/privacy/index.md b/apps/web/app/content/en/privacy.md similarity index 89% rename from apps/web/app/content/en/privacy/index.md rename to apps/web/app/content/en/privacy.md index afc94ee7..2cd08eaa 100644 --- a/apps/web/app/content/en/privacy/index.md +++ b/apps/web/app/content/en/privacy.md @@ -13,17 +13,16 @@ This conference shall obtain personal information by legal and fair means, and s The conference handles the following personal information of users - Email address + - Email address entered on the application form for services involving delivery - Email address entered on this website - - Email address entered on various application form such as sponsors, CFP, etc - - Email address entered when purchasing tickets on PassMarket + - Email address entered on the application form for sponsors + - Email address entered on the application form for CFP + - Email address entered when purchasing tickets on Peatix - Name - - Name entered on various application form such as sponsors, CFP, etc - - Name entered when creating a name card - - Name entered when purchasing tickets on PassMarket -- Avator image - - Avator image uploaded when creating a name card -- Others - - Occupation, age, years of work experience entered when purchasing tickets on PassMarket + - Name entered on the application form for sponsors + - Name entered on the application form for CFP +- Address and phone number + - Address and phone number entered on the application form for services involving delivery ## Purpose of use of personal information @@ -42,7 +41,7 @@ This conference may change the purposes for which personal information is used t ## Term of Use of Personal Information -The Conference will use personal information collected from users until November 30, 2024, the month in which the conference is held. After the expiration date, the personal information will be completely deleted as soon as possible. +The Conference will use personal information collected from users until October 31, 2024, the month in which the conference is held. After the expiration date, the personal information will be completely deleted as soon as possible. ## Safe Management of Personal Information @@ -79,15 +78,14 @@ In order to improve the use and usability of this website, we use a service prov - Google Analytics - Google Forms -- Google Presentations - Fortee The data acquired through the use of third party cookies is acquired and managed in accordance with the privacy policy of the operator of each service. Please refer to the privacy policy of the operator of the respective service for a description of their cookies. -- Google's Privacy Policy -- Fortee's Privacy Policy +- [Google's Privacy Policy](https://policies.google.com/privacy){:target="\_blank"} +- [Fortee's Privacy Policy](https://fortee.jp/site/privacy){:target="\_blank"} ## Deleting or Disabling Cookies diff --git a/apps/web/app/content/ja/privacy/index.md b/apps/web/app/content/ja/privacy.md similarity index 90% rename from apps/web/app/content/ja/privacy/index.md rename to apps/web/app/content/ja/privacy.md index e4b8d3a6..4d381813 100644 --- a/apps/web/app/content/ja/privacy/index.md +++ b/apps/web/app/content/ja/privacy.md @@ -13,17 +13,16 @@ Vue Fes Japan 2024(以下、 カンファレンス)では、カンファレ 当カンファレンスでは、ユーザーの以下の個人情報を取り扱います。 - メールアドレス + - 配送が伴うサービスのお申し込みフォームで入力されたメールアドレス - 本ウェブサイトで入力されたメールアドレス - - スポンサー、CFP など各種お申し込みフォームで入力されたメールアドレス - - PassMarket でのチケット購入時に入力されたメールアドレス + - スポンサーお申し込みフォームで入力されたメールアドレス + - CFP お申し込みフォームで入力されたメールアドレス + - Peatix でのチケット購入時に入力されたメールアドレス - 名前 - - スポンサー、CFP など各種お申し込みフォームで入力されたお名前 - - ネームカード作成時に入力されたお名前 - - PassMarket でのチケット購入時に入力されたお名前 -- アバター画像 - - ネームカード作成時にアップロードされたアバター画像 -- その他 - - PassMarket でのチケット購入時に入力された職業、年齢、仕事の経験年数 + - スポンサーお申し込みフォームで入力されたご担当者名 + - CFP お申し込みフォームで入力されたお名前 +- 住所、電話番号 + - 配送が伴うサービスのお申し込みフォームで入力された住所、電話番号 ## 個人情報の利用目的 @@ -42,7 +41,7 @@ Vue Fes Japan 2024(以下、 カンファレンス)では、カンファレ ## 個人情報の利用期限 -当カンファレンスは、ユーザーから収集した個人情報を開催月の 2024 年 11 月 30 日まで利用するものとします。その利用期限が過ぎましたら、速やかに個人情報を完全に削除します。 +当カンファレンスは、ユーザーから収集した個人情報を開催月の 2024 年 10 月 31 日まで利用するものとします。その利用期限が過ぎましたら、速やかに個人情報を完全に削除します。 ## 個人情報の安全管理 @@ -79,13 +78,14 @@ Vue Fes Japan 2024(以下、 カンファレンス)では、カンファレ - Google Analytics - Google フォーム -- Google プレゼンテーション +- Fortee Third Party それぞれの Cookie の利用により取得されたデータは、各サービスの運営会社が定めるプライバシーポリシーに従って取得、管理されます。 当該運営会社のプライバシーポリシーや Cookie に関する説明は、以下をご参照ください。 - Google 社の [プライバシーポリシー](https://policies.google.com/privacy?hl=ja){:target="\_blank"} +- Fortee 社の [プライバシーポリシー](https://fortee.jp/site/privacy){:target="\_blank"} ## Cookie の削除又は無効化 @@ -107,5 +107,4 @@ Third Party それぞれの Cookie の利用により取得されたデータは 当カンファレンスは、収集した個人情報を個人情報保護法に基づき業務委託先以外の第三者に対して開示又は提供しないものとします。ただし、以下に該当する場合は、この限りではありません。 -- 2023 年 4 月 13 日 制定・施行 -- 2023 年 8 月 10 日 改定 +- 2024 年 4 月 1 日 制定・施行 From 988e04fbab1b8407ca01acb4812faad615597add Mon Sep 17 00:00:00 2001 From: kokoakuma Date: Thu, 14 Mar 2024 14:13:20 +0000 Subject: [PATCH 03/68] show md text --- apps/web/app/pages/privacy.vue | 22 +++++++++++++++++++++- packages/model/lib/path.ts | 2 +- 2 files changed, 22 insertions(+), 2 deletions(-) diff --git a/apps/web/app/pages/privacy.vue b/apps/web/app/pages/privacy.vue index af23fce5..d68b521a 100644 --- a/apps/web/app/pages/privacy.vue +++ b/apps/web/app/pages/privacy.vue @@ -1 +1,21 @@ - + + + + + \ No newline at end of file diff --git a/packages/model/lib/path.ts b/packages/model/lib/path.ts index 8c7ea095..e819e2ac 100644 --- a/packages/model/lib/path.ts +++ b/packages/model/lib/path.ts @@ -1 +1 @@ -export type Path = 'form' +export type Path = 'form' | 'privacy' From a5e966ace2c5fdfee6b2a53f3f4321acfbe45c3b Mon Sep 17 00:00:00 2001 From: kokoakuma Date: Thu, 14 Mar 2024 15:47:04 +0000 Subject: [PATCH 04/68] wip add css --- apps/web/app/assets/base.css | 1 + apps/web/app/pages/privacy.vue | 66 ++++++++++++++++++++++++++++++++-- 2 files changed, 65 insertions(+), 2 deletions(-) diff --git a/apps/web/app/assets/base.css b/apps/web/app/assets/base.css index cba8bbb4..c39dea40 100644 --- a/apps/web/app/assets/base.css +++ b/apps/web/app/assets/base.css @@ -12,6 +12,7 @@ /* color */ --color-vue-blue: #35495e; --color-vue-green: #42b983; + --color-white: #FFFFFF; /* zindex */ } diff --git a/apps/web/app/pages/privacy.vue b/apps/web/app/pages/privacy.vue index d68b521a..e8b25a64 100644 --- a/apps/web/app/pages/privacy.vue +++ b/apps/web/app/pages/privacy.vue @@ -1,13 +1,17 @@ \ No newline at end of file From 6343887c909986220e15aa7bfa8a9494b551cefc Mon Sep 17 00:00:00 2001 From: kokoakuma Date: Fri, 15 Mar 2024 14:26:31 +0000 Subject: [PATCH 05/68] modify md style --- apps/web/app/assets/base.css | 10 +++ apps/web/app/content/ja/privacy.md | 2 +- apps/web/app/pages/privacy.vue | 115 +++++++++++++++++++---------- 3 files changed, 86 insertions(+), 41 deletions(-) diff --git a/apps/web/app/assets/base.css b/apps/web/app/assets/base.css index c39dea40..b9677a4f 100644 --- a/apps/web/app/assets/base.css +++ b/apps/web/app/assets/base.css @@ -14,6 +14,16 @@ --color-vue-green: #42b983; --color-white: #FFFFFF; + /* markdown font */ + --h1-font-size: 45px; + --h1-font-size-mobile: 28px; + --h2-font-size: 24px; + --h2-font-size-mobile: 20px; + --h-line-height-ratio: 1.2; + --p-font-size: 18px; + --p-font-size-mobile: 16px; + --p-line-height-ratio: 1.8; + /* zindex */ } diff --git a/apps/web/app/content/ja/privacy.md b/apps/web/app/content/ja/privacy.md index 4d381813..d76807ed 100644 --- a/apps/web/app/content/ja/privacy.md +++ b/apps/web/app/content/ja/privacy.md @@ -32,7 +32,7 @@ Vue Fes Japan 2024(以下、 カンファレンス)では、カンファレ 1. 当カンファレンスに関するご案内、お問い合わせ等へ対応する場合 1. ユーザーに対して当カンファレンスに対する意見、感想のご提供を求める場合 1. 当カンファレンス各規約等に違反する行為又はその恐れのある行為を行ったユーザーに対して注意又は警告を行う場合 - 当カンファレンスに対する債務を有するユーザーに同債務の履行を要求する場合 +1. 当カンファレンスに対する債務を有するユーザーに同債務の履行を要求する場合 1. 当カンファレンスに関する規約等の変更などを通知する場合 ## 個人情報利用目的の変更 diff --git a/apps/web/app/pages/privacy.vue b/apps/web/app/pages/privacy.vue index e8b25a64..6777baba 100644 --- a/apps/web/app/pages/privacy.vue +++ b/apps/web/app/pages/privacy.vue @@ -25,59 +25,94 @@ import MarkDownText from '~/components/MarkDownText.vue' @import url("../assets/base.css"); @import url("../assets/media.css"); +/* margin等が5の倍数なので、一旦定数で定義 */ + .privacy-root { width: 100%; background-color: var(--color-white); + color: var(--color-vue-blue); display: flex; flex-direction: column; align-items: center; -} -.privacy-root h1 { - color: var(--color-vue-blue); - font-weight: 700; - font-size: 45px; - line-height: 54px; - margin-bottom: 40px; + + & h1 { + font-weight: 700; + font-size: var(--h1-font-size); + line-height: calc(var(--h1-font-size) * var(--h-line-height-ratio)); + margin-bottom: 40px; + } } .markdown-root { --tablet-width: 768px; max-width: var(--tablet-width); -} -.markdown-root :deep(p){ - color: var(--color-vue-blue); - font-weight: 500; - font-size: 18px; - line-height: 32.4px; - width: 100%; - /* marginが5の倍数なので、一旦定数で定義 */ - margin-bottom: 20px; -} + + & :deep(h2) { + margin-top: 40px; + margin-bottom: 20px; + } -.markdown-root :deep(h2) a{ - color: var(--color-vue-blue); - font-weight: 700; - font-size: 24px; - line-height: 28.8px; - text-decoration: none; - margin-top: 40px; - margin-bottom: 20px; -} + & :deep(h2) a { + color: var(--color-vue-blue); + font-weight: 700; + font-size: var(--h2-font-size); + line-height: calc(var(--h2-font-size) * var(--h-line-height-ratio)); + text-decoration: none; + } -.markdown-root :deep(ul){ - color: var(--color-vue-blue); - width: 100%; -} + & :deep(p), + & :deep(ul) li, + & :deep(ol) li { + color: var(--color-vue-blue); + font-weight: 500; + font-size: var(--p-font-size); + line-height: calc(var(--p-font-size) * var(--p-line-height-ratio)); + } -.markdown-root :deep(ul) li{ - color: var(--color-vue-blue); - font-weight: 700; - font-size: 18px; - line-height: 21.6px; + /* 箇条書きとパラグラフ内のリンク */ + & :deep(ul) li a, + & :deep(p) a { + color: var(--color-vue-green); + } + + & :deep(p) { + color: var(--color-vue-blue); + margin-bottom: 20px; + } +} + +@media (--tablet) { + .markdown-root { + width: 100%; + padding: 0 23.5px; + } } -.markdown-root :deep(ul) li ul li{ - color: var(--color-vue-blue); - font-weight: 500; - font-size: 18px; - line-height: 32.4px; + +@media (--mobile) { + .privacy-root { + & h1 { + font-weight: 700; + font-size: var(--h1-font-size-mobile); + line-height: calc(var(--h1-font-size-mobile) * var(--p-line-height-ratio)); + margin-bottom: 30px; + } + } + .markdown-root { + & :deep(h2) { + margin-top: 10px; + margin-bottom: 15px; + } + + & :deep(h2) a { + font-size: var(--ph2font-size-mobile); + line-height: calc(var(--h2-font-size-mobile) * var(--p-line-height-ratio)); + } + + & :deep(p), + & :deep(ul) li, + & :deep(ol) li { + font-size: var(--p-font-size-mobile); + line-height: calc(var(--p-font-size-mobile) * var(--p-line-height-ratio)); + } + } } \ No newline at end of file From 0774ddef64d29e8fada1a91d706c32833441414d Mon Sep 17 00:00:00 2001 From: totocalcio Date: Mon, 18 Mar 2024 16:05:37 +0900 Subject: [PATCH 06/68] feat: add FooterPageSection --- apps/web/app/components/FooterPageSection.vue | 216 +++++++++++++++++- packages/ui/assets/logo/vuefes_logo.svg | 3 +- 2 files changed, 217 insertions(+), 2 deletions(-) diff --git a/apps/web/app/components/FooterPageSection.vue b/apps/web/app/components/FooterPageSection.vue index 303a49ec..fa56eef3 100644 --- a/apps/web/app/components/FooterPageSection.vue +++ b/apps/web/app/components/FooterPageSection.vue @@ -1 +1,215 @@ - + + + + + diff --git a/packages/ui/assets/logo/vuefes_logo.svg b/packages/ui/assets/logo/vuefes_logo.svg index 1979d366..d8103140 100644 --- a/packages/ui/assets/logo/vuefes_logo.svg +++ b/packages/ui/assets/logo/vuefes_logo.svg @@ -1,4 +1,5 @@ - + + From 93c9df5430004bb80f78d19fc480b54465604256 Mon Sep 17 00:00:00 2001 From: totocalcio Date: Mon, 18 Mar 2024 17:41:30 +0900 Subject: [PATCH 07/68] update gap, margin, padding --- apps/web/app/components/FooterPageSection.vue | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/apps/web/app/components/FooterPageSection.vue b/apps/web/app/components/FooterPageSection.vue index fa56eef3..ab47412e 100644 --- a/apps/web/app/components/FooterPageSection.vue +++ b/apps/web/app/components/FooterPageSection.vue @@ -136,9 +136,8 @@ const vueFesLinkList: LinkList[] = [ } .footer-container { margin-inline: auto; - max-width: 72rem; - box-sizing: content-box; - padding-inline: var(--font-size-4); + max-width: 74.5rem; + padding-inline: 1.25rem; &:first-of-type { padding-top: var(--padding-block); } @@ -171,7 +170,7 @@ const vueFesLinkList: LinkList[] = [ .footer-sns-list { margin-top: 1.25rem; display: grid; - gap: var(--font-size-1); + gap: 1rem; grid-template-columns: repeat(v-bind(snsLinkList.length), var(--size-icon)); .icon-wrapper { aspect-ratio: 1; @@ -195,7 +194,7 @@ const vueFesLinkList: LinkList[] = [ } @media (--tablet) { grid-template-columns: 1fr; - gap: 1.75rem; + gap: var(--gap-link-item); } @media (--mobile) { margin-top: 1.25rem; From c691a42faedb35aba0ec6dbd669e82cbf52b399f Mon Sep 17 00:00:00 2001 From: totocalcio Date: Mon, 18 Mar 2024 17:50:52 +0900 Subject: [PATCH 08/68] update css nesting --- apps/web/app/components/FooterPageSection.vue | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/apps/web/app/components/FooterPageSection.vue b/apps/web/app/components/FooterPageSection.vue index ab47412e..069c0e3e 100644 --- a/apps/web/app/components/FooterPageSection.vue +++ b/apps/web/app/components/FooterPageSection.vue @@ -187,10 +187,8 @@ const vueFesLinkList: LinkList[] = [ display: grid; gap: 3.75rem; grid-template-columns: 1fr 1fr; - li { - & + & { - margin-top: var(--gap-link-item); - } + li + li { + margin-top: var(--gap-link-item); } @media (--tablet) { grid-template-columns: 1fr; @@ -199,10 +197,8 @@ const vueFesLinkList: LinkList[] = [ @media (--mobile) { margin-top: 1.25rem; gap: var(--gap-link-item); - li { - & + & { - margin-top: var(--gap-link-item); - } + li + li { + margin-top: var(--gap-link-item); } a { display: inline-flex; From 0cdf204b9166f23c6b52eb3f615a2e4f0c6fb18d Mon Sep 17 00:00:00 2001 From: totocalcio Date: Mon, 18 Mar 2024 17:58:38 +0900 Subject: [PATCH 09/68] update link element style for mobile --- apps/web/app/components/FooterPageSection.vue | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/apps/web/app/components/FooterPageSection.vue b/apps/web/app/components/FooterPageSection.vue index 069c0e3e..6fdea341 100644 --- a/apps/web/app/components/FooterPageSection.vue +++ b/apps/web/app/components/FooterPageSection.vue @@ -196,12 +196,8 @@ const vueFesLinkList: LinkList[] = [ } @media (--mobile) { margin-top: 1.25rem; - gap: var(--gap-link-item); - li + li { - margin-top: var(--gap-link-item); - } - a { - display: inline-flex; + li { + display: flex; height: 2.5rem; align-items: center; } From 1c2dfb46a949e52ddb9a2409e463f674c18358f5 Mon Sep 17 00:00:00 2001 From: totocalcio Date: Mon, 18 Mar 2024 18:35:53 +0900 Subject: [PATCH 10/68] update sns url --- apps/web/app/components/FooterPageSection.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/web/app/components/FooterPageSection.vue b/apps/web/app/components/FooterPageSection.vue index 6fdea341..acca82e3 100644 --- a/apps/web/app/components/FooterPageSection.vue +++ b/apps/web/app/components/FooterPageSection.vue @@ -20,11 +20,11 @@ const snsLinkList: LinkList[] = [ text: 'x', }, { - href: 'https://note.com/vuejs_jp/m/mb35849fee631', + href: 'https://note.com/vuejs_jp/', text: 'note', }, { - href: 'https://www.youtube.com/@Vuejs-bn2cg', + href: 'https://www.youtube.com/channel/UC6KPwA1kZJtQYdlh8_2hxCA', text: 'YouTube', }, { From 1f1b0db24456843430e3e21c4dd2bccbc0956e3a Mon Sep 17 00:00:00 2001 From: totocalcio Date: Mon, 18 Mar 2024 20:01:36 +0900 Subject: [PATCH 11/68] add link hover style --- apps/web/app/components/FooterPageSection.vue | 15 ++------- packages/ui/components/TextLink.vue | 32 +++++++++++++++++-- 2 files changed, 32 insertions(+), 15 deletions(-) diff --git a/apps/web/app/components/FooterPageSection.vue b/apps/web/app/components/FooterPageSection.vue index acca82e3..71144950 100644 --- a/apps/web/app/components/FooterPageSection.vue +++ b/apps/web/app/components/FooterPageSection.vue @@ -78,27 +78,18 @@ const vueFesLinkList: LinkList[] = [ - -