Set material design icon size to 20

Signed-off-by: Raimund Schlüßler <raimund.schluessler@mailbox.org>
nextcloud-libraries · Sep 21, 2021 · dfb52e2 · dfb52e2
1 parent 53f821a
commit dfb52e2
Show file tree

Hide file tree

Showing 13 changed files with 20 additions and 20 deletions.
diff --git a/src/components/ActionButton/ActionButton.vue b/src/components/ActionButton/ActionButton.vue
@@ -49,7 +49,7 @@ You can also use a custom icon, for example from the vue-material-design-icons l
 		<ActionButton>
 			<template #icon>
 				<HandBackLeft
-					:size="24"
+					:size="20"
 					decorative
 					title="" />
 			</template>
@@ -58,7 +58,7 @@ You can also use a custom icon, for example from the vue-material-design-icons l
 		<ActionButton>
 			<template #icon>
 				<HandBackRight
-					:size="24"
+					:size="20"
 					decorative
 					title="" />
 			</template>

diff --git a/src/components/ActionInput/ActionInput.vue b/src/components/ActionInput/ActionInput.vue
@@ -90,7 +90,7 @@ For the multiselect component, all events will be passed through. Please see the
 					<!-- allow the custom font to inject a ::before
 						not possible on input[type=submit] -->
 					<label v-show="!disabled" :for="id" class="action-input__label">
-						<ArrowRight :size="24" title="" decorative />
+						<ArrowRight :size="20" title="" decorative />
 					</label>
 				</template>
 			</form>

diff --git a/src/components/ActionTextEditable/ActionTextEditable.vue b/src/components/ActionTextEditable/ActionTextEditable.vue
@@ -64,7 +64,7 @@ All undocumented attributes will be bound to the textarea. e.g. `maxlength`
 				<!-- allow the custom font to inject a ::before
 					not possible on input[type=submit] -->
 				<label v-show="!disabled" :for="id" class="action-text-editable__label">
-					<ArrowRight :size="24" title="" decorative />
+					<ArrowRight :size="20" title="" decorative />
 				</label>
 			</form>
 		</span>

diff --git a/src/components/Actions/Actions.vue b/src/components/Actions/Actions.vue
@@ -90,11 +90,11 @@ It can be used with one or multiple actions.
 		<button @click="toggled = !toggled">Toggle multiple action</button>
 		<Actions>
 			<template #icon>
-				<DotsHorizontalCircleOutline :size="24" decorative />
+				<DotsHorizontalCircleOutline :size="20" decorative />
 			</template>
 			<ActionButton>
 				<template #icon>
-					<MicrophoneOff :size="24" decorative />
+					<MicrophoneOff :size="20" decorative />
 				</template>
 				Mute
 			</ActionButton>
