Fix checkbox bug on private/archive filter (#32236) (#32240)

Backport #32236 by cloudchamb3r

fix #32235

Co-authored-by: cloudchamb3r <jizon0123@protonmail.com>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

diff --git a/web_src/js/components/DashboardRepoList.vue b/web_src/js/components/DashboardRepoList.vue
index cb23de93dcd7dd320584f75de6ae318fa3ee08ee..79f942d345d9a751cf0de6156e4b2532710d3aab 100644 (file)
--- a/web_src/js/components/DashboardRepoList.vue
+++ b/web_src/js/components/DashboardRepoList.vue
@@ -362,9 +362,9 @@ export default sfc; // activate the IDE's Vue plugin
             <div class="menu">
               <a class="item" @click="toggleArchivedFilter()">
                 <div class="ui checkbox" ref="checkboxArchivedFilter" :title="checkboxArchivedFilterTitle">
-                  <!--the "hidden" is necessary to make the checkbox work without Fomantic UI js,
+                  <!--the "tw-pointer-events-none" is necessary to prevent the checkbox from handling user's input,
                       otherwise if the "input" handles click event for intermediate status, it breaks the internal state-->
-                  <input type="checkbox" class="hidden" v-bind.prop="checkboxArchivedFilterProps">
+                  <input type="checkbox" class="tw-pointer-events-none" v-bind.prop="checkboxArchivedFilterProps">
                   <label>
                     <svg-icon name="octicon-archive" :size="16" class-name="tw-mr-1"/>
                     {{ textShowArchived }}
@@ -373,7 +373,7 @@ export default sfc; // activate the IDE's Vue plugin
               </a>
               <a class="item" @click="togglePrivateFilter()">
                 <div class="ui checkbox" ref="checkboxPrivateFilter" :title="checkboxPrivateFilterTitle">
-                  <input type="checkbox" class="hidden" v-bind.prop="checkboxPrivateFilterProps">
+                  <input type="checkbox" class="tw-pointer-events-none" v-bind.prop="checkboxPrivateFilterProps">
                   <label>
                     <svg-icon name="octicon-lock" :size="16" class-name="tw-mr-1"/>
                     {{ textShowPrivate }}