complete the homepage updates, closes #108

cltk · Feb 27, 2018 · e3787fb · e3787fb
1 parent af04ced
commit e3787fb
Show file tree

Hide file tree

Showing 37 changed files with 377 additions and 370 deletions.
diff --git a/public/index.html b/public/index.html
@@ -32,7 +32,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>cltk Archive [alpha]</title>
+    <title>CLTK Archive [alpha]</title>
 
 		<!-- Global site tag (gtag.js) - Google Analytics -->
 		<script async src="https://www.googletagmanager.com/gtag/js?id=UA-36250260-17"></script>

diff --git a/src/components/common/cover/Cover/Cover.scss b/src/components/common/cover/Cover/Cover.scss
@@ -2,11 +2,10 @@
 
 .cover {
 	position: relative;
-	width: 100%;
-	height: 100%;
+	width: 100vw;
+	height: 100vh;
 	text-align: center;
 	overflow: hidden;
-	// Come back to weird overflow issue in the future
 }
 
 .cover-inner {

diff --git a/src/components/common/cover/CoverBackground/CoverBackground.js b/src/components/common/cover/CoverBackground/CoverBackground.js
@@ -6,7 +6,7 @@ class CoverBackground extends React.Component {
 		super(props);
 
 		this.state = {
-			transform: 'translate(-1%, -2%)',
+			transform: 'translate(0%, 0%)',
 		};
 	}
 

diff --git a/...nts/common/cover/CoverTitle/CoverTitle.js → .../CoverBackground/CoverTitle/CoverTitle.js b/...nts/common/cover/CoverTitle/CoverTitle.js → .../CoverBackground/CoverTitle/CoverTitle.js
diff --git a/...s/common/cover/CoverTitle/CoverTitle.scss → ...overBackground/CoverTitle/CoverTitle.scss b/...s/common/cover/CoverTitle/CoverTitle.scss → ...overBackground/CoverTitle/CoverTitle.scss
diff --git a/...ents/common/cover/CoverTitle/package.json → ...r/CoverBackground/CoverTitle/package.json b/...ents/common/cover/CoverTitle/package.json → ...r/CoverBackground/CoverTitle/package.json
diff --git a/src/components/navigation/Footer/Footer.js b/src/components/navigation/Footer/Footer.js
@@ -18,9 +18,23 @@ export default class Footer extends React.Component {
 					<Row>
 						<Col lg={4}>
 							<span className="footerCopyright">
-                © cltk {year}
+                © Classical Language Toolkit {year}
 							</span>
 							<span className="footerBuiltBy">
+								<a
+									href="https://github.com/cltk/cltk/blob/master/LICENSE"
+									target="_blank"
+									rel="noopener noreferrer"
+                >
+                  License
+								</a>.
+								<a
+									href="https://github.com/cltk/"
+									target="_blank"
+									rel="noopener noreferrer"
+                >
+                  Texts and Contributors
+								</a>.
                 See more at
 								<a
 									href="http://cltk.org"
@@ -34,9 +48,16 @@ export default class Footer extends React.Component {
 						</Col>
 						<Col lg={8}>
 							<div className="footerLinks">
-								<Link href="mailto:contact@cltk.org">
+								<Link href="mailto:classical-language-toolkit@googlegroups.com">
 									Contact
 								</Link>
+								<a
+									href="https://gitter.im/cltk/cltk"
+									target="_blank"
+									rel="noopener noreferrer"
+                >
+                  Gitter Chat
+								</a>
 							</div>
 						</Col>
 					</Row>

diff --git a/src/components/navigation/Footer/Footer.scss b/src/components/navigation/Footer/Footer.scss
@@ -2,7 +2,7 @@
 
 #footer {
 	padding: 90px 0;
-	background: #f6f6f6;
+	background: #343a40;
 	min-height: 100px;
 
 	.footerNav {
@@ -22,6 +22,7 @@
 	a {
 		padding: 0 0 0 2px;
 		@include transition(100ms all ease-in-out);
+		color: $light;
 
 		&:hover {
 			color: $primary;
@@ -30,13 +31,13 @@
 }
 
 .footerCopyright {
-	color: $dark;
+	color: $light;
 	margin: 10px 0;
 	font-size: 18px;
 }
 
 .footerBuiltBy {
-	color: $text-secondary;
+	color: $light;
 }
 
 .footerLinks {
@@ -49,13 +50,13 @@
 		margin: 0 5px;
 		border-bottom: 2px solid $divider-light-grey;
 		@include transition(100ms all ease-in-out);
-		color: $dark;
+		color: $light;
 		font-size: 16px;
 		font-family: $font-label;
 
 		&:hover {
 			border-bottom: 2px solid rgba(0,0,0, 0);
-			color: $primary-dark;
+			color: $primary;
 		}
 
 	}

diff --git a/src/components/navigation/Header/NavBar/NavBar.scss b/src/components/navigation/Header/NavBar/NavBar.scss
@@ -29,16 +29,33 @@
   right: 0;
   z-index: 1;
 	position: fixed;
-	background: rgba(255, 255, 255, 0.6);
+	background: $light;
 	height: 60px;
 	width: 100vw;
 }
+
 .headroom--unfixed {
   transform: translateY(0);
+	background: rgba(0, 0, 0, 0.2);
+	@include transition(all 100ms ease-in-out);
+
+	.nav-header {
+		i {
+			color: $light;
+		}
+		a h2 {
+			color: $light;
+		}
+	}
+
+	.nav li a {
+		color: $light;
+	}
 }
 .headroom--scrolled {
   transition: transform 200ms ease-in-out;
 	background: #fff;
+	height: 60px;
 	box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.4);
 }
 .headroom--unpinned {
@@ -55,13 +72,14 @@
 		font-family: $font-label;
 
 		a {
-			padding: 16px 20px;
+			padding: 18px 20px;
 			font-weight: bold;
 			text-transform: uppercase;
 			cursor: pointer;
 			border: 2px solid transparent;
 			display: block;
 			height: 60px;
+			font-size: 14px;
 
 			@include transition(all 100ms linear);
 

diff --git a/src/components/navigation/Header/NavBar/NavBarHeader.js b/src/components/navigation/Header/NavBar/NavBarHeader.js
@@ -14,7 +14,7 @@ const NavBarHeader = ({ dispatchToggleLeftMenu, leftMenuOpen }) => (
 		/>
 		<Link to="/">
 			<h2 className="site-title">
-				.cltk/archive
+				CLTK Archive
 			</h2>
 		</Link>
 	</div>

diff --git a/src/components/navigation/Header/NavBar/NavBarHeader.scss b/src/components/navigation/Header/NavBar/NavBarHeader.scss
@@ -23,11 +23,11 @@
 	vertical-align: top;
 	font-family: $font-logo;
 	font-weight: bold;
-	padding: 12px 15px;
+	padding: 14px 15px;
 	color: $dark;
 	line-height: 1.2em;
 	margin: 5px 10px;
 	text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.6);
-	font-size: 22px;
+	font-size: 20px;
 	letter-spacing: 2px;
 }
diff --git a/src/components/navigation/LeftMenu/LeftMenu.js b/src/components/navigation/LeftMenu/LeftMenu.js
@@ -13,63 +13,20 @@ import LeftMenuHead from '../LeftMenuHead';
 import { logout, toggleAuthModal } from '../../../modules/auth/actions';
 import { logoutUser } from '../../../lib/auth';
 
-// lib
-import getCurrentProjectHostname from '../../../lib/getCurrentProjectHostname';
-
 import './LeftMenu.css';
 
 
 class LeftMenu extends React.Component {
-
-	renderMenuItems() {
-		const { closeLeftMenu } = this.props;
-
-		return (
-			<div>
-				<MenuItem
-					to="/collections"
-					onClick={closeLeftMenu}
-				>
-					Collections
-				</MenuItem>
-				<MenuItem
-					to="/items"
-					onClick={closeLeftMenu}
-				>
-					Items
-				</MenuItem>
-				<MenuItem
-					to="/articles"
-					onClick={closeLeftMenu}
-				>
-					Articles
-				</MenuItem>
-				<MenuItem
-					to="/texts"
-					onClick={closeLeftMenu}
-				>
-					Texts
-				</MenuItem>
-			</div>
-		);
-	}
-
 	render() {
 		const {
 			project, leftMenuOpen, closeLeftMenu, userId, dispatchLogout,
 			dispatchToggleAuthModal
 		} = this.props;
 
-		let isMaincltkProject = false;
-		const hostname = getCurrentProjectHostname();
-
-		if (!hostname || ~['cltk.org', 'cltk.local'].indexOf(hostname)) {
-			isMaincltkProject = true;
-		}
-
 		if (!project) {
 			return null;
 		}
+
 		return (
 			<Drawer
 				open={leftMenuOpen}
@@ -85,11 +42,13 @@ class LeftMenu extends React.Component {
 					>
 						Home
 					</MenuItem>
-					{!isMaincltkProject ?
-						this.renderMenuItems()
-					: ''}
+					<MenuItem
+						to="/browse"
+						onClick={closeLeftMenu}
+					>
+						Browse
+					</MenuItem>
 					<Divider />
-
 					{userId ?
 						<div>
 							<MenuItem

diff --git a/src/lib/getCurrentProjectHostname.js b/src/lib/getCurrentProjectHostname.js
diff --git a/src/lib/makeId.js b/src/lib/makeId.js
diff --git a/src/modules/dashboard/graphql/queries/counts.js b/src/modules/dashboard/graphql/queries/counts.js
diff --git a/src/modules/home/components/Home/Home.js b/src/modules/home/components/Home/Home.js
@@ -1,19 +1,19 @@
 import React from 'react';
 
 import HomeBuild from './sections/HomeBuild';
-import HomeFeatures from './sections/HomeFeatures';
+import HomeFeaturesContainer from '../../containers/HomeFeaturesContainer';
 import HomeIntro from './sections/HomeIntro';
-import SearchModal from '../../../search/components/SearchModal';
+
+import './Home.css';
+
 
 const Home = () => (
 	<div className="cltk-layout home-layout">
 		<div className="home-content">
 			<HomeIntro />
-			<HomeFeatures />
+			<HomeFeaturesContainer />
 			<HomeBuild />
 		</div>
-
-		<SearchModal />
 	</div>
 );
 

diff --git a/src/modules/home/components/Home/sections/HomeBuild/HomeBuild.js b/src/modules/home/components/Home/sections/HomeBuild/HomeBuild.js
@@ -1,5 +1,7 @@
 import React from 'react';
 
+import './HomeBuild.css';
+
 export default function HomeBuild(props) {
 	return (
 		<section id="build" >
@@ -22,7 +24,7 @@ export default function HomeBuild(props) {
 							className="start-building-item"
 						>
 							<i className="mdi mdi-github-circle icon-lg mb40 mb-xs-24  " />
-							<h5 className="uppercase">Code the CLTK Core NLP package</h5>
+							<h5 className="uppercase">Contribute to the CLTK Core NLP package</h5>
 							<span className="item-text">
 								Help push forward what's possible with study of classicallanguages
 								by developing the CLTK core natural language processing library