refactor: various typo fixes (#2735)

CONTRIBUTING.md

@@ -83,7 +83,7 @@ Simple approach used by most websites of relying on direction set in HTML elemen
 We've added some `UnoCSS` utilities styles to help you with that:
 - Do not use `left/right` padding and margin: for example `pl-1`. Use `padding-inline-start/end` instead. So `pl-1` should be `ps-1`, `pr-1` should be `pe-1`. The same rules apply to margin.
 - Do not use `rtl-` classes, such as `rtl-left-0`.
-- For icons that should be rotated for RTL, add `class="rtl-flip"`. This can only be used for icons outside of elements with `dir="auto"`, such as timeline, and is the only exception from the rule above. For icons inside the timeline, it might not work as expected.
+- For icons that should be rotated for RTL, add `class="rtl-flip"`. This can only be used for icons outside of elements with `dir="auto"`, such as timeline, and is the only exception to the rule above. For icons inside the timeline, it might not work as expected.
 - For absolute positioned elements, don't use `left/right`: for example `left-0`. Use `inset-inline-start/end` instead. `UnoCSS` shortcuts are `inset-is` for `inset-inline-start` and `inset-ie` for `inset-inline-end`. Example: `left-0` should be replaced with `inset-is-0`.
 - If you need to change the border radius for an entire left or right side, use `border-inline-start/end`. `UnoCSS` shortcuts are `rounded-is` for left side, `rounded-ie` for right side. Example: `rounded-l-5` should be replaced with `rounded-ie-5`.
 - If you need to change the border radius for one corner, use `border-start-end-radius` and similar rules. `UnoCSS` shortcuts are `rounded` + top/bottom as either `-bs` (top) or `-be` (bottom) + left/right as either `-is` (left) or `-ie` (right). Example: `rounded-tl-0` should be replaced with `rounded-bs-is-0`.

components/common/CommonTabs.vue

@@ -19,8 +19,8 @@ const tabs = computed(() => {
   })
 })
 
-function toValidName(otpion: string) {
+function toValidName(option: string) {
-  return otpion.toLowerCase().replace(/[^a-zA-Z0-9]/g, '-')
+  return option.toLowerCase().replace(/[^a-zA-Z0-9]/g, '-')
 }
 
 useCommands(() => command

components/modal/ModalMediaPreviewCarousel.vue

@@ -15,7 +15,7 @@ const emit = defineEmits<{
 const modelValue = defineModel<number>({ required: true })
 
 const slideGap = 20
-const doubleTapTreshold = 250
+const doubleTapThreshold = 250
 
 const view = ref()
 const slider = ref()
@@ -147,7 +147,7 @@ function handleLastDrag(tap: boolean, swipe: Vector2, movement: Vector2, positio
 let lastTapAt = 0
 function handleTap([positionX, positionY]: Vector2) {
   const now = Date.now()
-  const isDoubleTap = now - lastTapAt < doubleTapTreshold
+  const isDoubleTap = now - lastTapAt < doubleTapThreshold
   lastTapAt = now
 
   if (!isDoubleTap)
@@ -218,7 +218,7 @@ function handleZoomDrag([deltaX, deltaY]: Vector2) {
 function handleSlideDrag([movementX, movementY]: Vector2) {
   goToFocusedSlide()
 
-  if (Math.abs(movementY) > Math.abs(movementX)) // vertical movement is more then horizontal
+  if (Math.abs(movementY) > Math.abs(movementX)) // vertical movement is more than horizontal
     y.value -= movementY / scale.value
   else
     x.value -= movementX / scale.value

components/notification/NotificationPaginator.vue

@@ -25,7 +25,7 @@ function includeNotificationsForStatusCard({ type, status }: mastodon.v1.Notific
 
 // Group by type (and status when applicable)
 function groupId(item: mastodon.v1.Notification): string {
-  // If the update is related to an status, group notifications from the same account (boost + favorite the same status)
+  // If the update is related to a status, group notifications from the same account (boost + favorite the same status)
   const id = item.status
     ? {
         status: item.status?.id,

composables/content-parse.ts

@@ -623,7 +623,7 @@ function transformCollapseMentions(status?: mastodon.v1.Status, inReplyToStatus?
 
     // We have a special case for single mentions that are part of a reply.
     // We already have the replying to badge in this case or the status is connected to the previous one.
-    // This is needed because the status doesn't included the in Reply to handle, only the account id.
+    // This is needed because the status doesn't include the in Reply to handle, only the account id.
     // But this covers the majority of cases.
     const showMentions = !(contextualMentionsCount === 0 || (mentionsCount === 1 && status?.inReplyToAccountId))
     const grouped = contextualMentionsCount > 2

docs/README.md

@@ -44,7 +44,7 @@ When you are ready to submit work back to the main Elk repo, create a PR.
    - base branch should be **main**
    - Head repository should be your fork
    - Compare branch should be your working branch you want to submit
-   If you don't see four drop downs, be sure you are comparing across forks.
+   If you don't see four drop-downs, be sure you are comparing across forks.
 10. Add a description of the changes your request makes
 11. Select **Add Pull Request**
 
@@ -65,7 +65,7 @@ Avoid screenshots until Elk reaches a stable release.
 
 ### Standards
 
-Write in **American English** using spelling as found in [Merriam Webster](https://www.merriam-webster.com).
+Write in **American English** using spelling as found in [Merriam-Webster](https://www.merriam-webster.com).
 Translation and localization will be handled separately as/when availability or necessity allow.
 
 Use [**semantic linefeeds**](https://rhodesmill.org/brandon/2012/one-sentence-per-line/) with no more than one sentence per line.

docs/components/global/ToggleIcon.vue

@@ -1,6 +1,6 @@
 <script>
 export default {
-  name: 'ToogleIcon',
+  name: 'ToggleIcon',
   props: { up: Boolean },
 }
 </script>

docs/components/global/TranslationState.vue

@@ -116,7 +116,7 @@ async function copyToClipboard() {
           >
             <td :class="[{ expandable: !isSource }]">
               <div>
-                <ToogleIcon v-if="!isSource" :up="hidden || key !== locale" />
+                <ToggleIcon v-if="!isSource" :up="hidden || key !== locale" />
                 {{ title }}
               </div>
             </td>

docs/content/2.deployment/1.netlify.md

@@ -56,6 +56,6 @@ On your project page open the Deploys tab, click on "Trigger deploy" and "Deploy
 ## Use a custom domain
 If you want to use a custom domain, go to "Domain settings" on your Netlify project page, and press "Add custom domain". If your domain is not bought from Netlify, it will ask you to add a CNAME record. Do that.
 
-Once the custom domain is added, you'll need to add an SSL/TLS certificate. At the bottom of the page press "Verify DNS configuration" and if it succeeds, press "Provision certificate". If that fails, you may need to wait some time until your DNS propagetes.
+Once the custom domain is added, you'll need to add an SSL/TLS certificate. At the bottom of the page press "Verify DNS configuration" and if it succeeds, press "Provision certificate". If that fails, you may need to wait some time until your DNS propagates.
 
 And that's it! Enjoy your instance's Elk!

service-worker/notification.ts

@@ -78,7 +78,7 @@ export function createNotificationOptions(
       notificationOptions.timestamp = new Date(notification.created_at).getTime()
     }
 
-    /* TODO: add spolier when actions available, checking also notification type
+    /* TODO: add spoiler when actions available, checking also notification type
     if (notification.status && (notification.status.spoilerText || notification.status.sensitive)) {
       if (notification.status.spoilerText)
         notificationOptions.body = notification.status.spoilerText