Merge pull request #6957 from fjordllc/card-border-hr

borderの色と設定を変更
fjordllc · Oct 11, 2023 · a369d0d · a369d0d
2 parents d9899ee + 57fc70c
commit a369d0d
Show file tree

Hide file tree

Showing 32 changed files with 44 additions and 25 deletions.
diff --git a/app/javascript/answer.vue b/app/javascript/answer.vue
@@ -107,7 +107,6 @@
             v-bind:class='{ "is-active": isActive("preview") }')
             .js-preview.a-long-text.is-md.a-markdown-input__preview(
               :id='`js-comment-preview-${this.answer.id}`')
-        hr.a-border
         .card-footer
           .card-main-actions
             .card-main-actions__items

diff --git a/app/javascript/components/mentor-practice-modal.vue b/app/javascript/components/mentor-practice-modal.vue
@@ -4,7 +4,7 @@
     header.card-header.is-sm
       h2.card-header__title
         | 所属カテゴリー
-    hr.a-border
+    hr.a-border-tint
     .card-body(v-for='category_id_name in postPractice.category_ids_names')
       .card__description
         table.admin-table__table
@@ -13,6 +13,7 @@
               td.admin-table__item-value.is-text-align-left(
                 @click.prevent='linkCategory(category_id_name.category_id)')
                 | {{ category_id_name.category_name }}
+    hr.a-border-tint
     footer.card-footer
       ul.card-main-actions__items
         li.card-main-actions__item.is-main

diff --git a/app/javascript/components/question-edit.vue b/app/javascript/components/question-edit.vue
@@ -81,6 +81,7 @@
     .card-body
       .card__description
         .a-long-text.is-md(v-html='markdownDescription')
