fix(templates): keep postfix descriptions inside their rows (#2116)

src/features/templates/settings/LiveTemplatesPage.tsx

@@ -112,7 +112,9 @@ export function LiveTemplatesPage() {
                     <span className={clsx(styles.itemLabel, isModifiedBuiltin(t.id) && styles.modified)}>
                       {t.abbrev}
                     </span>
-                    <span className={styles.itemDetail}>{t.description}</span>
+                    <span className={styles.itemDetail} title={t.description}>
+                      {t.description}
+                    </span>
                   </div>
                 ))}
               </div>

src/features/templates/settings/PostfixPage.tsx

@@ -63,7 +63,9 @@ export function PostfixPage() {
               aria-label={tx`Enable .${t.key}`}
             />
             <span className={styles.mono}>.{t.key}</span>
-            <span className={styles.itemDetail}>{t.description}</span>
+            <span className={styles.itemDetail} title={t.description}>
+              {t.description}
+            </span>
           </div>
         ))}
       </div>

src/features/templates/settings/Settings.module.css

@@ -81,6 +81,8 @@
   color: var(--fg-emphasis);
 }
 .itemDetail {
+  min-width: 0;
+  white-space: nowrap;
   color: var(--fg-subtle);
   overflow: hidden;
   text-overflow: ellipsis;