github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2025-04-14 02:46:40 +00:00
Code Issues Projects Releases Packages Wiki Activity

Plans page redesign - [light-design] Use the new "request overleaf common" UI on the student tab (#20199)

Browse source 
* making the university info section in students tab to follow the new design.

* adding the left alignment of the button

* adding light keyword for the classes that are being used in the light design version for this university info card

* removing text-capitalize class

* deleting the comment

GitOrigin-RevId: 641613cf6ab73edef57b917b58ebf10b698572d3
This commit is contained in:
Davinder Singh 2024-09-04 13:02:24 +01:00 • committed by Copybot
parent f8f111d023
commit 56b69a743b
3 changed files with 40 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
services/web/app/views/subscriptions/plans-light-design.pug
View file

@ -40,8 +40,6 @@ block content
+currency_and_payment_methods()
include ./plans/_university_info
//- TODO: changing .plans-page-quote-row-hidden causes flickering on page load
.plans-page-quote-row(data-ol-show-for-plan-type="individual")
+collinsQuote1()
@ -51,6 +49,8 @@ block content
.plans-page-quote-row.plans-page-quote-row-hidden(data-ol-show-for-plan-type="student")
+collinsQuote2()
include ./plans/_university_info_light_design
include ./plans/_faq_new

17
services/web/app/views/subscriptions/plans/_university_info_light_design.pug Normal file
View file

@ -0,0 +1,17 @@
.row.row-spaced-large(
data-ol-plans-university-info-container
hidden
)
.col-xs-12
.card.plans-v2-university-info-light
div
h3.plans-v2-university-info-header-light #{translate('would_you_like_to_see_a_university_subscription')}
p.plans-v2-university-info-text-light #{translate('student_and_faculty_support_make_difference')}
a.btn.btn-secondary.plans-v2-btn-header-light(
target="_blank"
href="/for/support-an-overleaf-university-subscription"
event-tracking="plans-page-click"
event-tracking-mb="true"
event-tracking-trigger="click"
event-segmentation='{"button": "university-support"}'
) #{translate('show_your_support')}

39
services/web/frontend/stylesheets/app/plans/plans-light-touch-redesign.less
View file

@ -213,17 +213,9 @@
}
}
a.btn.plans-v2-btn-header,
button.plans-v2-btn-header {
a.btn.plans-v2-btn-header-light,
button.plans-v2-btn-header-light {
font-family: @font-family-sans-serif;
margin-top: @margin-sm;
text-shadow: 0 0 0;
background-color: @ol-blue;
color: @white;
&:hover {
color: @white;
}
}
.monthly-annual-switch {
@ -1213,17 +1205,28 @@
}
}
.plans-v2-university-info {
.plans-v2-university-info-light {
padding: @padding-lg @padding-xxl;
background-color: var(--neutral-20);
background-color: var(--white);
border-radius: 20px;
max-width: @screen-sm-max; // 991px
margin: auto;
display: flex;
align-items: center;
gap: var(--spacing-07); // 20px
h3.plans-v2-university-info-header {
margin: 0 @margin-xl @margin-md @margin-xl;
@media (max-width: @screen-sm-max) {
flex-direction: column;
align-items: start;
}
p.plans-v2-university-info-text {
margin: 0 @margin-xl;
h3.plans-v2-university-info-header-light {
margin: 0;
}
p.plans-v2-university-info-text-light {
margin: 0;
margin-top: @margin-sm;
}
a.plans-v2-btn-university-info {
@ -1231,11 +1234,11 @@
}
@media (max-width: @screen-sm-max) {
h3.plans-v2-university-info-header {
h3.plans-v2-university-info-header-light {
margin: 0 0 @margin-md 0;
}
p.plans-v2-university-info-text {
p.plans-v2-university-info-text-light {
margin: 0;
}
}