Page Menu
Home
Phorge
Search
Configure Global Search
Log In
Files
F32222581
D8170.1765203933.diff
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Flag For Later
Award Token
Size
3 KB
Referenced Files
None
Subscribers
None
D8170.1765203933.diff
View Options
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
Details
Attached
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)
Attached To
Mode
D8170: [landing] reskin the team page
Attached
Detach File
Event Timeline
Log In to Comment