diff --git a/src/modules/usenet/UsenetModule.tsx b/src/modules/usenet/UsenetModule.tsx
index 58b5b52f6..6545889ee 100644
--- a/src/modules/usenet/UsenetModule.tsx
+++ b/src/modules/usenet/UsenetModule.tsx
@@ -1,4 +1,14 @@
-import { Badge, Button, Group, Select, Stack, Tabs, Text, Title } from '@mantine/core';
+import {
+  Badge,
+  Button,
+  Group,
+  Select,
+  Stack,
+  Tabs,
+  Text,
+  Title,
+  useMantineTheme,
+} from '@mantine/core';
 import { IconDownload, IconPlayerPause, IconPlayerPlay } from '@tabler/icons';
 import { FunctionComponent, useEffect, useState } from 'react';
 
@@ -50,47 +60,45 @@ export const UsenetComponent: FunctionComponent = () => {
   }
 
   const { ref, width, height } = useElementSize();
+  const MIN_WIDTH_MOBILE = useMantineTheme().breakpoints.xs;
 
   return (
     <Tabs keepMounted={false} defaultValue="queue">
-        <Tabs.List ref={ref} mb="md" style={{ flex: 1 }}>
-            <Tabs.Tab value="queue">{t('tabs.queue')}</Tabs.Tab>
-            <Tabs.Tab value="history">{t('tabs.history')}</Tabs.Tab>
-            {data && (
-              <Group position="right" ml="auto">
-                {
-                  // Only show if the width is > 400px
-                  width > 400 && (
-                    <>
-                      <Badge>{humanFileSize(data?.speed)}/s</Badge>
-                      <Badge>
-                        {t('info.sizeLeft')}: {humanFileSize(data?.sizeLeft)}
-                      </Badge>
-                    </>
-                  )
-                }
-
-                {data.paused ? (
-                  <Button uppercase onClick={() => resume()} radius="xl" size="xs">
-                    <IconPlayerPlay size={12} style={{ marginRight: 5 }} /> {t('info.paused')}
-                  </Button>
-                ) : (
-                  <Button uppercase onClick={() => pause()} radius="xl" size="xs">
-                    <IconPlayerPause size={12} style={{ marginRight: 5 }} />{' '}
-                    {dayjs.duration(data.eta, 's').format('HH:mm')}
-                  </Button>
-                )}
-              </Group>
+      <Tabs.List ref={ref} mb="md" style={{ flex: 1 }}>
+        <Tabs.Tab value="queue">{t('tabs.queue')}</Tabs.Tab>
+        <Tabs.Tab value="history">{t('tabs.history')}</Tabs.Tab>
+        {data && (
+          <Group position="right" ml="auto">
+            {width > MIN_WIDTH_MOBILE && (
+              <>
+                <Badge>{humanFileSize(data?.speed)}/s</Badge>
+                <Badge>
+                  {t('info.sizeLeft')}: {humanFileSize(data?.sizeLeft)}
+                </Badge>
+              </>
             )}
-        </Tabs.List>
-        {downloadServices.length > 1 && (
-          <Select
-            value={selectedServiceId}
-            onChange={setSelectedService}
-            ml="xs"
-            data={downloadServices.map((service) => ({ value: service.id, label: service.name }))}
-          />
+
+            {data.paused ? (
+              <Button uppercase onClick={() => resume()} radius="xl" size="xs">
+                <IconPlayerPlay size={12} style={{ marginRight: 5 }} /> {t('info.paused')}
+              </Button>
+            ) : (
+              <Button uppercase onClick={() => pause()} radius="xl" size="xs">
+                <IconPlayerPause size={12} style={{ marginRight: 5 }} />{' '}
+                {dayjs.duration(data.eta, 's').format('HH:mm')}
+              </Button>
+            )}
+          </Group>
         )}
+      </Tabs.List>
+      {downloadServices.length > 1 && (
+        <Select
+          value={selectedServiceId}
+          onChange={setSelectedService}
+          ml="xs"
+          data={downloadServices.map((service) => ({ value: service.id, label: service.name }))}
+        />
+      )}
       <Tabs.Panel value="queue">
         <UsenetQueueList serviceId={selectedServiceId} />
       </Tabs.Panel>