Merge pull request #2 from bharatari/dev

Add FERPA disclaimer
bharatari · Jan 16, 2019 · 7044b99 · 7044b99
2 parents 0e8d025 + 9f855be
commit 7044b99
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 3 deletions.
diff --git a/client/package.json b/client/package.json
@@ -1,6 +1,6 @@
 {
   "name": "utd-grades-client",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "scripts": {
     "build": "nwb build-react-app",
     "clean": "nwb clean-app",

diff --git a/client/src/components/Form/index.js b/client/src/components/Form/index.js
@@ -14,7 +14,7 @@ class HomeForm extends React.Component {
   render() {
     const { handleSubmit, onSearch, pristine, reset, submitting } = this.props;
     const content = (
-      <div>
+      <div className={classes.popover}>
         <p>You can search for:</p>
         <ul>
           <li>A specific section: CS 1337.501</li>

diff --git a/client/src/components/Form/styles.scss b/client/src/components/Form/styles.scss
@@ -13,3 +13,8 @@
   font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
   color: #95989A;
 }
+
+.popover {
+  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
+  width: 375px;
+}
diff --git a/client/src/routes/Results/components/List/index.js b/client/src/routes/Results/components/List/index.js
@@ -2,7 +2,7 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import classes from './styles.scss';
 import classNames from 'classnames';
-import { List, Spin, Icon } from 'antd';
+import { List, Spin, Icon, Popover } from 'antd';
 import general from 'utils/general';
 
 const IconText = ({ type, text }) => (
@@ -14,10 +14,21 @@ const IconText = ({ type, text }) => (
 
 export default class ResultsList extends React.Component {
   render() {
+    const popover = (
+      <div className={classes.popover}>
+        <p>Because of FERPA restrictions, grade data for certain classes — in particular, classes with a small number of students — is unavailable.</p>
+      </div>
+    );
+
     const empty = (
       <div className={classes.emptyContainer}>
         <Icon className={classes.icon} type="frown" theme="twoTone" />
         <p className={classes.error}>We weren't able to find that. Try searching for something else!</p>
+        <Popover content={popover} className={classes.hint} placement="bottom">
+          <span style={{ textAlign: 'center' }}>
+            Still can't find what you're looking for? <span style={{ textDecoration: 'underline' }}>Learn more.</span>
+          </span>
+        </Popover>
       </div>
     );
 

diff --git a/client/src/routes/Results/components/List/styles.scss b/client/src/routes/Results/components/List/styles.scss
@@ -55,3 +55,17 @@
   color: #a4a4a4;
   font-weight: 300;
 }
+
+.hint {
+  margin-top: 25px;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
+  color: #95989A;
+}
+
+.popover {
+  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
+  width: 200px;
+}