24h option

src/components/settings_modal/tabs/general_tab.js

@@ -30,6 +30,11 @@ const GeneralTab = {
         value: mode,
         label: this.$t(`settings.conversation_display_${mode}`)
       })),
+      absoluteTime12hOptions: ['24h', '12h'].map(mode => ({
+        key: mode,
+        value: mode,
+        label: this.$t(`settings.absolute_time_format_12h_${mode}`)
+      })),
       conversationOtherRepliesButtonOptions: ['below', 'inside'].map(mode => ({
         key: mode,
         value: mode,

src/components/settings_modal/tabs/general_tab.vue

@@ -249,6 +249,16 @@
               {{ $t('settings.absolute_time_format_min_age') }}
             </UnitSetting>
           </li>
+          <li>
+            <ChoiceSetting
+              id="absoluteTime12h"
+              path="absoluteTime12h"
+              :options="absoluteTime12hOptions"
+              :expert="1"
+            >
+              {{ $t('settings.absolute_time_format_12h') }}
+            </ChoiceSetting>
+          </li>
         </ul>
         <h3>{{ $t('settings.attachments') }}</h3>
         <li>

src/components/timeago/timeago.vue

@@ -28,6 +28,9 @@ export default {
       }
       return DateUtils.durationStrToMs(this.$store.getters.mergedConfig.absoluteTimeFormatMinAge) <= this.relativeTimeMs
     },
+    time12hFormat () {
+      return this.$store.getters.mergedConfig.absoluteTimeFormat12h === '12h'
+    },
     browserLocale () {
       return localeService.internalToBrowserLocale(this.$i18n.locale)
     },
@@ -57,22 +60,26 @@ export default {
         if (DateUtils.isSameDay(this.timeAsDate, now)) {
           return new Intl.DateTimeFormat(this.browserLocale, {
             minute: 'numeric',
-            hour: 'numeric'
+            hour: 'numeric',
+            hour12: this.time12hFormat
           })
         } else if (DateUtils.isSameMonth(this.timeAsDate, now)) {
           return new Intl.DateTimeFormat(this.browserLocale, {
             month: 'short',
-            day: 'numeric'
+            day: 'numeric',
+            hour12: this.time12hFormat
           })
         } else if (DateUtils.isSameYear(this.timeAsDate, now)) {
           return new Intl.DateTimeFormat(this.browserLocale, {
             month: 'short',
-            day: 'numeric'
+            day: 'numeric',
+            hour12: this.time12hFormat
           })
         } else {
           return new Intl.DateTimeFormat(this.browserLocale, {
             year: 'numeric',
-            month: 'short'
+            month: 'short',
+            hour12: this.time12hFormat
           })
         }
       })()

src/i18n/en.json

@@ -532,6 +532,9 @@
     "emoji_reactions_scale": "Reactions scale factor",
     "absolute_time_format": "Use absolute time format",
     "absolute_time_format_min_age": "Only use for time older than this amount of time",
+    "absolute_time_format_12h": "Time format",
+    "absolute_time_format_12h_12h": "12 hour format (i.e. 10:00 PM)",
+    "absolute_time_format_12h_24h": "24 hour format (i.e. 22:00)",
     "export_theme": "Save preset",
     "filtering": "Filtering",
     "wordfilter": "Wordfilter",

src/modules/config.js

@@ -193,6 +193,7 @@ export const defaultState = {
   autoSaveDraft: undefined, // instance default
   useAbsoluteTimeFormat: undefined, // instance default
   absoluteTimeFormatMinAge: undefined, // instance default
+  absoluteTime12h: undefined, // instance default
   imageCompression: true
 }
 

src/modules/instance.js

@@ -131,6 +131,7 @@ const defaultState = {
   autoSaveDraft: false,
   useAbsoluteTimeFormat: false,
   absoluteTimeFormatMinAge: '0d',
+  absoluteTime12h: '24h',
 
   // Nasty stuff
   customEmoji: [],