mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
ODC and confirm email refactor (#15739)
* use class name instead of id * storybook rename * refactor types * linting * prettier * classname in react component * lint error * add classname in confirm-email success * remove decorators * allow focusing with the tab key to get information about the progress * group form and radio chip elements * single type assertion --------- Co-authored-by: Rebeka <o.dekany@gmail.com> GitOrigin-RevId: 58a64ebdde5c57619a81ae4b68cdb8a6b44dc295
This commit is contained in:
parent
eba745ba96
commit
9c4cc289d2
4 changed files with 9 additions and 2 deletions
|
@ -874,6 +874,7 @@
|
||||||
"processing": "",
|
"processing": "",
|
||||||
"processing_uppercase": "",
|
"processing_uppercase": "",
|
||||||
"professional": "",
|
"professional": "",
|
||||||
|
"progress_bar_percentage": "",
|
||||||
"project_approaching_file_limit": "",
|
"project_approaching_file_limit": "",
|
||||||
"project_figure_modal": "",
|
"project_figure_modal": "",
|
||||||
"project_flagged_too_many_compiles": "",
|
"project_flagged_too_many_compiles": "",
|
||||||
|
|
|
@ -1,12 +1,16 @@
|
||||||
import classNames from 'classnames'
|
import classNames from 'classnames'
|
||||||
|
import { useTranslation } from 'react-i18next'
|
||||||
|
|
||||||
export function Stepper({ steps, active }: { steps: number; active: number }) {
|
export function Stepper({ steps, active }: { steps: number; active: number }) {
|
||||||
|
const { t } = useTranslation()
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="stepper"
|
className="stepper"
|
||||||
role="progressbar"
|
role="progressbar"
|
||||||
|
aria-label={t('progress_bar_percentage')}
|
||||||
aria-valuenow={active + 1}
|
aria-valuenow={active + 1}
|
||||||
aria-valuemax={steps}
|
aria-valuemax={steps}
|
||||||
|
tabIndex={0}
|
||||||
>
|
>
|
||||||
{Array.from({ length: steps }).map((_, i) => (
|
{Array.from({ length: steps }).map((_, i) => (
|
||||||
<div
|
<div
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
#confirm-email {
|
.onboarding-confirm-email {
|
||||||
max-width: 400px;
|
max-width: 400px;
|
||||||
padding: 24px;
|
padding: 24px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
@ -31,7 +31,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#onboarding-data-collection {
|
.onboarding-data-collection-form {
|
||||||
max-width: 720px;
|
max-width: 720px;
|
||||||
padding: 24px;
|
padding: 24px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
|
@ -58,6 +58,7 @@
|
||||||
|
|
||||||
.onboarding-question-title {
|
.onboarding-question-title {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
border-bottom: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p {
|
||||||
|
|
|
@ -1347,6 +1347,7 @@
|
||||||
"processing_uppercase": "Processing",
|
"processing_uppercase": "Processing",
|
||||||
"processing_your_request": "Please wait while we process your request.",
|
"processing_your_request": "Please wait while we process your request.",
|
||||||
"professional": "Professional",
|
"professional": "Professional",
|
||||||
|
"progress_bar_percentage": "Progress bar from 0 to 100%",
|
||||||
"project": "project",
|
"project": "project",
|
||||||
"project_approaching_file_limit": "This project is approaching the file limit",
|
"project_approaching_file_limit": "This project is approaching the file limit",
|
||||||
"project_figure_modal": "Project",
|
"project_figure_modal": "Project",
|
||||||
|
|
Loading…
Reference in a new issue