overleaf/services/web/frontend/stylesheets/modules/overleaf-integration.less
Domagoj Kriskovic 9c4cc289d2 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
2023-11-27 09:03:41 +00:00

129 lines
1.9 KiB
Text

.onboarding-confirm-email {
max-width: 400px;
padding: 24px;
margin: 0 auto;
background: #fff;
display: flex;
flex-direction: column;
gap: 24px;
.logo {
width: 130px;
margin: 0 auto;
}
form {
.text-danger {
display: flex;
gap: 6px;
padding: 4px;
.icon {
padding-top: 2px;
}
}
.form-actions {
display: flex;
flex-direction: column;
gap: 12px;
padding-top: 20px;
}
}
}
.onboarding-data-collection-form {
max-width: 720px;
padding: 24px;
margin: 0 auto;
background: #fff;
display: flex;
flex-direction: column;
gap: 24px;
.ui-select-container,
.select-wrapper {
label {
font-size: 14px; // override DownshiftInput and Select component label size
}
.select-items {
max-height: 150px;
}
.select-trigger {
border: 1px solid @neutral-60;
color: @neutral-60;
}
}
.onboarding-question-title {
font-size: 20px;
border-bottom: none;
}
p {
font-size: 16px;
margin-bottom: 16px;
}
.logo {
width: 130px;
margin: 0 auto;
}
form {
display: flex;
flex-direction: column;
gap: 24px;
.group-horizontal {
display: flex;
justify-content: stretch;
gap: 24px;
@media (max-width: @screen-xs-max) {
flex-direction: column;
gap: 0;
}
.form-group {
flex-grow: 1;
}
}
.form-actions {
display: flex;
justify-content: space-between;
> div {
display: flex;
align-items: center;
gap: 8px;
button.btn-info-ghost {
color: @neutral-90;
}
}
}
}
.onboarding-step-2 {
.checkbox {
margin: 0;
p {
margin-bottom: 0;
}
label {
display: flex;
align-items: center;
gap: 8px;
input {
margin-right: 4px;
}
}
}
}
}