休会チェックボックスのデザイン

fjordllc · Sep 21, 2022 · 8e80a98 · 8e80a98
1 parent 4761d12
commit 8e80a98
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 11 deletions.
diff --git a/app/assets/stylesheets/application/blocks/form/_block-checks.sass b/app/assets/stylesheets/application/blocks/form/_block-checks.sass
@@ -8,6 +8,8 @@
   max-width: 20rem
   .block-checks.is-1-item &
     max-width: 100%
+  .block-checks.is-1-item.is-centered &
+    width: 20rem
   .block-checks.is-2-items &
     flex: 0 0 calc((100% - .5rem) / 2)
     max-width: calc((100% - .5rem) / 2)

diff --git a/app/views/hibernation/new.html.slim b/app/views/hibernation/new.html.slim
@@ -21,17 +21,6 @@ header.page-header
         html: { name: 'hibernation' },
         class: 'form' do |f|
         .form__items
-          //
-            休会についての注意を実装したら表示する
-            .form-item
-              label.a-form-label.is-required
-                | 休会についての注意を読みましたか？
-              .block-checks.is-2-items
-                .block-checks__item
-                  .a-block-check.is-checkbox
-                    input.a-toggle-checkbox#aaa(type='checkbox')
-                    label.a-block-check__label(for='aaa')
-                      | 読みました
           .form-item
             = f.label :scheduled_return_on,
               class: 'a-form-label is-required'
@@ -79,6 +68,17 @@ header.page-header
                         | こちら
                       | のページの「分報 URL」欄に分報チャンネルの URL を登録してください。
 
+
+          .form-item
+            label.a-form-label.is-required
+              | 休会についての注意を読みましたか？
+            .block-checks.is-1-item.is-centered
+              .block-checks__item
+                .a-block-check.is-checkbox
+                  input.a-toggle-checkbox#aaa(type='checkbox')
+                  label.a-block-check__label(for='aaa')
+                    | 読みました
+
         .form-actions
           ul.form-actions__items
             li.form-actions__item.is-main