@@ -192,7 +192,7 @@ export default {
 					@focus="onFocus"
 					@blur="onBlur">
 					<slot v-if="iconSlotIsPopulated" name="icon" />
-					<DotsHorizontal v-else-if="defaultIcon === ''" :size="24" decorative />
+					<DotsHorizontal v-else-if="defaultIcon === ''" :size="20" decorative />
 					{{ menuTitle }}
 				</button>
 			</template>

diff --git a/src/components/AppNavigationItem/AppNavigationIconCollapsible.vue b/src/components/AppNavigationItem/AppNavigationIconCollapsible.vue
@@ -27,7 +27,7 @@
 		:class="{'icon-collapse--rotated':open}"
 		type="button"
 		@click="onClick">
-		<MenuDown :size="24" title="" decorative />
+		<MenuDown :size="20" title="" decorative />
 	</button>
 </template>
 

diff --git a/src/components/AppNavigationItem/InputConfirmCancel.vue b/src/components/AppNavigationItem/InputConfirmCancel.vue
@@ -42,14 +42,14 @@
 				class="app-navigation-input-confirm__confirm"
 				:aria-label="labelConfirm"
 				@click.stop.prevent="confirm">
-				<ArrowRight :size="24" decorative title="" />
+				<ArrowRight :size="20" decorative title="" />
 			</button>
 
 			<button type="reset"
 				class="app-navigation-input-confirm__close"
 				:aria-label="labelCancel"
 				@click.stop.prevent="cancel">
-				<Close :size="24" decorative title="" />
+				<Close :size="20" decorative title="" />
 			</button>
 		</form>
 	</div>

diff --git a/src/components/AppNavigationSettings/AppNavigationSettings.vue b/src/components/AppNavigationSettings/AppNavigationSettings.vue
@@ -29,7 +29,7 @@
 				class="settings-button"
 				type="button"
 				@click="toggleMenu">
-				<Cog class="settings-button__icon" :size="24" decorative />
+				<Cog class="settings-button__icon" :size="20" decorative />
 				<span class="settings-button__label">{{ title }}</span>
 			</button>
 		</div>

diff --git a/src/components/AppNavigationToggle/AppNavigationToggle.vue b/src/components/AppNavigationToggle/AppNavigationToggle.vue
@@ -28,7 +28,7 @@
 			aria-controls="app-navigation-vue"
 			@click="toggleNavigation">
 			<template #icon>
-				<Menu :size="24"
+				<Menu :size="20"
 					title=""
 					decorative />
 			</template>

diff --git a/src/components/AppSidebar/AppSidebar.vue b/src/components/AppSidebar/AppSidebar.vue
@@ -36,7 +36,7 @@ include a standard-header like it's used by the files app.
 		subtitle="last edited 3 weeks ago">
 		<AppSidebarTab icon="icon-settings" name="Settings" id="settings">
 			<template #icon>
-				<Cog :size="24" decorative />
+				<Cog :size="20" decorative />
 			</template>
 			Settings tab content
 		</AppSidebarTab>
@@ -153,7 +153,7 @@ include a standard-header like it's used by the files app.
 					href="#"
 					class="app-sidebar__close"
 					@click.prevent="closeSidebar">
-					<Close class="app-sidebar__close-icon" :size="24" decorative />
+					<Close class="app-sidebar__close-icon" :size="20" decorative />
 				</a>
 
 				<!-- container for figure and description, allows easy switching to compact mode -->

diff --git a/src/components/Avatar/Avatar.vue b/src/components/Avatar/Avatar.vue
@@ -70,7 +70,7 @@
 			<template #trigger>
 				<div v-if="contactsMenuLoading" class="icon-loading" />
 				<DotsHorizontal v-else
-					:size="24"
+					:size="20"
 					class="icon-more"
 					title=""
 					decorative />

diff --git a/src/components/Breadcrumbs/Breadcrumbs.vue b/src/components/Breadcrumbs/Breadcrumbs.vue
@@ -37,7 +37,7 @@ is dropped on a creadcrumb.
 			<Breadcrumbs @dropped="dropped">
 				<Breadcrumb title="Home" href="/" @dropped="droppedOnCrumb">
 					<template #icon>
-						<Folder :size="24" decorative />
+						<Folder :size="20" decorative />
 					</template>
 				</Breadcrumb>
 				<Breadcrumb title="Folder 1" href="/Folder 1" />

diff --git a/src/components/ColorPicker/ColorPicker.vue b/src/components/ColorPicker/ColorPicker.vue
@@ -125,7 +125,7 @@ export default {
 						type="button"
 						@click="pickColor(color)">
 						<Check v-if="color === currentColor"
-							:size="24"
+							:size="20"
 							title=""
 							decorative />
 					</button>
@@ -144,14 +144,14 @@ export default {
 					class="color-picker__navigation-button back"
 					type="button"
 					@click="handleBack">
-					<ArrowLeft :size="24" title="" decorative />
+					<ArrowLeft :size="20" title="" decorative />
 				</button>
 				<button
 					v-if="!advanced"
 					class="color-picker__navigation-button more-settings"
 					type="button"
 					@click="handleMoreSettings">
-					<DotsHorizontal :size="24" title="" decorative />
+					<DotsHorizontal :size="20" title="" decorative />
 				</button>
 				<button
 					v-if="advanced"

diff --git a/src/components/SettingsSection/SettingsSection.vue b/src/components/SettingsSection/SettingsSection.vue
@@ -49,7 +49,7 @@ This component is to be used in the settings section of nextcloud.
 				class="settings-section__info"
 				role="note"
 				:title="docTitleTranslated">
-				<HelpCircle :size="24" decorative title="" />
+				<HelpCircle :size="20" decorative title="" />
 			</a>
 		</h2>
 		<p v-if="hasDescription"