Page MenuHomePhorge

D8170.1765203933.diff
No OneTemporary

Size
3 KB
Referenced Files
None
Subscribers
None

D8170.1765203933.diff

diff --git a/landing/team-profile.css b/landing/team-profile.css
--- a/landing/team-profile.css
+++ b/landing/team-profile.css
@@ -13,22 +13,20 @@
}
.profile p {
- font-size: 18px;
text-align: center;
}
.profile small {
- color: var(--grey);
- font-size: 16px;
+ color: var(--black-60);
text-align: center;
}
.profile span svg {
- color: var(--grey);
+ color: var(--black-60);
}
.profile span svg:hover {
- color: var(--white);
+ color: var(--white-100);
}
.profile span {
@@ -40,6 +38,6 @@
}
.profile span > a {
- color: var(--white);
+ color: var(--white-100);
font-size: 20px;
}
diff --git a/landing/team-profile.react.js b/landing/team-profile.react.js
--- a/landing/team-profile.react.js
+++ b/landing/team-profile.react.js
@@ -5,6 +5,7 @@
import * as React from 'react';
import css from './team-profile.css';
+import typography from './typography.css';
type Props = {
+name: string,
@@ -50,8 +51,8 @@
return (
<article className={css.profile}>
<img alt={`portrait of comm team member ${name}`} src={imageURL} />
- <p>{name}</p>
- <small>{role}</small>
+ <p className={typography.paragraph1}>{name}</p>
+ <small className={typography.paragraph2}>{role}</small>
<span>
{githubLink}
{twitterLink}
diff --git a/landing/team.css b/landing/team.css
--- a/landing/team.css
+++ b/landing/team.css
@@ -2,30 +2,13 @@
padding: 16px 0;
margin: 0 auto 48px auto;
max-width: 1200px;
+ padding-top: 72px;
}
.header {
- font-family: 'iA Writer Duo S', monospace;
- font-weight: 500;
- line-height: 1.35;
text-align: center;
- --scale: calc(0.75rem + 2vw);
- --smallest-font-size: 30px;
- --largest-font-size: 50px;
- --smallest-padding-size: 32px;
- --largest-padding-size: 64px;
-
- padding-bottom: clamp(
- var(--smallest-padding-size),
- var(--scale),
- var(--largest-padding-size)
- );
-
- font-size: clamp(
- var(--smallest-font-size),
- var(--scale),
- var(--largest-font-size)
- );
+ color: var(--white-80);
+ margin-bottom: 48px;
}
.teamWrapper {
@@ -48,6 +31,6 @@
p.team {
max-width: 60ch;
margin: 0 auto;
- padding: 0 16px 36px 16px;
- font-size: 1.6rem;
+ padding: 0 32px 40px 32px;
+ color: var(--white-80);
}
diff --git a/landing/team.react.js b/landing/team.react.js
--- a/landing/team.react.js
+++ b/landing/team.react.js
@@ -1,11 +1,13 @@
// @flow
+import classNames from 'classnames';
import * as React from 'react';
import { assetsCacheURLPrefix } from './asset-meta-data.js';
import Button from './button.react.js';
import TeamProfile from './team-profile.react.js';
import css from './team.css';
+import typography from './typography.css';
function Team(): React.Node {
const onRolesClick = React.useCallback(() => {
@@ -15,13 +17,16 @@
);
}, []);
+ const headerClassName = classNames([typography.heading1, css.header]);
+ const subheaderClassName = classNames([typography.subheading2, css.team]);
+
return (
<div className={css.wrapper}>
- <h2 className={css.header}>Team</h2>
+ <h2 className={headerClassName}>Team</h2>
<section>
<div className={css.headingContent}>
- <p className={css.team}>
+ <p className={subheaderClassName}>
Comm is the keyserver company. Come join us and help build the
future of the decentralized web!
</p>
@@ -87,7 +92,7 @@
</div>
</section>
- <h2 className={css.header}>Team at Software Mansion</h2>
+ <h2 className={headerClassName}>Team at Software Mansion</h2>
<section className={css.teamWrapper}>
<TeamProfile
name="Tomasz Pałys"

File Metadata

Mime Type
text/plain
Expires
Mon, Dec 8, 2:25 PM (7 h, 32 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5848685
Default Alt Text
D8170.1765203933.diff (3 KB)

Event Timeline