mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-21 20:47:08 -05:00
Merge pull request #18418 from overleaf/rd-bs5-cookie-banner
[web] Migrate the cookie banner to Bootstrap 5 GitOrigin-RevId: 79dd74e2cf09faab381f24101a3633b0377009a0
This commit is contained in:
parent
3434d8c908
commit
74f0483157
11 changed files with 32 additions and 17 deletions
|
@ -8,8 +8,9 @@ function AddAnotherEmailBtn({ onClick, ...props }: OLButtonProps) {
|
|||
<OLButton
|
||||
variant="link"
|
||||
onClick={onClick}
|
||||
className="btn-inline-link"
|
||||
bs3Props={{ bsStyle: null }}
|
||||
{...props}
|
||||
bs3Props={{ bsStyle: null, className: 'btn-inline-link' }}
|
||||
>
|
||||
{t('add_another_email')}
|
||||
</OLButton>
|
||||
|
|
|
@ -10,7 +10,8 @@ function EmailAffiliatedWithInstitution({ onClick, ...props }: OLButtonProps) {
|
|||
<OLButton
|
||||
variant="link"
|
||||
onClick={onClick}
|
||||
bs3Props={{ bsStyle: null, className: 'btn-inline-link' }}
|
||||
className="btn-inline-link"
|
||||
bs3Props={{ bsStyle: null }}
|
||||
{...props}
|
||||
>
|
||||
{t('let_us_know')}
|
||||
|
|
|
@ -17,7 +17,8 @@ function UniversityName({ name, onClick }: UniversityNameProps) {
|
|||
<OLButton
|
||||
variant="link"
|
||||
onClick={onClick}
|
||||
bs3Props={{ bsStyle: null, className: 'btn-inline-link' }}
|
||||
className="btn-inline-link"
|
||||
bs3Props={{ bsStyle: null }}
|
||||
>
|
||||
{t('change')}
|
||||
</OLButton>
|
||||
|
|
|
@ -111,7 +111,7 @@ function InstitutionAndRole({ userEmailData }: InstitutionAndRoleProps) {
|
|||
<OLButton
|
||||
onClick={handleChangeAffiliation}
|
||||
variant="link"
|
||||
bs3Props={{ className: 'btn-inline-link' }}
|
||||
className="btn-inline-link"
|
||||
>
|
||||
{!affiliation.department && !affiliation.role
|
||||
? t('add_role_and_department')
|
||||
|
@ -160,7 +160,7 @@ function InstitutionAndRole({ userEmailData }: InstitutionAndRoleProps) {
|
|||
<OLButton
|
||||
variant="link"
|
||||
onClick={handleCancelAffiliationChange}
|
||||
bs3Props={{ className: 'btn-inline-link' }}
|
||||
className="btn-inline-link"
|
||||
>
|
||||
{t('save_or_cancel-cancel')}
|
||||
</OLButton>
|
||||
|
|
|
@ -149,8 +149,8 @@ function ReconfirmationInfo({ userEmailData }: ReconfirmationInfoProps) {
|
|||
variant="link"
|
||||
disabled={state.isLoading}
|
||||
onClick={handleRequestReconfirmation}
|
||||
className="btn-inline-link"
|
||||
bs3Props={{
|
||||
className: 'btn-inline-link',
|
||||
bsStyle: null,
|
||||
}}
|
||||
>
|
||||
|
@ -208,7 +208,8 @@ function ReconfirmationInfo({ userEmailData }: ReconfirmationInfoProps) {
|
|||
variant="link"
|
||||
disabled={state.isLoading}
|
||||
onClick={handleRequestReconfirmation}
|
||||
bs3Props={{ className: 'btn-inline-link', bsStyle: null }}
|
||||
className="btn-inline-link"
|
||||
bs3Props={{ bsStyle: null }}
|
||||
>
|
||||
{t('resend_confirmation_email')}
|
||||
</OLButton>
|
||||
|
|
|
@ -51,7 +51,8 @@ function ResendConfirmationEmailButton({
|
|||
variant="link"
|
||||
disabled={state.isLoading || isLoading}
|
||||
onClick={handleResendConfirmationEmail}
|
||||
bs3Props={{ bsStyle: null, className: 'btn-inline-link' }}
|
||||
className="btn-inline-link"
|
||||
bs3Props={{ bsStyle: null }}
|
||||
>
|
||||
{t('resend_confirmation_email')}
|
||||
</OLButton>
|
||||
|
|
|
@ -3,7 +3,6 @@ import { useTranslation } from 'react-i18next'
|
|||
import LeaveModal from './leave/modal'
|
||||
import getMeta from '../../../utils/meta'
|
||||
import OLButton from '@/features/ui/components/ol/ol-button'
|
||||
import { bsVersion } from '@/features/utils/bootstrap-5'
|
||||
|
||||
function LeaveSection() {
|
||||
const { t } = useTranslation()
|
||||
|
@ -31,10 +30,7 @@ function LeaveSection() {
|
|||
<>
|
||||
{t('need_to_leave')}{' '}
|
||||
<OLButton
|
||||
className={bsVersion({
|
||||
bs3: 'btn btn-inline-link btn-danger',
|
||||
bs5: 'btn-link',
|
||||
})}
|
||||
className="btn-inline-link"
|
||||
variant="danger"
|
||||
onClick={handleOpen}
|
||||
>
|
||||
|
|
|
@ -27,7 +27,7 @@ $focus-ring-blur: 0;
|
|||
|
||||
// Buttons
|
||||
$btn-font-family: $font-family-sans-serif;
|
||||
$btn-font-weight: 700;
|
||||
$btn-font-weight: 600;
|
||||
$btn-padding-x: $spacing-06;
|
||||
$btn-padding-y: $spacing-02;
|
||||
$btn-border-radius: $border-radius-full;
|
||||
|
|
|
@ -30,3 +30,11 @@ hr {
|
|||
.horizontal-divider {
|
||||
border-top: 1px solid var(--border-divider);
|
||||
}
|
||||
|
||||
.hidden {
|
||||
@extend .d-none;
|
||||
}
|
||||
|
||||
.hidden-print {
|
||||
@extend .d-print-none;
|
||||
}
|
||||
|
|
|
@ -98,7 +98,6 @@
|
|||
cursor: pointer;
|
||||
border-radius: 0;
|
||||
text-decoration: underline;
|
||||
padding: 0;
|
||||
font-size: inherit;
|
||||
vertical-align: inherit;
|
||||
|
||||
|
@ -130,6 +129,13 @@
|
|||
}
|
||||
}
|
||||
|
||||
.btn-inline-link {
|
||||
@extend .btn-link;
|
||||
font-size: inherit;
|
||||
padding: 0;
|
||||
vertical-align: inherit;
|
||||
}
|
||||
|
||||
.button-loading {
|
||||
align-items: center;
|
||||
display: inline-grid;
|
||||
|
|
|
@ -297,7 +297,7 @@ footer.site-footer {
|
|||
.cookie-banner {
|
||||
@include body-sm;
|
||||
|
||||
padding: var(--spacing-04) var(--spacing-07);
|
||||
padding: var(--spacing-05) var(--spacing-07);
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
|
@ -324,7 +324,7 @@ footer.site-footer {
|
|||
.cookie-banner-actions {
|
||||
flex-shrink: 0;
|
||||
white-space: nowrap;
|
||||
padding-top: var(--spacing-07);
|
||||
padding-top: var(--spacing-00);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue