restore scss

apps/app/src/components/Admin/AuditLog/SelectActionDropdown.tsx

@@ -76,48 +76,50 @@ export const SelectActionDropdown: FC<Props> = (props: Props) => {
   }, [onChangeMultipleAction]);
 
   return (
-    <div className="btn-group me-2 admin-audit-log col-12">
-      <button className="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown">
-        <i className="fa fa-fw fa-bolt" />{t('admin:audit_log_management.action')}
-      </button>
-      <ul className="dropdown-menu select-action-dropdown" aria-labelledby="dropdownMenuButton">
-        {dropdownItems.map(item => (
-          <div key={item.actionCategory}>
-            <div className="dropdown-item">
-              <div className="px-2 m-0">
-                <input
-                  type="checkbox"
-                  className="form-check-input"
-                  defaultChecked
-                  onChange={(e) => { multipleActionCheckboxChangedHandler(item.actions, e.target.checked) }}
-                />
-                <label className="form-label form-check-label">{t(`admin:audit_log_action_category.${item.actionCategory}`)}</label>
+    <div className="col-12">
+      <div className="btn-group me-2 admin-audit-log">
+        <button className="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-bs-toggle="dropdown">
+          <i className="fa fa-fw fa-bolt" />{t('admin:audit_log_management.action')}
+        </button>
+        <ul className="dropdown-menu select-action-dropdown" aria-labelledby="dropdownMenuButton">
+          {dropdownItems.map(item => (
+            <div key={item.actionCategory}>
+              <div className="dropdown-item">
+                <div className="px-2 m-0">
+                  <input
+                    type="checkbox"
+                    className="form-check-input"
+                    defaultChecked
+                    onChange={(e) => { multipleActionCheckboxChangedHandler(item.actions, e.target.checked) }}
+                  />
+                  <label className="form-label form-check-label">{t(`admin:audit_log_action_category.${item.actionCategory}`)}</label>
+                </div>
               </div>
-            </div>
-            {
-              item.actions.map(action => (
-                <div className="dropdown-item" key={action}>
-                  <div className="px-4 m-0">
-                    <input
-                      type="checkbox"
-                      className="form-check-input"
-                      id={`checkbox${action}`}
-                      onChange={() => { actionCheckboxChangedHandler(action) }}
-                      checked={actionMap.get(action)}
-                    />
-                    <label
-                      className="form-check-label"
-                      htmlFor={`checkbox${action}`}
-                    >
-                      {t(`admin:audit_log_action.${action}`)}
-                    </label>
+              {
+                item.actions.map(action => (
+                  <div className="dropdown-item" key={action}>
+                    <div className="px-4 m-0">
+                      <input
+                        type="checkbox"
+                        className="form-check-input"
+                        id={`checkbox${action}`}
+                        onChange={() => { actionCheckboxChangedHandler(action) }}
+                        checked={actionMap.get(action)}
+                      />
+                      <label
+                        className="form-check-label"
+                        htmlFor={`checkbox${action}`}
+                      >
+                        {t(`admin:audit_log_action.${action}`)}
+                      </label>
+                    </div>
                   </div>
-                </div>
-              ))
-            }
-          </div>
-        ))}
-      </ul>
+                ))
+              }
+            </div>
+          ))}
+        </ul>
+      </div>
     </div>
   );
 };

apps/app/src/components/Admin/AuditLogManagement.tsx

@@ -191,7 +191,7 @@ export const AuditLogManagement: FC = () => {
               onChangeMultipleAction={multipleActionCheckboxChangedHandler}
             />
 
-            <button type="button" className="btn btn-link col-12" onClick={clearButtonPushedHandler}>
+            <button type="button" className="btn btn-link" onClick={clearButtonPushedHandler}>
               {t('admin:audit_log_management.clear')}
             </button>
           </div>

apps/app/src/styles/_editor.scss

@@ -117,6 +117,17 @@
 
     .grw-taglabels-container {
       margin-bottom: 0;
+
+      // TODO: .form-inline dropped in bootstrap v5
+      // https://redmine.weseek.co.jp/issues/128307
+      // To scroll tags horizontally
+      // .grw-tag-labels.form-inline {
+      //   flex-flow: row nowrap;
+      //   width: 100%;
+      //   overflow-x: auto;
+      //   overflow-y: hidden;
+      //   scrollbar-width: thin;
+      // }
     }
   }
 

apps/app/src/styles/_override-rbt.scss

@@ -1,3 +1,16 @@
+// TODO: .form-group dropped in bootstrap v5
+// https://redmine.weseek.co.jp/issues/129103
+// override react-bootstrap-typeahead styles
+// see: https://github.com/ericgio/react-bootstrap-typeahead
+.form-group:not(.has-error) {
+  .rbt-input.form-control {
+    // focus
+    &.focus {
+      border-color: inherit;
+    }
+  }
+}
+
 // TODO: check padding when upgrade react-bootstrap-typeahead v6
 // .close to .btn-close in bootstrap v5
 // https://redmine.weseek.co.jp/issues/129103