Page MenuHomePhabricator
Files F3751197

D3390.id10417.diff
No OneTemporary
Actions

D3390.id10417.diff
View Options

diff --git a/landing/button.css b/landing/button.css
--- a/landing/button.css
+++ b/landing/button.css
@@ -5,7 +5,7 @@
background-color: var(--btn-bg);
color: var(--btn-color);
justify-content: center;
- padding: 12px 24px;
+ padding: 8px 16px;
transition: 300ms;
flex-basis: 120px;
text-align: center;
diff --git a/landing/header.css b/landing/header.css
--- a/landing/header.css
+++ b/landing/header.css
@@ -9,7 +9,7 @@
align-items: center;
grid-template-columns: 40px repeat(12, 1fr) 40px;
column-gap: 1.5%;
- grid-template-areas: '. logo logo . . . page_nav page_nav . cta_btn cta_btn cta_btn sIcons .';
+ grid-template-areas: '. logo logo . . . page_nav page_nav . cta_btn cta_btn sIcons sIcons .';
}
.logo {
@@ -48,21 +48,14 @@
justify-content: flex-end;
}
-.social_icons {
+.social_icons_container {
grid-area: sIcons;
display: flex;
- justify-self: flex-end;
-}
-
-.github_icon {
- padding-left: 14px;
- font-size: 20px;
- grid-area: gIcon;
+ justify-content: space-evenly;
}
-.twitter_icon {
+.social_icon {
font-size: 20px;
- grid-area: tIcon;
}
@media screen and (max-width: 1099px) {
@@ -86,8 +79,7 @@
display: none;
}
- .github_icon,
- .twitter_icon {
+ .social_icon {
display: block;
}
}
diff --git a/landing/header.react.js b/landing/header.react.js
--- a/landing/header.react.js
+++ b/landing/header.react.js
@@ -1,10 +1,13 @@
// @flow
import { faTwitter, faGithub } from '@fortawesome/free-brands-svg-icons';
+import { faExternalLinkAlt } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import * as React from 'react';
import { NavLink } from 'react-router-dom';
+import { isDev } from 'lib/utils/dev-utils.js';
+
import Button from './button.react.js';
import css from './header.css';
@@ -27,6 +30,14 @@
function Header(props: HeaderProps): React.Node {
const { onRequestAccess } = props;
+ let launchAppIcon;
+ if (isDev) {
+ launchAppIcon = (
+ <a className={css.social_icon} href="https://web.comm.app">
+ <FontAwesomeIcon icon={faExternalLinkAlt} {...iconProps} />
+ </a>
+ );
+ }
return (
<nav className={css.wrapper}>
<NavLink to="/" className={css.logo}>
@@ -43,11 +54,12 @@
<div className={css.button_container}>
<Button onClick={onRequestAccess}>Request Access</Button>
</div>
- <div className={css.social_icons}>
- <a className={css.twitter_icon} href="https://twitter.com/commdotapp">
+ <div className={css.social_icons_container}>
+ {launchAppIcon}
+ <a className={css.social_icon} href="https://twitter.com/commdotapp">
<FontAwesomeIcon icon={faTwitter} {...iconProps} />
</a>
- <a className={css.github_icon} href="https://github.com/CommE2E/comm">
+ <a className={css.social_icon} href="https://github.com/CommE2E/comm">
<FontAwesomeIcon icon={faGithub} {...iconProps} />
</a>
</div>

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 10, 11:26 PM (19 h, 44 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2853095
Default Alt Text
D3390.id10417.diff (2 KB)

Event Timeline