Fixed: Improve quality and episode info output in parse result

frontend/src/Parse/ParseResult.css

@@ -1,20 +1,8 @@
-.item {
+.container {
   display: flex;
+  flex-wrap: wrap;
 }
 
-.title {
+.column {
-  margin-right: 20px;
+  flex: 0 0 50%;
-  width: 250px;
-  text-align: right;
-  font-weight: bold;
-}
-
-.description {
-  /* composes: description from '~Components/DescriptionList/DescriptionListItemTitle.css'; */
-}
-
-@media (max-width: $breakpointSmall) {
-  .item {
-    display: block;
-  }
 }

frontend/src/Parse/ParseResult.css.d.ts

@@ -1,9 +1,8 @@
 // This file is automatically generated.
 // Please do not change this file!
 interface CssExports {
-  'description': string;
+  'column': string;
-  'item': string;
+  'container': string;
-  'title': string;
 }
 export const cssExports: CssExports;
 export default cssExports;

frontend/src/Parse/ParseResult.tsx

@@ -5,6 +5,7 @@ import EpisodeFormats from 'Episode/EpisodeFormats';
 import SeriesTitleLink from 'Series/SeriesTitleLink';
 import translate from 'Utilities/String/translate';
 import ParseResultItem from './ParseResultItem';
+import styles from './ParseResult.css';
 
 interface ParseResultProps {
   item: ParseModel;
@@ -85,6 +86,8 @@ function ParseResult(props: ParseResultProps) {
       */}
 
       <FieldSet legend={translate('Episode Info')}>
+        <div className={styles.container}>
+          <div className={styles.column}>
             <ParseResultItem
               title={translate('Season Number')}
               data={
@@ -108,6 +111,18 @@ function ParseResult(props: ParseResultProps) {
               }
             />
 
+            <ParseResultItem
+              title={translate('Daily')}
+              data={isDaily ? 'True' : 'False'}
+            />
+
+            <ParseResultItem
+              title={translate('Air Date')}
+              data={airDate ?? '-'}
+            />
+          </div>
+
+          <div className={styles.column}>
             <ParseResultItem
               title={translate('Special')}
               data={special ? 'True' : 'False'}
@@ -127,16 +142,13 @@ function ParseResult(props: ParseResultProps) {
               title={translate('Partial Season')}
               data={isPartialSeason ? 'True' : 'False'}
             />
-
+          </div>
-        <ParseResultItem
+        </div>
-          title={translate('Daily')}
-          data={isDaily ? 'True' : 'False'}
-        />
-
-        <ParseResultItem title={translate('Air Date')} data={airDate ?? '-'} />
       </FieldSet>
 
       <FieldSet legend={translate('Quality')}>
+        <div className={styles.container}>
+          <div className={styles.column}>
             <ParseResultItem
               title={translate('Quality')}
               data={quality.quality.name}
@@ -144,14 +156,18 @@ function ParseResult(props: ParseResultProps) {
 
             <ParseResultItem
               title={translate('Version')}
-          data={quality.revision.version > 1 ? quality.revision.version : '-'}
+              data={
+                quality.revision.version > 1 ? quality.revision.version : '-'
+              }
             />
 
             <ParseResultItem
               title={translate('Real')}
               data={quality.revision.real ? 'True' : '-'}
             />
+          </div>
 
+          <div className={styles.column}>
             <ParseResultItem
               title={translate('Proper')}
               data={
@@ -165,6 +181,8 @@ function ParseResult(props: ParseResultProps) {
               title={translate('Repack')}
               data={quality.revision.isRepack ? 'True' : '-'}
             />
+          </div>
+        </div>
       </FieldSet>
 
       <FieldSet legend={translate('Languages')}>