Merge pull request #19415 from overleaf/jel-highlighted-col

[web] Update highlighted column for plans page light touch redesign

GitOrigin-RevId: 98a0d6c34762bb7f4530da9cd6d954c2ae1aae56
This commit is contained in:
Jessica Lawshe
2024-07-25 08:44:53 -05:00
committed by Copybot
parent 918c3e7e33
commit 72821743fc
3 changed files with 19 additions and 21 deletions
@@ -69,7 +69,9 @@ mixin plans_table(period, config)
)
.plans-table-th
if (highlighted)
p.plans-table-green-highlighted-text #{translate(config.highlightedColumn.text[period]).toUpperCase()}
//-most_popular_uppercase
-var translationKey = config.highlightedColumn.text[period] === 'most_popular' ? 'most_popular_uppercase' : config.highlightedColumn.text[period] === 'saving_20_percent' ? 'saving_20_percent_no_exclamation' : config.highlightedColumn.text[period]
p.plans-table-green-highlighted-text #{translate(translationKey)}
.plans-table-th-content
if tableHeadKey
case tableHeadKey
@@ -2,7 +2,7 @@
@plans-top-switch-item-height: 34px;
@plans-top-switch-item-border-radius: @plans-top-switch-item-height / 2;
@plans-m-a-switch-height: 34px;
@plans-highlighted-text-height-desktop: 30px;
@plans-highlighted-text-height-desktop: 32px;
@plans-highlighted-text-height-mobile: 41px;
@plans-learn-more-link-color: hsl(206, 100%, 52%);
@plans-top-switch-group-width-mobile: 46%;
@@ -229,7 +229,7 @@
}
input + span {
background-color: @ol-green;
background-color: var(--green-50);
}
input:checked + span {
@@ -279,11 +279,11 @@
&.tooltip.in.left {
.tooltip-inner {
background-color: @ol-green;
background-color: var(--green-50);
}
.tooltip-arrow {
border-left-color: @ol-green;
border-left-color: var(--green-50);
}
}
@@ -297,12 +297,12 @@
&.tooltip.in.bottom {
.tooltip-inner {
background-color: @ol-green;
background-color: var(--green-50);
}
.tooltip-arrow {
border-left-color: unset;
border-bottom-color: @ol-green;
border-bottom-color: var(--green-50);
}
}
@@ -659,7 +659,7 @@
&.plans-table-green-highlighted {
.plans-table-th {
border-top: @table-border-size solid @ol-green;
border-top: @table-border-size solid var(--green-50);
}
}
}
@@ -1010,17 +1010,17 @@
}
p.plans-table-green-highlighted-text {
border: 2px solid @ol-green;
border: 2px solid var(--green-50);
position: absolute;
top: -1 * @plans-highlighted-text-height-desktop;
left: 0;
display: flex;
justify-content: center;
align-items: center;
font-size: @font-size-small;
line-height: 19px;
font-weight: 700;
background-color: @ol-green;
font-size: var(--font-size-03);
line-height: var(--line-height-02);
font-weight: 600;
background-color: var(--green-50);
border-radius: var(--border-radius-large-new) var(--border-radius-large-new)
0 0;
color: @white;
@@ -1031,13 +1031,8 @@
@media (max-width: @screen-sm-max) {
top: -1 * @plans-highlighted-text-height-mobile;
height: @plans-highlighted-text-height-mobile;
}
@media (max-width: @screen-xs-max) {
padding-left: 5px;
padding-right: 5px;
font-size: @font-size-extra-small;
line-height: 15px;
font-size: var(--font-size-01);
line-height: var(--line-height-01);
}
}
@@ -1104,7 +1099,7 @@
}
.plans-table-sticky-header-item-green-highlighted span {
color: @ol-green;
color: var(--green-50);
}
.plans-v2-faq {
+1
View File
@@ -1693,6 +1693,7 @@
"save_x_percent_or_more": "Save __percent__% or more",
"saving": "Saving",
"saving_20_percent": "Saving 20%!",
"saving_20_percent_no_exclamation": "Saving 20%",
"saving_notification_with_seconds": "Saving __docname__... (__seconds__ seconds of unsaved changes)",
"search": "Search",
"search_bib_files": "Search by author, title, year",