Continue work on marketing pages

This commit is contained in:
Matthew Holt 2023-10-02 17:11:59 -06:00 committed by Francis Lavoie
parent c17c984546
commit 01a9c8a525
No known key found for this signature in database
GPG key ID: C5204D4F28147FC8
8 changed files with 887 additions and 624 deletions

View file

@ -103,15 +103,12 @@ body {
tab-size: 4;
background-color: var(--body-bg);
color: var(--text-color);
background-image:
radial-gradient(at calc(50% - min(25vw, 800px)) -10%, hsl(137.64deg, 100%, 92.42%) 0px, transparent min(15%, 500px)),
radial-gradient(at calc(50% + min(25vw, 800px)) -10%, hsl(201.2deg, 68%, 90.2%) 0px, transparent min(15%, 500px));
}
.dark body {
background-image:
radial-gradient(at calc(50% - min(35vw, 700px)) -10%, hsl(129.5deg, 100%, 12.4%) 0px, transparent min(25%, 600px)),
radial-gradient(at calc(50% + min(35vw, 700px)) -10%, hsl(201deg, 100%, 19.33%) 0px, transparent min(25%, 600px))
section.dark,
footer {
background-color: #002020;
color: white;
}
main a {
@ -272,6 +269,16 @@ button,
align-items: center;
}
.button {
color: rgb(54 206 255);
border: 1px solid rgb(54 206 255);
}
.button:hover {
color: white;
border-color: white;
}
button.primary,
.button.primary {
background: linear-gradient(135deg, white 25%, rgba(167, 183, 193) 80%);

View file

@ -43,8 +43,10 @@ body {
background-image:
radial-gradient(at calc(50% - min(25vw, 800px)) -10%, hsl(137.64deg, 100%, 92.42%) 0px, transparent min(15%, 500px)),
radial-gradient(at calc(50% + min(25vw, 800px)) -10%, hsl(201.2deg, 68%, 90.2%) 0px, transparent min(15%, 500px));
background-repeat: no-repeat;
}
.dark body {
background-image:
radial-gradient(at calc(50% - min(35vw, 700px)) -10%, hsl(129.5deg, 100%, 12.4%) 0px, transparent min(25%, 600px)),

View file

@ -3,7 +3,7 @@
padding-bottom: 50px;
}
.datagrid {
/* .datagrid {
display: flex;
flex-wrap: wrap;
gap: 2em;
@ -17,11 +17,30 @@
letter-spacing: 1px;
margin-bottom: .5em;
min-width: 200px;
} */
.legend {
margin-bottom: -100px;
margin-left: auto;
margin-right: auto;
font-size: 24px;
color: var(--text-color-muted);
text-align: center;
max-width: 750px;
line-height: 1.5;
}
.legend .nonstandard {
font-weight: bold;
}
.feature-list {
font-size: 90%;
margin: 50px 0 100px;
margin: 50px 0 125px;
}
.feature-list:last-child {
margin-bottom: 0;
}
.feature-row {
@ -32,6 +51,10 @@
border-bottom: 2px dashed #a4c8ff25; /* #e6eaf0 */
}
.feature-row:last-child {
padding-bottom: 0;
}
.feature-row .benefits {
color: var(--text-color-muted);
font-weight: 500;
@ -53,6 +76,14 @@
border-bottom: none;
}
.nonstandard {
color: #e76100; /* #005c94 */
}
.dark .nonstandard {
color: #fb8a26;
}
/* TODO: Figure this out */
@media (max-width: 800px) {

View file

@ -78,15 +78,6 @@ h2 {
.button {
color: rgb(54 206 255);
border: 1px solid rgb(54 206 255);
}
.button:hover {
color: white;
border-color: white;
}
.button.cool {
position: relative;
@ -196,12 +187,6 @@ section {
}
section.dark,
footer {
background-color: #002020;
color: white;
}
section.gray {
background-color: #f5f8f9;
}
@ -310,7 +295,7 @@ h3.green {
color: #23a460; border-color: #23a460;
}
h3.purple {
color: rgb(151, 39, 151); border-color: rgb(151, 39, 151);
color: rgb(179, 59, 179); border-color: rgb(179, 59, 179);
}
h3.blue {
color: rgb(14, 110, 189); border-color: rgb(14, 110, 189);