6 files changed, 10 insertions, 129 deletions
diff --git a/web_src/css/index.css b/web_src/css/index.css
index ce1a23b245..630aa3c2ef 100644
--- a/web_src/css/index.css
+++ b/web_src/css/index.css
@@ -19,7 +19,6 @@
 @import "./modules/dimmer.css";
 @import "./modules/modal.css";
 
-@import "./modules/select.css";
 @import "./modules/tippy.css";
 @import "./modules/breadcrumb.css";
 @import "./modules/comment.css";
diff --git a/web_src/css/modules/checkbox.css b/web_src/css/modules/checkbox.css
index 0a3a71acaa..f7e61ba360 100644
--- a/web_src/css/modules/checkbox.css
+++ b/web_src/css/modules/checkbox.css
@@ -119,3 +119,13 @@ input[type="radio"] {
 .ui.toggle.checkbox input:focus:checked ~ label::before {
   background: var(--color-primary) !important;
 }
+
+label.gt-checkbox {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25em;
+}
+
+.ui.form .field > label.gt-checkbox {
+  display: flex;
+}
diff --git a/web_src/css/modules/select.css b/web_src/css/modules/select.css
deleted file mode 100644
index 1d7d749d4a..0000000000
--- a/web_src/css/modules/select.css
+++ /dev/null
@@ -1,25 +0,0 @@
-.gitea-select {
-  position: relative;
-}
-
-.gitea-select select {
-  appearance: none; /* hide default triangle */
-}
-
-/* ::before and ::after pseudo elements don't work on select elements,
-   so we need to put it on the parent. */
-.gitea-select::after {
-  position: absolute;
-  top: 12px;
-  right: 8px;
-  pointer-events: none;
-  content: "";
-  width: 14px;
-  height: 14px;
-  mask-size: cover;
-  -webkit-mask-size: cover;
-  mask-image: var(--octicon-chevron-right);
-  -webkit-mask-image: var(--octicon-chevron-right);
-  transform: rotate(90deg); /* point the chevron down */
-  background: currentcolor;
-}
diff --git a/web_src/js/components/ScopedAccessTokenSelector.vue b/web_src/js/components/ScopedAccessTokenSelector.vue
deleted file mode 100644
index 9eaf824035..0000000000
--- a/web_src/js/components/ScopedAccessTokenSelector.vue
+++ /dev/null
@@ -1,81 +0,0 @@
-<script lang="ts" setup>
-import {computed, onMounted, onUnmounted} from 'vue';
-import {hideElem, showElem} from '../utils/dom.ts';
-
-const props = defineProps<{
-  isAdmin: boolean;
-  noAccessLabel: string;
-  readLabel: string;
-  writeLabel: string;
-}>();
-
-const categories = computed(() => {
-  const categories = [
-    'activitypub',
-  ];
-  if (props.isAdmin) {
-    categories.push('admin');
-  }
-  categories.push(
-    'issue',
-    'misc',
-    'notification',
-    'organization',
-    'package',
-    'repository',
-    'user');
-  return categories;
-});
-
-onMounted(() => {
-  document.querySelector('#scoped-access-submit').addEventListener('click', onClickSubmit);
-});
-
-onUnmounted(() => {
-  document.querySelector('#scoped-access-submit').removeEventListener('click', onClickSubmit);
-});
-
-function onClickSubmit(e: Event) {
-  e.preventDefault();
-
-  const warningEl = document.querySelector('#scoped-access-warning');
-  // check that at least one scope has been selected
-  for (const el of document.querySelectorAll<HTMLInputElement>('.access-token-select')) {
-    if (el.value) {
-      // Hide the error if it was visible from previous attempt.
-      hideElem(warningEl);
-      // Submit the form.
-      document.querySelector<HTMLFormElement>('#scoped-access-form').submit();
-      // Don't show the warning.
-      return;
-    }
-  }
-  // no scopes selected, show validation error
-  showElem(warningEl);
-}
-</script>
-
-<template>
-  <div v-for="category in categories" :key="category" class="field tw-pl-1 tw-pb-1 access-token-category">
-    <label class="category-label" :for="'access-token-scope-' + category">
-      {{ category }}
-    </label>
-    <div class="gitea-select">
-      <select
-        class="ui selection access-token-select"
-        name="scope"
-        :id="'access-token-scope-' + category"
-      >
-        <option value="">
-          {{ noAccessLabel }}
-        </option>
-        <option :value="'read:' + category">
-          {{ readLabel }}
-        </option>
-        <option :value="'write:' + category">
-          {{ writeLabel }}
-        </option>
-      </select>
-    </div>
-  </div>
-</template>
diff --git a/web_src/js/features/scoped-access-token.ts b/web_src/js/features/scoped-access-token.ts
deleted file mode 100644
index c498d4c011..0000000000
--- a/web_src/js/features/scoped-access-token.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import {createApp} from 'vue';
-
-export async function initScopedAccessTokenCategories() {
-  const el = document.querySelector('#scoped-access-token-selector');
-  if (!el) return;
-
-  const {default: ScopedAccessTokenSelector} = await import(/* webpackChunkName: "scoped-access-token-selector" */'../components/ScopedAccessTokenSelector.vue');
-  try {
-    const View = createApp(ScopedAccessTokenSelector, {
-      isAdmin: JSON.parse(el.getAttribute('data-is-admin')),
-      noAccessLabel: el.getAttribute('data-no-access-label'),
-      readLabel: el.getAttribute('data-read-label'),
-      writeLabel: el.getAttribute('data-write-label'),
-    });
-    View.mount(el);
-  } catch (err) {
-    console.error('ScopedAccessTokenSelector failed to load', err);
-    el.textContent = el.getAttribute('data-locale-component-failed-to-load');
-  }
-}
diff --git a/web_src/js/index.ts b/web_src/js/index.ts
index b89e596047..032e6ffe1b 100644
--- a/web_src/js/index.ts
+++ b/web_src/js/index.ts
@@ -68,7 +68,6 @@ import {initColorPickers} from './features/colorpicker.ts';
 import {initAdminSelfCheck} from './features/admin/selfcheck.ts';
 import {initOAuth2SettingsDisableCheckbox} from './features/oauth2-settings.ts';
 import {initGlobalFetchAction} from './features/common-fetch-action.ts';
-import {initScopedAccessTokenCategories} from './features/scoped-access-token.ts';
 import {
   initFootLanguageMenu,
   initGlobalDropdown,
@@ -209,7 +208,6 @@ onDomReady(() => {
     initUserSettings,
     initRepoDiffView,
     initPdfViewer,
-    initScopedAccessTokenCategories,
     initColorPickers,
 
     initOAuth2SettingsDisableCheckbox,