styling and microcopy

frontend/src/metabase/components/EntityMenuItem.jsx

@@ -22,7 +22,7 @@ const itemClasses = cxs({
     color: "#BCC5CA",
     marginRight: "0.65em",
   },
-  ":hover > .Icon": {
+  ":hover .Icon": {
     color: "#509ee3",
     transition: "all 300ms linear",
   },

frontend/src/metabase/dashboard/containers/AutomaticDashboardApp.jsx

@@ -6,6 +6,7 @@ import { Link } from "react-router";
 import { withBackground } from "metabase/hoc/Background";
 import ActionButton from "metabase/components/ActionButton";
 import Icon from "metabase/components/Icon";
+import cxs from "cxs";
 
 import { Dashboard } from "./Dashboard";
 import DashboardData from "metabase/dashboard/hoc/DashboardData";
@@ -16,23 +17,32 @@ import * as Urls from "metabase/lib/urls";
 
 import { dissoc } from "icepick";
 
+const suggestionClasses = cxs ({
+  ":hover h3": {
+    color: "#509ee3",
+  },
+  ":hover .Icon": {
+    color: "#F9D45C",
+  }
+});
+
 const SuggestionsList = ({ suggestions }) => (
   <ol className="px2">
     {suggestions.map((s, i) => (
-      <li key={i}>
+      <li key={i} className={suggestionClasses}>
         <Link
           to={s.url}
           className="bordered rounded bg-white shadowed mb2 p2 flex no-decoration"
         >
           <div
-            className="bg-slate-light rounded flex align-center justify-center text-slate mr1 flex-no-shrink"
+            className="bg-slate-extra-light rounded flex align-center justify-center text-slate mr1 flex-no-shrink"
             style={{ width: 48, height: 48 }}
           >
-            <Icon name="bolt" size={22} />
+            <Icon name="bolt" className="Icon text-grey-1" size={22} />
           </div>
           <div>
-            <h3 className="m0 mb1">{s.title}</h3>
-            <p className="text-paragraph mt0">{s.description}</p>
+            <h3 className="m0 mb1 ml1">{s.title}</h3>
+            <p className="text-grey-4 ml1 mt0 mb0">{s.description}</p>
           </div>
         </Link>
       </li>
@@ -43,7 +53,7 @@ const SuggestionsList = ({ suggestions }) => (
 const SuggestionsSidebar = ({ related }) => (
   <div className="flex flex-column">
     <div className="py2 text-centered my3">
-      <h3>More X-rays</h3>
+      <h3>More explorations</h3>
     </div>
     {Object.values(related).map(suggestions => (
       <SuggestionsList suggestions={suggestions} />

resources/automagic_dashboards/EventTable.yaml

-title: Useful Metrics about [[EventTable]] (Autogenerated)
+title: Interesting metrics about [[EventTable]]
+description: A look at your events over time and by several categories.
 metrics:
   - Count:
       metric: ["count"]

resources/automagic_dashboards/GenericTable.yaml

-title: Useful Metrics about [[GenericTable]] (Autogenerated)
-description: Some useful metrics about the [[GenericTable]] table to get you started.
+title: [[GenericTable]] exploration
+description: Potentially interesting metrics about [[GenericTable]] by things like time, place, and category.
 metrics:
   - Count:
       metric: ["count"]

resources/automagic_dashboards/GoogleAnalyticsTable.yaml

-title: Google Analytics (Autogenerated)
-description: Some useful metrics about your GA stats to get you started.
+title: Google Analytics
+description: Some interesting metrics about your GA stats to get you started.
 metrics:
   - Sessions:
       metric: [METRIC, "ga:sessions"]

resources/automagic_dashboards/TransactionTable.yaml

 title: Transactions
+description: Some metrics we found about your transactions.
 metrics:
 - AvgDiscount:
     metric: [/, [sum, [dimension, Discount]], [sum, [dimension, Income]]]

resources/automagic_dashboards/UserTable.yaml

 title: Users
-description: Some useful metrics about the [[UserTable]] table to get you started.
+description: An exploration of your users to get you started.
 metrics:
 - Count:
     metric: [count]

resources/automagic_dashboards/example.yaml

@@ -8,8 +8,8 @@
 # Name of the dashboard
 # You can reference the selected table in the title and description. A reference
 #like this will be replaced by the table's (display) name.
-title: Example
-description: Autogenerated metrics about [[GenericTable]]
+title: Example exploration
+description: Autogenerated metrics about [[GenericTable]].
 # In general the file name of the heuristic is used to determine the type of table
 # it applies to, but this can be overwritten by table_type field. For a list of
 # available types see the namespace metabase.type.