github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #11129 from overleaf/jel-survey-link-mobile

Browse source 
[web] Fix line height for survey text on mobile

GitOrigin-RevId: f96e682b8534d7404c89b45ad4264538bf8a0a2e
This commit is contained in:
Jessica Lawshe 2023-01-26 10:48:20 -06:00 committed by Copybot
parent 0f7f564510
commit 14039c6729
5 changed files with 49 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
services/web/frontend/js/features/project-list/components/survey-widget.tsx
View file

@ -19,26 +19,33 @@ export default function SurveyWidget() {
} }
return ( return (
<> <div className="user-notifications">
<button <div className="notification-entry">
className="project-list-sidebar-survey-dismiss" <div role="alert" className="alert alert-info-alt">
type="button" <div className="notification-body">
title="Dismiss Overleaf survey" {survey.preText}&nbsp;
onClick={dismissSurvey} <a
> className="project-list-sidebar-survey-link"
<span aria-hidden>&times;</span> href={survey.url}
</button> target="_blank"
<div className="project-list-sidebar-survey"> rel="noreferrer noopener"
{survey.preText}&nbsp; >
<a {survey.linkText}
className="project-list-sidebar-survey-link" </a>
href={survey.url} </div>
target="_blank" <div className="notification-close">
rel="noreferrer noopener" <button
> type="button"
{survey.linkText} className="close pull-right"
</a> title="Dismiss Overleaf survey"
onClick={dismissSurvey}
>
<span aria-hidden="true">&times;</span>
<span className="sr-only">Dismiss Overleaf survey</span>
</button>
</div>
</div>
</div> </div>
</> </div>
) )
} }

23
services/web/frontend/stylesheets/app/project-list-react.less
View file

@ -730,20 +730,22 @@
left: 0; left: 0;
width: 15%; width: 15%;
.project-list-sidebar-survey-dismiss { .alert-info-alt {
position: relative; font-size: @font-size-small;
z-index: 1; margin-bottom: 0;
float: right;
a {
text-decoration: none;
}
} }
@media (max-width: @screen-xs-max) { @media (max-width: @screen-xs-max) {
line-height: @mobile-action-element-height;
position: static; position: static;
display: block; display: block;
margin-top: @margin-sm; margin-top: @margin-sm;
width: initial; width: initial;
.project-list-sidebar-survey { .alert-info-alt {
font-size: unset; font-size: unset;
&:before { &:before {
@ -751,17 +753,12 @@
} }
.project-list-sidebar-survey-link { .project-list-sidebar-survey-link {
display: inline-flex; display: block;
align-items: center; align-items: center;
min-width: @mobile-action-element-width; min-width: @mobile-action-element-width;
min-height: @mobile-action-element-height; min-height: @mobile-action-element-height;
padding-top: @padding-md;
} }
} }
.project-list-sidebar-survey-dismiss {
width: @mobile-action-element-width;
height: @mobile-action-element-height;
border: 0;
}
} }
} }

4
services/web/frontend/stylesheets/components/alerts.less
View file

@ -67,6 +67,10 @@
.alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text); .alert-variant(@alert-info-bg; @alert-info-border; @alert-info-text);
} }
.alert-info-alt {
.alert-variant(@alert-info-alt-bg; @alert-info-alt-border; @alert-info-alt-text);
}
.btn-alert-info { .btn-alert-info {
.button-variant(@btn-info-color; @btn-info-bg; @btn-info-border); .button-variant(@btn-info-color; @btn-info-bg; @btn-info-border);
.alert-btn(@btn-info-bg); .alert-btn(@btn-info-bg);

4
services/web/frontend/stylesheets/core/variables.less
View file

@ -646,6 +646,10 @@
@alert-info-text: #fff; @alert-info-text: #fff;
@alert-info-border: transparent; @alert-info-border: transparent;
@alert-info-alt-bg: @v2-dash-pane-bg;
@alert-info-alt-text: @v2-dash-pane-subdued-color;
@alert-info-alt-border: transparent;
@alert-warning-bg: @brand-warning; @alert-warning-bg: @brand-warning;
@alert-warning-text: #fff; @alert-warning-text: #fff;
@alert-warning-border: transparent; @alert-warning-border: transparent;

4
services/web/frontend/stylesheets/variables/all.less
View file

@ -571,6 +571,10 @@
@alert-info-text: #fff; @alert-info-text: #fff;
@alert-info-border: transparent; @alert-info-border: transparent;
@alert-info-alt-bg: @v2-dash-pane-bg;
@alert-info-alt-text: @v2-dash-pane-subdued-color;
@alert-info-alt-border: transparent;
@alert-warning-bg: @brand-warning; @alert-warning-bg: @brand-warning;
@alert-warning-text: #fff; @alert-warning-text: #fff;
@alert-warning-border: transparent; @alert-warning-border: transparent;