diff --git a/frontend/src/core/components/tools/compress/CompressSettings.tsx b/frontend/src/core/components/tools/compress/CompressSettings.tsx
index 8d9fca833..bc2a31284 100644
--- a/frontend/src/core/components/tools/compress/CompressSettings.tsx
+++ b/frontend/src/core/components/tools/compress/CompressSettings.tsx
@@ -1,4 +1,5 @@
import { Stack, Text, NumberInput, Select, Divider, Checkbox } from "@mantine/core";
+import SliderWithInput from '@app/components/shared/sliderWithInput/SliderWithInput';
import { useTranslation } from "react-i18next";
import { CompressParameters } from "@app/hooks/tools/compress/useCompressParameters";
import ButtonSelector from "@app/components/shared/ButtonSelector";
@@ -32,24 +33,19 @@ const CompressSettings = ({ parameters, onParameterChange, disabled = false }: C
{parameters.compressionMethod === 'quality' && (
- Compression Level
- onParameterChange('compressionLevel', value)}
disabled={disabled}
- marks={[
- { value: 1, label: 'Min 1' },
- { value: 9, label: 'Max 9' },
- ]}
- label={(value) => `${value}`}
+ min={1}
+ max={9}
+ step={1}
/>
- {parameters.compressionLevel <= 3 && "1-3 PDF compression"}
- {parameters.compressionLevel >= 4 && parameters.compressionLevel <= 6 && "4-6 lite image compression"}
- {parameters.compressionLevel >= 7 && "7-9 intense image compression Will dramatically reduce image quality"}
+ {parameters.compressionLevel <= 3 && t('compress.tooltip.qualityAdjustment.bullet1', '1-3 PDF compression')}
+ {parameters.compressionLevel >= 4 && parameters.compressionLevel <= 6 && t('compress.tooltip.qualityAdjustment.text', '4-6 lite image compression')}
+ {parameters.compressionLevel >= 7 && t('compress.tooltip.qualityAdjustment.bullet2', '7-9 intense image compression Will dramatically reduce image quality')}
)}
diff --git a/frontend/src/proprietary/routes/authShared/auth.css b/frontend/src/proprietary/routes/authShared/auth.css
index 7f75e9dda..907ffe973 100644
--- a/frontend/src/proprietary/routes/authShared/auth.css
+++ b/frontend/src/proprietary/routes/authShared/auth.css
@@ -185,8 +185,8 @@
width: 100%;
display: flex;
align-items: center;
- justify-content: center;
- padding: 1rem 1rem; /* 16px 16px */
+ justify-content: flex-start;
+ padding: 0.75rem 1rem; /* 12px 16px */
border: 1px solid #d1d5db;
border-radius: 0.75rem; /* 12px */
background-color: var(--auth-card-bg-light-only);
@@ -195,6 +195,12 @@
color: var(--auth-text-primary-light-only);
cursor: pointer;
gap: 0.75rem; /* 12px */
+ font-family: inherit;
+ transition: background-color 0.2s ease;
+}
+
+.oauth-button-vertical:hover:not(:disabled) {
+ background-color: #f3f4f6;
}
.oauth-button-vertical:disabled {
@@ -202,6 +208,11 @@
opacity: 0.6;
}
+.oauth-button-vertical:focus-visible {
+ outline: 2px solid var(--auth-border-focus-light-only);
+ outline-offset: 2px;
+}
+
.oauth-icon-small {
width: 1.75rem; /* 28px */
height: 1.75rem; /* 28px */
@@ -217,6 +228,8 @@
.oauth-icon-tiny {
width: 1.25rem; /* 20px */
height: 1.25rem; /* 20px */
+ display: block;
+ flex-shrink: 0;
}
/* Login Header Styles */
diff --git a/frontend/src/proprietary/routes/login/OAuthButtons.tsx b/frontend/src/proprietary/routes/login/OAuthButtons.tsx
index a71667311..f0cd82dc3 100644
--- a/frontend/src/proprietary/routes/login/OAuthButtons.tsx
+++ b/frontend/src/proprietary/routes/login/OAuthButtons.tsx
@@ -65,17 +65,17 @@ export default function OAuthButtons({ onProviderClick, isSubmitting, layout = '
return (
{enabledProviders.map((p) => (
-
+

+
{p.label}
+
))}
);