diff --git a/css/app-navigation.scss b/css/app-navigation.scss
index 7b4c20537e..151c916375 100644
--- a/css/app-navigation.scss
+++ b/css/app-navigation.scss
@@ -187,20 +187,6 @@
 		}
 	}
 
-	.app-navigation-entry__icon-bullet-disabled {
-		display: block;
-		// there is 2 margins
-		padding: 15px;
-		div {
-			border: 1px solid var(--color-border-dark);
-			width: 15px;
-			height: 15px;
-			cursor: pointer;
-			transition: background 100ms ease-in-out;
-			border-radius: 50%;
-		}
-	}
-
 	.app-navigation-entry__utils {
 		.action-checkbox__label {
 			padding-right: 0 !important;
diff --git a/src/components/AppNavigation/CalendarList/AppNavigationDisabledCalendarIconBullet.vue b/src/components/AppNavigation/CalendarList/AppNavigationDisabledCalendarIconBullet.vue
deleted file mode 100644
index a7c8d7cacf..0000000000
--- a/src/components/AppNavigation/CalendarList/AppNavigationDisabledCalendarIconBullet.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<!--
-  - @copyright Copyright (c) 2019 Georg Ehrke <oc.list@georgehrke.com>
-  - @author Georg Ehrke <oc.list@georgehrke.com>
-  -
-  - @license GNU AGPL version 3 or any later version
-  -
-  - This program is free software: you can redistribute it and/or modify
-  - it under the terms of the GNU Affero General Public License as
-  - published by the Free Software Foundation, either version 3 of the
-  - License, or (at your option) any later version.
-  -
-  - This program is distributed in the hope that it will be useful,
-  - but WITHOUT ANY WARRANTY; without even the implied warranty of
-  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-  - GNU Affero General Public License for more details.
-  -
-  - You should have received a copy of the GNU Affero General Public License
-  - along with this program. If not, see <http://www.gnu.org/licenses/>.
-  -
-  -->
-
-<template>
-	<div class="app-navigation-entry__icon-bullet-disabled" @click="onClick">
-		<div />
-	</div>
-</template>
-
-<script>
-export default {
-	name: 'AppNavigationDisabledCalendarIconBullet',
-	methods: {
-		onClick(event) {
-			this.$emit('click', event)
-		},
-	},
-}
-</script>
diff --git a/src/components/AppNavigation/CalendarList/CalendarListItem.vue b/src/components/AppNavigation/CalendarList/CalendarListItem.vue
index 15d1f25123..2f191dd837 100644
--- a/src/components/AppNavigation/CalendarList/CalendarListItem.vue
+++ b/src/components/AppNavigation/CalendarList/CalendarListItem.vue
@@ -26,15 +26,18 @@
 		:title="calendar.displayName || $t('calendar', 'Untitled calendar')"
 		:class="{deleted: !!deleteTimeout, disabled: !calendar.enabled, 'open-sharing': shareMenuOpen}"
 		@click.prevent.stop="toggleEnabled">
-		<AppNavigationIconBullet
-			v-if="calendar.enabled"
-			slot="icon"
-			:color="calendar.color"
-			@click.prevent.stop="toggleEnabled" />
-		<AppNavigationDisabledCalendarIconBullet
-			v-if="!calendar.enabled"
-			slot="icon"
-			@click.prevent.stop="toggleEnabled" />
+		<template slot="icon">
+			<Actions>
+				<ActionButton @click.prevent.stop="toggleEnabled">
+					<template #icon>
+						<CheckboxBlankCircle
+							:title="calendar.enabled ? $t('calendar', 'Disable calendar') : $t('calendar', 'Enable calendar') "
+							:size="20"
+							:fill-color="calendar.enabled ? calendar.color : 'var(--color-text-lighter)'" />
+					</template>
+				</ActionButton>
+			</Actions>
+		</template>
 
 		<template v-if="!deleteTimeout" slot="counter">
 			<Actions v-if="showSharingIcon" class="sharing">
@@ -171,7 +174,6 @@ import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
 import ActionInput from '@nextcloud/vue/dist/Components/ActionInput'
 import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
 import ActionText from '@nextcloud/vue/dist/Components/ActionText'
-import AppNavigationIconBullet from '@nextcloud/vue/dist/Components/AppNavigationIconBullet'
 import AppNavigationItem from '@nextcloud/vue/dist/Components/AppNavigationItem'
 import ClickOutside from 'vue-click-outside'
 import {
@@ -183,11 +185,10 @@ import {
 	generateRemoteUrl,
 } from '@nextcloud/router'
 
-import AppNavigationDisabledCalendarIconBullet from './AppNavigationDisabledCalendarIconBullet.vue'
 import CalendarListItemSharingSearch from './CalendarListItemSharingSearch.vue'
 import CalendarListItemSharingPublishItem from './CalendarListItemSharingPublishItem.vue'
 import CalendarListItemSharingShareItem from './CalendarListItemSharingShareItem.vue'
-
+import CheckboxBlankCircle from 'vue-material-design-icons/CheckboxBlankCircle.vue'
 import Close from 'vue-material-design-icons/Close.vue'
 import Delete from 'vue-material-design-icons/Delete.vue'
 import Download from 'vue-material-design-icons/Download.vue'
@@ -205,12 +206,11 @@ export default {
 		ActionInput,
 		ActionLink,
 		ActionText,
-		AppNavigationDisabledCalendarIconBullet,
-		AppNavigationIconBullet,
 		AppNavigationItem,
 		CalendarListItemSharingSearch,
 		CalendarListItemSharingPublishItem,
 		CalendarListItemSharingShareItem,
+		CheckboxBlankCircle,
 		Close,
 		Delete,
 		Download,