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

Merge pull request #19085 from overleaf/jel-light-touch-table-updates

Browse source 
[web] Update background color CSS for light touch redesign

GitOrigin-RevId: 574f813a9964a272742507817732c1b45bbdc2fe
This commit is contained in:
Jessica Lawshe 2024-06-26 09:21:18 -05:00 committed by Copybot
parent 07d1f26731
commit 0ed123aebd
1 changed files with 1 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -449,27 +449,8 @@
.plans-table-student {
tr {
// "hide" the last column on desktop by making the background-color as the default background color
th:last-of-type > .plans-table-th {
background-color: @ol-blue-gray-0;
}
&:last-child {
td:first-child {
background-color: @ol-blue-gray-0;
.plans-v2-table-feature-name {
border-bottom-left-radius: @plans-table-border-radius;
@media (max-width: @screen-xs-max) {
border-bottom-left-radius: 0;
}
}
}
td:last-child {
background-color: @ol-blue-gray-0;
.plans-table-cell {
border-bottom-right-radius: @plans-table-border-radius;
@ -515,21 +496,7 @@
.plans-table-individual {
tr {
&:last-child {
td:first-child {
background-color: @ol-blue-gray-0;
.plans-v2-table-feature-name {
border-bottom-left-radius: @plans-table-border-radius;
@media (max-width: @screen-xs-max) {
border-bottom-left-radius: 0;
}
}
}
td:last-child {
background-color: @ol-blue-gray-0;
.plans-table-cell {
border-bottom-right-radius: @plans-table-border-radius;
@ -539,10 +506,6 @@
}
}
}
&:not(.plans-v2-table-divider) td {
background-color: @white;
}
}
th {
@ -611,7 +574,7 @@
}
.plans-table {
background-color: @ol-blue-gray-0;
background-color: white;
margin-bottom: 15px;
table-layout: fixed;
width: 100%;
@ -660,7 +623,6 @@
vertical-align: top;
padding: 0;
position: relative;
background-color: @ol-blue-gray-0;
&:first-child {
border-left: 0;
@ -691,8 +653,6 @@
// css hack for table border-radius on the first feature name
&:nth-child(2) {
.plans-table-row-header:first-child {
background-color: @ol-blue-gray-0;
.plans-v2-table-feature-name {
border-top-left-radius: @plans-table-border-radius;
@ -798,7 +758,6 @@
// will have the full width of viewport,
// and making the first td appear like the it is in its own row (although it's technically still on the same tr as the other tds)
.plans-table-row-header {
background: @gray-lightest;
width: 100vw;
span.plans-v2-table-feature-name {
@ -816,7 +775,6 @@
// that doesn't contain divider or feature name
// (i.e it contains either check mark icon or a dash)
.plans-table-cell {
background-color: @white;
height: 100%;
.plans-table-cell-content {
@ -836,7 +794,6 @@
.plans-table-th {
height: 100%;
background-color: @white;
.plans-table-th-content {
display: flex;
@ -1006,7 +963,6 @@
}
.plans-v2-table-feature-name {
background-color: @white;
display: flex;
justify-content: space-between;
align-items: center;
@ -1284,7 +1240,6 @@
margin-top: var(--spacing-09);
}
.plans-table,
.plans-table-column-header {
background-color: transparent; // remove colors set by default variant
}