Merge branch 'main' into feat/totally-hide-strict-filters

components/main/MainContent.vue

@@ -5,6 +5,9 @@ defineProps<{
   /** Show the back button on both small and big screens */
   back?: boolean
 }>()
+
+const route = useRoute()
+const wideLayout = computed(() => route.meta.wideLayout ?? false)
 </script>
 
 <template>
@@ -13,9 +16,10 @@ defineProps<{
       sticky top-0 z10 backdrop-blur
       pt="[env(safe-area-inset-top,0)]"
       border="b base" bg="[rgba(var(--rbg-bg-base),0.7)]"
+      class="native:lg:w-[calc(100vw-5rem)] native:xl:w-[calc(135%+(100vw-1200px)/2)]"
     >
-      <div flex justify-between px5 py2 :class="{ 'xl:hidden': $route.name !== 'tag' }" data-tauri-drag-region>
+      <div flex justify-between px5 py2 :class="{ 'xl:hidden': $route.name !== 'tag' }" data-tauri-drag-region class="native:xl:flex">
-        <div flex gap-3 items-center overflow-hidden py2>
+        <div flex gap-3 items-center overflow-hidden py2 class="native-mac:pl-14 native-mac:sm:pl-0">
           <NuxtLink
             v-if="backOnSmallScreen || back" flex="~ gap1" items-center btn-text p-0 xl:hidden
             :aria-label="$t('nav.back')"
@@ -38,6 +42,8 @@ defineProps<{
       <slot name="header" />
     </div>
     <div :class="{ 'xl:block': $route.name !== 'tag' }" hidden h-6 />
-    <slot />
+    <div :class="isHydrated && wideLayout ? 'xl:w-full sm:max-w-600px' : 'sm:max-w-600px md:shrink-0'" m-auto>
+      <slot />
+    </div>
   </div>
 </template>

components/nav/NavLogo.vue

@@ -29,9 +29,9 @@
 
 <style scoped>
 svg path.wood {
-    fill: var(--c-text-secondary);
+    fill: var(--c-primary);
 }
 svg path.body {
-    fill: var(--c-text-base);
+    fill: var(--c-text-secondary);
 }
 </style>

components/nav/NavTitle.vue

@@ -23,8 +23,8 @@ router.afterEach(() => {
       external
     >
       <NavLogo shrink-0 aspect="1/1" sm:h-8 xl:h-10 class="rtl-flip" />
-      <div hidden xl:block>
+      <div hidden xl:block text-secondary>
-        {{ $t('app_name') }} <sup text-sm italic text-secondary mt-1>{{ env === 'release' ? 'alpha' : env }}</sup>
+        {{ $t('app_name') }} <sup text-sm italic mt-1>{{ env === 'release' ? 'alpha' : env }}</sup>
       </div>
     </NuxtLink>
     <div

components/publish/PublishAttachment.vue

@@ -30,9 +30,8 @@ const toggleApply = () => {
       <div
         v-if="removable"
         :aria-label="$t('attachment.remove_label')"
-        hover:bg="gray/40" transition-100 p-1 rounded-5 cursor-pointer
+        class="bg-black/75 hover:bg-red/75"
-        :class="[isHydrated && isSmallScreen ? '' : 'op-0 group-hover:op-100hover:']"
+        text-white px2 py2 rounded-full cursor-pointer
-        mix-blend-difference
         @click="$emit('remove')"
       >
         <div i-ri:close-line text-3 :class="[isHydrated && isSmallScreen ? 'text-6' : 'text-3']" />

components/status/StatusCard.vue

@@ -95,12 +95,12 @@ const showReplyTo = $computed(() => !replyToMain && !directReply)
       <template v-if="status.inReplyToAccountId">
         <StatusReplyingTo
           v-if="showReplyTo"
-          ml-6 pt-1 pl-5
+          ml-20px pt-1 pl-5
           :status="status"
           :is-self-reply="isSelfReply"
           :class="faded ? 'text-secondary-light' : ''"
         />
-        <div flex="~ col gap-1" items-center pos="absolute top-0 left-0" w="20.5" z--1>
+        <div flex="~ col gap-1" items-center pos="absolute top-0 left-0" w="77px" z--1>
           <template v-if="showReplyTo">
             <div w="1px" h="0.5" border="x base" mt-3 />
             <div w="1px" h="0.5" border="x base" />

components/status/StatusTranslation.vue

@@ -10,6 +10,9 @@ const {
   translation,
   enabled: isTranslationEnabled,
 } = useTranslation(status, getLanguageCode())
+const preferenceHideTranslation = usePreferences('hideTranslation')
+
+const showButton = computed(() => !preferenceHideTranslation.value && isTranslationEnabled && status.language !== getLanguageCode())
 
 let translating = $ref(false)
 const toggleTranslation = async () => {
@@ -26,7 +29,7 @@ const toggleTranslation = async () => {
 <template>
   <div>
     <button
-      v-if="isTranslationEnabled && status.language !== getLanguageCode()" p-0 flex="~ center" gap-2 text-sm
+      v-if="showButton" p-0 flex="~ center" gap-2 text-sm
       :disabled="translating" disabled-bg-transparent btn-text class="disabled-text-$c-text-btn-disabled-deeper" @click="toggleTranslation"
     >
       <span v-if="translating" block animate-spin preserve-3d>

composables/settings/definition.ts

@@ -7,6 +7,7 @@ export interface PreferencesSettings {
   hideBoostCount: boolean
   hideFavoriteCount: boolean
   hideFollowerCount: boolean
+  hideTranslation: boolean
   grayscaleMode: boolean
   enableAutoplay: boolean
   experimentalVirtualScroller: boolean
@@ -58,6 +59,7 @@ export const DEFAULT__PREFERENCES_SETTINGS: PreferencesSettings = {
   hideBoostCount: false,
   hideFavoriteCount: false,
   hideFollowerCount: false,
+  hideTranslation: false,
   grayscaleMode: false,
   enableAutoplay: true,
   experimentalVirtualScroller: true,

layouts/default.vue

@@ -16,11 +16,11 @@ const isGrayscale = usePreferences('grayscaleMode')
 
 <template>
   <div h-full :data-mode="isHydrated && isGrayscale ? 'grayscale' : ''">
-    <main flex w-full mxa lg:max-w-80rem>
+    <main flex w-full mxa lg:max-w-80rem class="native:grid native:sm:grid-cols-[auto_1fr] native:lg:grid-cols-[auto_minmax(600px,2fr)_1fr]">
-      <aside class="hidden sm:flex w-1/8 md:w-1/6 lg:w-1/5 xl:w-1/4 justify-end xl:me-4 zen-hide" relative>
+      <aside class="hidden native:w-auto sm:flex w-1/8 md:w-1/6 lg:w-1/5 xl:w-1/4 justify-end xl:me-4 zen-hide" relative>
         <div sticky top-0 w-20 xl:w-100 h-screen flex="~ col" lt-xl-items-center>
           <slot name="left">
-            <div flex="~ col" overflow-y-auto justify-between h-full max-w-full mt-5>
+            <div flex="~ col" overflow-y-auto justify-between h-full max-w-full pt-5 native:pt-7 overflow-x-hidden>
               <NavTitle />
               <NavSide command />
               <div flex-auto />
@@ -50,7 +50,7 @@ const isGrayscale = usePreferences('grayscaleMode')
           </slot>
         </div>
       </aside>
-      <div w-full min-h-screen :class="isHydrated && wideLayout ? 'xl:w-full sm:w-600px' : 'sm:w-600px md:shrink-0'" border-base>
+      <div w-full min-h-screen border-base>
         <div min-h="[calc(100vh-3.5rem)]" sm:min-h-screen>
           <slot />
         </div>
@@ -59,7 +59,7 @@ const isGrayscale = usePreferences('grayscaleMode')
           <NavBottom v-if="isHydrated" sm:hidden />
         </div>
       </div>
-      <aside v-if="isHydrated && !wideLayout" class="hidden sm:none lg:block w-1/4 zen-hide">
+      <aside v-if="isHydrated && !wideLayout" class="hidden sm:none lg:block w-1/4 zen-hide native:lg:w-full">
         <div sticky top-0 h-screen flex="~ col" gap-2 py3 ms-2>
           <slot name="right">
             <div flex-auto />

locales/de-DE.json

@@ -335,6 +335,7 @@
       "hide_boost_count": "Boost-Zähler ausblenden",
       "hide_favorite_count": "Favoritenzahl ausblenden",
       "hide_follower_count": "Anzahl der Follower ausblenden",
+      "hide_translation": "Übersetzungen ausblenden",
       "label": "Einstellungen",
       "title": "Experimentelle Funktionen",
       "user_picker": "Benutzerauswahl",

locales/en-US.json

@@ -372,6 +372,7 @@
       "hide_boost_count": "Hide boost count",
       "hide_favorite_count": "Hide favorite count",
       "hide_follower_count": "Hide follower count",
+      "hide_translation": "Hide translation",
       "label": "Preferences",
       "title": "Experimental Features",
       "user_picker": "User Picker",

locales/ja-JP.json

@@ -28,6 +28,8 @@
     "muted_users": "ミュートしたユーザー",
     "muting": "ミュート済み",
     "mutuals": "相互フォロー",
+    "notifications_on_post_disable": "{username}さんが投稿したときの通知を停止する",
+    "notifications_on_post_enable": "{username}さんが投稿したときに通知する",
     "pinned": "固定した投稿",
     "posts": "投稿",
     "posts_count": "{0} 投稿",
@@ -46,6 +48,7 @@
     "boost": "ブースト",
     "boost_count": "{0}",
     "boosted": "ブースト済み",
+    "clear_publish_failed": "投稿エラーをクリア",
     "clear_upload_failed": "ファイルアップロードエラーをクリア",
     "close": "閉じる",
     "compose": "投稿",
@@ -88,11 +91,6 @@
     "toggle_zen_mode": "禅モードを切り替える"
   },
   "common": {
-    "confirm_dialog": {
-      "cancel": "いいえ",
-      "confirm": "はい",
-      "title": "本当にいいですか？"
-    },
     "end_of_list": "リストの最後です",
     "error": "ERROR",
     "in": "in",
@@ -103,9 +101,52 @@
     "draft_title": "下書き {0}",
     "drafts": "下書き ({v})"
   },
+  "confirm": {
+    "block_account": {
+      "cancel": "キャンセル",
+      "confirm": "ブロック",
+      "title": "{0}さんを本当にミュートしたいですか？"
+    },
+    "block_domain": {
+      "cancel": "キャンセル",
+      "confirm": "ブロック",
+      "title": "{0}さんを本当にブロックしたいですか？"
+    },
+    "common": {
+      "cancel": "いいえ",
+      "confirm": "はい"
+    },
+    "delete_posts": {
+      "cancel": "キャンセル",
+      "confirm": "削除",
+      "title": "この投稿を本当に削除したいですか？"
+    },
+    "mute_account": {
+      "cancel": "キャンセル",
+      "confirm": "ミュート",
+      "title": "{0}さんを本当にミュートしたいですか？"
+    },
+    "show_reblogs": {
+      "cancel": "キャンセル",
+      "confirm": "表示",
+      "title": "{0}さんのブーストを本当に表示したいですか？"
+    },
+    "unfollow": {
+      "cancel": "キャンセル",
+      "confirm": "フォロー解除",
+      "title": "本当にフォロー解除したいですか？"
+    }
+  },
   "conversation": {
     "with": "with"
   },
+  "custom_cards": {
+    "stackblitz": {
+      "lines": "Lines {0}",
+      "open": "Open",
+      "snippet_from": "Snippet from {0}"
+    }
+  },
   "error": {
     "account_not_found": "アカウント {0} が見つかりません",
     "explore-list-empty": "現在トレンドには何もありません。あとで確認してください！",
@@ -115,6 +156,12 @@
     "unsupported_file_format": "対応していないファイル形式です"
   },
   "help": {
+    "build_preview": {
+      "desc1": "あなたは現在、コミュニティから提供されたプレビュー版のElkを表示しています - {0}。",
+      "desc2": "まだレビューされていない変更や、害がある変更が含まれている可能性もあります。",
+      "desc3": "実際のアカウントでは決してログインしないでください。",
+      "title": "プレビューデプロイ"
+    },
     "desc_highlight": "いくつかのバグや足りない機能がいろいろなところにあることが期待されています。",
     "desc_para1": "開発中のMastodonウェブクライアントのElkに興味を持って試してくれてありがとうございます！",
     "desc_para2": "私たちは時間をかけて開発と改善に努めています。",
@@ -131,13 +178,9 @@
     "block_account": "{0}さんをブロック",
     "block_domain": "{0}をドメインブロック",
     "copy_link_to_post": "この投稿へのリンクをコピー",
+    "copy_original_link_to_post": "この投稿へのオリジナルのリンクをコピー",
     "delete": "削除",
     "delete_and_redraft": "削除して下書きに戻す",
-    "delete_confirm": {
-      "cancel": "キャンセル",
-      "confirm": "削除",
-      "title": "この投稿を本当に削除したいですか？"
-    },
     "direct_message_account": "{0}さんにダイレクトメッセージ",
     "edit": "編集",
     "hide_reblogs": "{0} からのブーストを隠す",
@@ -166,7 +209,7 @@
     "blocked_domains": "ブロックしたドメイン",
     "blocked_users": "ブロックしたユーザー",
     "bookmarks": "ブックマーク",
-    "built_at": "{0}にビルド",
+    "built_at": "ビルド {0}",
     "compose": "投稿",
     "conversations": "会話",
     "explore": "話題の投稿",
@@ -210,9 +253,9 @@
     "update_available_short": "Elkをアップデート",
     "webmanifest": {
       "canary": {
-        "description": "軽快なMastodonウェブクライアント (カナリー版)",
+        "description": "軽快なMastodonウェブクライアント (canary)",
-        "name": "Elk (カナリー版)",
+        "name": "Elk (canary)",
-        "short_name": "Elk (カナリー版)"
+        "short_name": "Elk (canary)"
       },
       "dev": {
         "description": "軽快なMastodonウェブクライアント (dev)",
@@ -220,9 +263,9 @@
         "short_name": "Elk (dev)"
       },
       "preview": {
-        "description": "軽快なMastodonウェブクライアント (プレビュー版)",
+        "description": "軽快なMastodonウェブクライアント (preview)",
-        "name": "Elk (プレビュー版)",
+        "name": "Elk (preview)",
-        "short_name": "Elk (プレビュー版)"
+        "short_name": "Elk (preview)"
       },
       "release": {
         "description": "軽快なMastodonウェブクライアント",
@@ -251,12 +294,6 @@
       "description": "Mastodon UIでアカウントの設定を編集します",
       "label": "アカウント設定"
     },
-    "feature_flags": {
-      "github_cards": "GitHubカード",
-      "title": "実験的機能",
-      "user_picker": "ユーザーピッカー",
-      "virtual_scroll": "仮想スクロール"
-    },
     "interface": {
       "color_mode": "カラーモード",
       "dark_mode": "ダークモード",
@@ -271,7 +308,8 @@
         "xl": "極大",
         "xs": "極小"
       },
-      "system_mode": "システム"
+      "system_mode": "システム",
+      "theme_color": "テーマカラー"
     },
     "language": {
       "display_language": "表示言語",
@@ -316,8 +354,8 @@
         "warning": {
           "enable_close": "閉じる",
           "enable_description": "Elkを開いていないときにも通知を受け取るには、プッシュ通知を有効にしてください。一度有効化すると、上の\"@:settings.notifications.show_btn{'\"'}ボタンで、プッシュ通知を行う種類のインタラクションを細かくコントロールできます。",
-          "enable_description_desktop": "Elkを開いていないときにも通知を受け取るには、プッシュ通知を有効にしてください。一度有効化すると、\"設定 > 通知 > プッシュ通知の設定\"から、プッシュ通知を行う種類のインタラクションを細かくコントロールできます。",
+          "enable_description_desktop": "Elkを開いていないときにも通知を受け取るには、プッシュ通知を有効にしてください。一度有効化すると、\"設定 > 通知 > プッシュ通知の設定\" から、プッシュ通知を行う種類のインタラクションを細かくコントロールできます。",
-          "enable_description_mobile": "また、ナビゲーションメニュー\"設定 > 通知 > プッシュ通知の設定\"を使用して設定をアクセスすることもできます。",
+          "enable_description_mobile": "また、ナビゲーションメニュー \"設定 > 通知 > プッシュ通知の設定\" を使用して設定をアクセスすることもできます。",
           "enable_description_settings": "Elkを開いていないときにも通知を受け取るには、プッシュ通知を有効にしてください。一度有効化すると、同じこの画面上でプッシュ通知を行う種類のインタラクションを細かくコントロールできます。",
           "enable_desktop": "プッシュ通知を有効にする",
           "enable_title": "Never miss anything",
@@ -328,7 +366,16 @@
     },
     "notifications_settings": "通知",
     "preferences": {
-      "label": "環境設定"
+      "enable_autoplay": "自動再生を有効化",
+      "github_cards": "GitHubカード",
+      "grayscale_mode": "グレースケールモード",
+      "hide_boost_count": "ブーストの数を隠す",
+      "hide_favorite_count": "お気に入りの数を隠す",
+      "hide_follower_count": "フォロワーの数を隠す",
+      "label": "環境設定",
+      "title": "実験的機能",
+      "user_picker": "ユーザーピッカー",
+      "virtual_scroll": "仮想スクロール"
     },
     "profile": {
       "appearance": {
@@ -351,14 +398,6 @@
       "export": "ユーザートークンのエクスポート",
       "import": "ユーザートークンのインポート",
       "label": "ログインユーザー"
-    },
-    "wellness": {
-      "feature": {
-        "hide_boost_count": "ブーストの数を隠す",
-        "hide_favorite_count": "お気に入りの数を隠す",
-        "hide_follower_count": "フォロワーの数を隠す"
-      },
-      "label": "ウェルネス"
     }
   },
   "share-target": {
@@ -372,6 +411,7 @@
     "edited": "(編集済み)",
     "editing": "編集中",
     "loading": "読込中...",
+    "publish_failed": "投稿に失敗しました",
     "publishing": "投稿中",
     "upload_failed": "アップロードに失敗しました",
     "uploading": "更新中..."

nuxt.config.ts

@@ -48,6 +48,9 @@ export default defineNuxtConfig({
     '~/styles/default-theme.css',
     '~/styles/vars.css',
     '~/styles/global.css',
+    ...process.env.TAURI_PLATFORM === 'macos'
+      ? []
+      : ['~/styles/scrollbars.css'],
     '~/styles/tiptap.css',
     '~/styles/dropdown.css',
   ],

pages/settings/preferences/index.vue

@@ -33,6 +33,12 @@ const userSettings = useUserSettings()
     >
       {{ $t('settings.preferences.hide_follower_count') }}
     </SettingsToggleItem>
+    <SettingsToggleItem
+      :checked="getPreferences(userSettings, 'hideTranslation')"
+      @click="togglePreferences('hideTranslation')"
+    >
+      {{ $t('settings.preferences.hide_translation') }}
+    </SettingsToggleItem>
     <SettingsToggleItem
       :checked="getPreferences(userSettings, 'grayscaleMode')"
       @click="togglePreferences('grayscaleMode')"

styles/global.css

@@ -12,32 +12,6 @@ html {
   src: url(/fonts/homemade-apple-v18.ttf) format('truetype');
 }
 
-* {
-  scrollbar-color: #8885 var(--c-border);
-}
-
-::-webkit-scrollbar {
-  width: 10px;
-}
-
-::-webkit-scrollbar:horizontal {
-  height: 10px;
-}
-
-::-webkit-scrollbar-track {
-  background: var(--c-border);
-  border-radius: 1px;
-}
-
-::-webkit-scrollbar-thumb {
-  background: #8885;
-  border-radius: 1px;
-}
-
-::-webkit-scrollbar-thumb:hover {
-  background: #8886;
-}
-
 ::-moz-selection {
   background: var(--c-bg-selection);
 }

styles/scrollbars.css

@@ -0,0 +1,25 @@
+* {
+  scrollbar-color: #8885 var(--c-border);
+}
+
+::-webkit-scrollbar {
+  width: 10px;
+}
+
+::-webkit-scrollbar:horizontal {
+  height: 10px;
+}
+
+::-webkit-scrollbar-track {
+  background: var(--c-border);
+  border-radius: 1px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: #8885;
+  border-radius: 1px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: #8886;
+}

unocss.config.ts

@@ -100,6 +100,24 @@ export default defineConfig({
       },
     },
   },
+  variants: [
+    (matcher) => {
+      if (!process.env.TAURI_PLATFORM || !matcher.startsWith('native:'))
+        return matcher
+      return {
+        matcher: matcher.slice(7),
+        layer: 'native',
+      }
+    },
+    (matcher) => {
+      if (process.env.TAURI_PLATFORM !== 'macos' || !matcher.startsWith('native-mac:'))
+        return matcher
+      return {
+        matcher: matcher.slice(11),
+        layer: 'native-mac',
+      }
+    },
+  ],
   rules: [
     // scrollbar-hide
     [/^scrollbar-hide$/, (_, { constructCSS }) => {