merge atte's changes

frontend/src/metabase/admin/databases/components/DatabaseEditForms.jsx

@@ -19,7 +19,7 @@ export default class DatabaseEditForms extends Component {
 
         let errors = {};
         return (
-            <div>
+            <div className="mt4">
                 <div className={cx("Form-field", {"Form--fieldError": errors["engine"]})}>
                     <label className="Form-label Form-offset">Database type: <span>{errors["engine"]}</span></label>
                     <label className="Select Form-offset mt1">

frontend/src/metabase/admin/databases/components/DatabaseSchedulingForm.jsx

@@ -105,6 +105,7 @@ export default class DatabaseSchedulingForm extends Component {
                                     }
                                     scheduleOptions={["hourly", "daily"]}
                                     onScheduleChange={this.updateSchemaSyncSchedule}
+                                    textBeforeInterval="Scan"
                                 />
                             </div>
 
@@ -138,6 +139,7 @@ export default class DatabaseSchedulingForm extends Component {
                                                     }
                                                     scheduleOptions={["daily", "weekly", "monthly"]}
                                                     onScheduleChange={this.updateFieldScanSchedule}
+                                                    textBeforeInterval="Scan"
                                                 />
                                             </div>
                                         </SyncOption>

frontend/src/metabase/admin/databases/containers/DatabaseEditApp.jsx

@@ -36,12 +36,18 @@ const mapStateToProps = (state, props) => ({
     formState: getFormState(state, props)
 });
 
-export const Tab = ({ name, setTab, currentTab }) =>
-    <div
-        className={cx('cursor-pointer py3', {'text-brand': currentTab === name.toLowerCase() })}
-        onClick={() => setTab(name)}>
-        <h3>{name}</h3>
-    </div>
+export const Tab = ({ name, setTab, currentTab }) => {
+    const isCurrentTab = currentTab === name.toLowerCase()
+
+    return (
+        <div
+            className={cx('cursor-pointer py2', {'text-brand': isCurrentTab })}
+            style={isCurrentTab ? { borderBottom: "3px solid #2D86D4" } : {}}
+            onClick={() => setTab(name)}>
+            <h3>{name}</h3>
+        </div>
+    )
+}
 
 export const Tabs = ({ currentTab, setTab }) =>
     <div className="border-bottom">

frontend/src/metabase/components/SchedulePicker.jsx

@@ -48,6 +48,8 @@ export default class SchedulePicker extends Component {
         // TODO: hourly option?
         // available schedules, e.g. [ "daily", "weekly", "monthly"]
         scheduleOptions: PropTypes.object.isRequired,
+        // text before Daily/Weekly/Monthly... option
+        textBeforeInterval: PropTypes.string,
         // text prepended to "12:00 PM PST, your Metabase timezone"
         textBeforeSendTime: PropTypes.string,
         onScheduleChange: PropTypes.func.isRequired,
@@ -108,7 +110,7 @@ export default class SchedulePicker extends Component {
                     value={_.find(MONTH_DAY_OPTIONS, (o) => o.value === schedule.schedule_frame)}
                     options={MONTH_DAY_OPTIONS}
                     optionNameFn={o => o.name}
-                    className="bg-white"
+                    className="h4 text-bold bg-white"
                     optionValueFn={o => o.value}
                     onChange={(o) => this.onPropertyChange("schedule_frame", o) }
                 />
@@ -119,7 +121,7 @@ export default class SchedulePicker extends Component {
                             options={DAY_OPTIONS}
                             optionNameFn={o => o.name}
                             optionValueFn={o => o.value}
-                            className="bg-white"
+                            className="h4 text-bold bg-white"
                             onChange={(o) => this.onPropertyChange("schedule_day", o) }
                         />
                     </span>
@@ -139,7 +141,7 @@ export default class SchedulePicker extends Component {
                     options={DAY_OF_WEEK_OPTIONS}
                     optionNameFn={o => o.name}
                     optionValueFn={o => o.value}
-                    className="bg-white"
+                    className="h4 text-bold bg-white"
                     onChange={(o) => this.onPropertyChange("schedule_day", o) }
                 />
             </span>
@@ -157,7 +159,7 @@ export default class SchedulePicker extends Component {
             <div className="mt1">
                 <span className="h4 text-bold mr1">at</span>
                 <Select
-                    className="mr1 bg-white"
+                    className="mr1 h4 text-bold bg-white"
                     value={_.find(HOUR_OPTIONS, (o) => o.value === hour)}
                     options={HOUR_OPTIONS}
                     optionNameFn={o => o.name}
@@ -170,7 +172,7 @@ export default class SchedulePicker extends Component {
                     optionNameFn={o => o.name}
                     optionValueFn={o => o.value}
                     onChange={(o) => this.onPropertyChange("schedule_hour", hour + o * 12) }
-                    className="bg-white"
+                    className="h4 text-bold bg-white"
                 />
                 { textBeforeSendTime &&
                     <div className="mt2 h4 text-bold text-grey-3 border-top pt2">
@@ -182,13 +184,13 @@ export default class SchedulePicker extends Component {
     }
 
     render() {
-        let { schedule, scheduleOptions } = this.props;
+        let { schedule, scheduleOptions, textBeforeInterval } = this.props;
 
         const scheduleType = schedule.schedule_type;
 
         return (
             <div className="mt1">
-                <span className="h4 text-bold mr1">Sent</span>
+                <span className="h4 text-bold mr1">{ textBeforeInterval }</span>
                 <Select
                     className="h4 text-bold bg-white"
                     value={scheduleType}

frontend/src/metabase/pulse/components/PulseEditChannels.jsx

@@ -194,6 +194,7 @@ export default class PulseEditChannels extends Component {
                     <SchedulePicker
                         schedule={_.pick(channel, "schedule_day", "schedule_frame", "schedule_hour", "schedule_type") }
                         scheduleOptions={channelSpec.schedules}
+                        textBeforeInterval="Sent"
                         textBeforeSendTime={`${CHANNEL_NOUN_PLURAL[channelSpec && channelSpec.type] || "Messages"} will be sent at `}
                         onScheduleChange={this.onChannelScheduleChange.bind(this, index)}
                     />