+    hr.a-border-tint
     reaction(
       :reactionable='question',
       :currentUser='currentUser',

diff --git a/app/javascript/components/user_mentor_memo.vue b/app/javascript/components/user_mentor_memo.vue
@@ -19,6 +19,7 @@ section.a-card.is-memo.is-only-mentor
         .o-empty-message__text
           | ユーザーメモはまだありません。
       .a-long-text.is-md(v-else, v-html='markdownMemo')
+  hr.a-border-tint(v-if='!editing')
   footer.card-footer(v-if='!editing')
     .card-main-actions
       .card-main-actions__items
@@ -49,6 +50,7 @@ section.a-card.is-memo.is-only-mentor
         .a-markdown-input__inner.is-preview.js-tabs__content(
           :class='{ "is-active": isActive("preview") }')
           .a-long-text.is-md.a-markdown-input__preview(v-html='markdownMemo')
+  hr.a-border-tint(v-show='editing')
   .card-footer(v-show='editing')
     .card-main-actions
       .card-main-actions__items

diff --git a/app/javascript/loading-question-page-itme-placeholder.vue b/app/javascript/loading-question-page-itme-placeholder.vue
@@ -36,6 +36,7 @@
           p
           p
           p
+    hr.a-border-tint
     footer.card-footer
       .card-main-actions
         ul.card-main-actions__items

diff --git a/app/javascript/memo.vue b/app/javascript/memo.vue
@@ -11,7 +11,7 @@
         .card-header
           .card-header__title.is-sm
             | メモ
-        hr.a-border
+        hr.a-border-tint
         .card-body
           .card__description
             textarea.a-text-input(

diff --git a/app/javascript/practice_memo.vue b/app/javascript/practice_memo.vue
@@ -12,6 +12,7 @@
                 i.fa-regular.fa-sad-tear
               .o-empty-message__text
                 | プラクティスメモはまだありません。
+    hr.a-border-tint
     footer.card-footer
       .card-main-actions
         ul.card-main-actions__items
@@ -42,6 +43,7 @@
         .a-markdown-input__inner.is-preview.js-tabs__content(
           :class='{ "is-active": isActive("preview") }')
           .a-long-text.a-markdown-input__preview(v-html='markdownMemo')
+    hr.a-border-tint
     .card-footer
       .card-main-actions
         .card-main-actions__items

diff --git a/app/javascript/stylesheets/application/blocks/auth-form/_auth-form-nav.sass b/app/javascript/stylesheets/application/blocks/auth-form/_auth-form-nav.sass
@@ -4,12 +4,10 @@
 
 .auth-form-nav__items
   display: flex
+  gap: 3rem
   justify-content: center
   width: 100%
 
-.auth-form-nav__item
-  margin-inline: .5rem
-
 .auth-form-nav__item-link
   cursor: pointer
   +text-block(.75rem 1.45)

diff --git a/app/javascript/stylesheets/application/blocks/auth-form/_auth-form.sass b/app/javascript/stylesheets/application/blocks/auth-form/_auth-form.sass
@@ -26,14 +26,14 @@
 
 .auth-form__header
   border-bottom: solid 1px var(--border-tint)
-  padding: 1rem 1.25rem
+  padding: 1rem 1.75rem
 
 .auth-form__body
-  padding: 1.5rem 1.25rem
+  padding: 1.5rem 1.75rem
 
 .auth-form__footer
   border-top: solid 1px var(--border-tint)
-  padding: 1rem 1.25rem
+  padding: 1rem 1.75rem
 
 .auth-form__title
   +text-block(1.25rem 1.45, center 600)
@@ -42,7 +42,7 @@
   margin-bottom: 1.25rem
 
 .auth-form__alert
-  padding: .5rem 1.25rem
+  padding: .5rem 1.5rem
   background-color: $danger
   text-align: center
   +text-block(.8125rem 1.4)

diff --git a/app/javascript/stylesheets/application/blocks/form/_form-actions.sass b/app/javascript/stylesheets/application/blocks/form/_form-actions.sass
@@ -50,6 +50,8 @@
       max-width: 50%
       .auth-form__body &
         min-width: 50%
+        max-width: 100%
+        width: 17.5rem
     +media-breakpoint-down(sm)
       width: 100%
   &.has-help

diff --git a/app/javascript/stylesheets/application/blocks/reaction/_reaction.sass b/app/javascript/stylesheets/application/blocks/reaction/_reaction.sass
@@ -1,7 +1,6 @@
 .reactions
   display: flex
   justify-content: space-between
-  border-top: 1px solid var(--border-tint)
   position: relative
   user-select: none
   .card-body + &

diff --git a/app/javascript/stylesheets/config/variables/_colors.sass b/app/javascript/stylesheets/config/variables/_colors.sass
@@ -37,7 +37,7 @@ $placeholder-text: hsl(242, 0%, 73%)
 
 // border
 $border: hsl(242, 7%, 89%)
-$border-tint: hsl(242, 33%, 97%)
+$border-tint: hsl(242, 14%, 96%)
 $border-shade: hsl(242, 7%, 84%)
 
 // Welcome Colors

diff --git a/app/javascript/stylesheets/shared/blocks/card/_card-body.sass b/app/javascript/stylesheets/shared/blocks/card/_card-body.sass
@@ -1,7 +1,5 @@
 .card-body
   flex: 1
-  &:not(:last-child)
-      border-bottom: solid 1px var(--border-tint)
   &.has-scroll
     max-height: 18rem
     overflow-y: auto

diff --git a/app/views/announcements/_announcement.html.slim b/app/views/announcements/_announcement.html.slim
@@ -46,6 +46,7 @@
       .card__description
         .a-long-text.is-md.js-markdown-view
           = announcement.description
+    hr.a-border-tint
     = render 'reactions/reactions', reactionable: @announcement
     hr.a-border-tint
     .card-footer

diff --git a/app/views/articles/_ad.html.slim b/app/views/articles/_ad.html.slim
@@ -3,7 +3,7 @@ aside.bootcamp-ad
     header.card-header.is-sm
       h3.card-header__title
         | 現場の即戦力になれるプログラミングスクール
-    hr.a-border
+    hr.a-border-tint
     .card-body
       .card__description
         = image_tag 'pjord-face.svg',
@@ -20,6 +20,7 @@ aside.bootcamp-ad
             | プログラミング未経験からスタートして、
             | HTML、CSS、Linux、Ruby、Rails、JavaScript、チーム開発を経て、
             | 自作サービスを公開するまでのカリキュラムを用意しています。
+    hr.a-border-tint
     .card-footer
       = link_to welcome_path, class: 'a-button is-primary is-lg is-block' do
         | 詳細はこちら
diff --git a/app/views/events/_event.html.slim b/app/views/events/_event.html.slim
@@ -57,6 +57,7 @@
           = event.description
       - unless event.wip?
         = render 'events/participation', event: event
+    hr.a-border-tint
     = render 'reactions/reactions', reactionable: event
     - if event.user_id == current_user.id || admin_or_mentor_login?
       hr.a-border-tint

diff --git a/app/views/home/_adviser_company_edit.html.slim b/app/views/home/_adviser_company_edit.html.slim
@@ -1,11 +1,12 @@
 .a-card
   header.card-header.is-sm
     h2.card-header__title 企業情報変更
-  hr.a-border
+  hr.a-border-tint
   .card-body
     .card__description
       .a-short-text.is-sm
         p 文章
+  hr.a-border-tint
   footer.card-footer
     .card-main-actions
       ul.card-main-actions__items

diff --git a/app/views/home/_adviser_help.html.slim b/app/views/home/_adviser_help.html.slim
@@ -1,11 +1,12 @@
 .a-card
   header.card-header.is-sm
     h2.card-header__title アドバイザーヘルプ
-  hr.a-border
+  hr.a-border-tint
   .card-body
     .card__description
       .a-short-text.is-sm
         p フィヨルドブートキャンプ学習アプリに関する使い方はこちらをご覧ください。
+  hr.a-border-tint
   footer.card-footer
     .card-main-actions
       ul.card-main-actions__items

diff --git a/app/views/home/_adviser_talk.html.slim b/app/views/home/_adviser_talk.html.slim
@@ -1,11 +1,12 @@
 .a-card
   header.card-header.is-sm
     h2.card-header__title FBC運営への連絡
-  hr.a-border
+  hr.a-border-tint
   .card-body
     .card__description
       .a-short-text.is-sm
         p 研修利用についてのご相談など、フィヨルドブートキャンプ運営者へのご相談がありましたら、こちらからご連絡をお願いします。
+  hr.a-border-tint
   footer.card-footer
     .card-main-actions
       ul.card-main-actions__items

diff --git a/app/views/home/_after_graduation_hope.html.slim b/app/views/home/_after_graduation_hope.html.slim
@@ -2,11 +2,12 @@
   header.card-header.is-sm
     h2.card-header__title
       | 卒業後のゴール
-  hr.a-border
+  hr.a-border-tint
   .card-body
     .card__description
       .a-long-text.is-md
         = simple_format(user.after_graduation_hope)
+  hr.a-border-tint
   .card-footer
     .card-footer__footer-link
       = link_to edit_current_user_path(anchor: 'form-after-graduation-hope'), class: 'card-footer__footer-text-link' do

diff --git a/app/views/home/_invite_adviser_link.html.slim b/app/views/home/_invite_adviser_link.html.slim
@@ -2,7 +2,7 @@
   header.card-header.is-sm
     h2.card-header__title
       | 社内メンターの招待
-  hr.a-border
+  hr.a-border-tint
   .card-body
     .card__description
       .a-short-text.is-sm
@@ -12,6 +12,7 @@
           | アドバイザーという role で登録され、
           | 研修生の日報や提出物を確認、コメント投稿などをすることができるようになります。
           | アドバイザーは利用料はかかりません。
+  hr.a-border-tint
   footer.card-footer
     .card-main-actions
       ul.card-main-actions__items

diff --git a/app/views/home/_invite_trainee_link.html.slim b/app/views/home/_invite_trainee_link.html.slim
@@ -3,7 +3,7 @@
     header.card-header.is-sm
       h2.card-header__title
         | 研修生の招待
-    hr.a-border
+    hr.a-border-tint
     .card-body
       .card__description
         .a-short-text.is-sm
@@ -15,6 +15,7 @@
             | 研修生が履修をするプラクティスの選別についてなどは、
             = link_to '相談部屋', talk_path(current_user.talk, anchor: 'latest-comment')
             | からご相談ください。
+    hr.a-border-tint
     footer.card-footer
       .card-main-actions
         ul.card-main-actions__items

diff --git a/app/views/mentor/categories/show.html.slim b/app/views/mentor/categories/show.html.slim
@@ -50,11 +50,12 @@ header.page-header
               .card-header.is-sm
                 h2.card-header__title
                   | 説明
-              hr.a-border
+              hr.a-border-tint
               .card-body
                 .card__description
                   .a-long-text.is-md.js-markdown-view
                     = @category.description
+              hr.a-border-tint
               .card-footer
                 .card-main-actions
                   ul.card-main-actions__items

diff --git a/app/views/pages/show.html.slim b/app/views/pages/show.html.slim
@@ -26,6 +26,7 @@ hr.a-border
               .card__description
                 .a-long-text.is-md.js-markdown-view
                   = @page.body
+            hr.a-border-tint
             = render 'reactions/reactions', reactionable: @page
             hr.a-border-tint
             footer.card-footer

diff --git a/app/views/practices/_description.html.slim b/app/views/practices/_description.html.slim
@@ -10,6 +10,7 @@
       = render 'shared/common_page_body',
         common_page: @common_page,
         classes: 'common-page-body js-markdown-view a-long-text is-md'
+  hr.a-border-tint
   footer.card-footer
     .card-main-actions
       ul.card-main-actions__items

diff --git a/app/views/practices/show.html.slim b/app/views/practices/show.html.slim
@@ -92,6 +92,7 @@
                   = @practice.goal
                 - if !current_user.adviser? && @practice.open_product?
                   = render 'content_notice'
+            hr.a-border-tint
             footer.card-footer
               #js-learning(data-practice-id="#{@practice.id}")
               - if @practice.submission

diff --git a/app/views/products/_product_body.html.slim b/app/views/products/_product_body.html.slim
@@ -7,6 +7,7 @@
     .card__description
       .a-long-text.is-md.js-markdown-view(data-taskable-id="#{product.id}" data-taskable-type='Product' data-taskable="#{product.taskable?(current_user).to_s}")
         =  product.body
+  hr.a-border-tint
   = render 'reactions/reactions', reactionable: product
 
   - if product.user == current_user || admin_or_mentor_login?

diff --git a/app/views/products/new.html.slim b/app/views/products/new.html.slim
@@ -15,7 +15,7 @@ hr.a-border
           header.card-header.is-sm
             h2.card-header__title
               = Practice.human_attribute_name :goal
-          hr.a-border
+          hr.a-border-tint
           .card-body
             .card__description
               .is-goal.a-long-text.is-md.js-markdown-view

diff --git a/app/views/regular_events/_regular_event.html.slim b/app/views/regular_events/_regular_event.html.slim
@@ -77,7 +77,7 @@
       header.card-header.is-sm
         h2.card-header__title
           | 参加者（#{regular_event.participants.count}名）
-      hr.a-border
+      hr.a-border-tint
       .card-body
         .card__description
           - if regular_event.participants.present?

diff --git a/app/views/reports/_report_body.html.slim b/app/views/reports/_report_body.html.slim
@@ -6,6 +6,7 @@
     .card__description
       .a-long-text.is-md.js-markdown-view(data-taskable-id="#{report.id}" data-taskable-type='Report' data-taskable="#{report.taskable?(current_user).to_s}")
         = report.description
+  hr.a-border-tint
   = render 'reactions/reactions', reactionable: report
 
   - if report.user_id == current_user.id || mentor_login?

diff --git a/app/views/talks/show.html.slim b/app/views/talks/show.html.slim
@@ -40,7 +40,7 @@
                 .card-header.is-sm
                   h2.page-content-members__title
                     | 相談部屋にアクセスできるメンバー
-                hr.a-border
+                hr.a-border-tint
                 .card-body
                   .card__description
                     ul.page-content-members__items

diff --git a/app/views/works/show.html.slim b/app/views/works/show.html.slim
@@ -45,6 +45,7 @@ hr.a-border
           .card__description
             .a-long-text.is-md.js-markdown-view
               = @work.description
+        hr.a-border-tint
         .card-footer
           ul.card-main-actions__items
             - if @work.url.present?