diff --git a/packages/desktop-gui/cypress/integration/global_mode_spec.coffee b/packages/desktop-gui/cypress/integration/global_mode_spec.coffee index b1bd447ff9..34fc709185 100644 --- a/packages/desktop-gui/cypress/integration/global_mode_spec.coffee +++ b/packages/desktop-gui/cypress/integration/global_mode_spec.coffee @@ -52,7 +52,7 @@ describe "Global Mode", -> cy.get(".nav .logo img").should("have.attr", "src", "img/cypress-inverse.png") it "shows message about using Cypress locally", -> - cy.contains("Verbiage about local Cypress usage") + cy.contains("Run this command") it "displays help link", -> cy.contains("a", "Need help?") @@ -62,8 +62,8 @@ describe "Global Mode", -> expect(@ipc.externalOpen).to.be.calledWith("https://on.cypress.io/adding-new-project") it "shows project drop area with button to select project", -> - cy.get(".project-drop p:first").should("have.text", "Drag your project here") - cy.get(".project-drop button").should("have.text", "Select Project") + cy.get(".project-drop p:first").should("contain", "Drag your project here") + cy.get(".project-drop a").should("have.text", "select manually") describe "dragging and dropping project", -> it "highlights/unhighlights drop area when dragging over it/leaving it", -> @@ -89,18 +89,18 @@ describe "Global Mode", -> describe "selecting project", -> it "adds project and opens it when selected", -> cy.stub(@ipc, "showDirectoryDialog").resolves("/foo/bar") - cy.get(".project-drop button").click().then => + cy.get(".project-drop a").click().then => expect(@ipc.showDirectoryDialog).to.be.called cy.shouldBeOnProjectSpecs() it "updates local storage", -> cy.stub(@ipc, "showDirectoryDialog").resolves("/foo/bar") - cy.get(".project-drop button").click().should => + cy.get(".project-drop a").click().should => expect(@getLocalStorageProjects()[0].id).to.equal(@projects[0].id) it "does nothing when user cancels", -> cy.stub(@ipc, "showDirectoryDialog").resolves() - cy.get(".project-drop button").click() + cy.get(".project-drop a").click() cy.shouldBeOnIntro() describe "going to project", -> diff --git a/packages/desktop-gui/cypress/integration/projects_list_spec.coffee b/packages/desktop-gui/cypress/integration/projects_list_spec.coffee index 03601e81c0..4f51c8d928 100644 --- a/packages/desktop-gui/cypress/integration/projects_list_spec.coffee +++ b/packages/desktop-gui/cypress/integration/projects_list_spec.coffee @@ -144,12 +144,12 @@ describe "Global Mode", -> it "puts project at start when selected", -> cy.stub(@ipc, "showDirectoryDialog").resolves("/foo/bar") - cy.get(".project-drop button").click().then => + cy.get(".project-drop a").click().then => @assertOrder(["id-bar", "id-a", "id-b"]) it "puts project at start when selected and it already exists", -> cy.stub(@ipc, "showDirectoryDialog").resolves("/project/b") - cy.get(".project-drop button").click().then => + cy.get(".project-drop a").click().then => @assertOrder(["id-b", "id-a"]) it "puts project at start when clicked on in list", -> @@ -166,7 +166,7 @@ describe "Global Mode", -> it "limits to 5 when selected", -> cy.stub(@ipc, "showDirectoryDialog").resolves("/foo/bar") - cy.get(".project-drop button").click().then => + cy.get(".project-drop a").click().then => expect(@getLocalStorageProjects().length).to.equal(5) describe "errors", -> diff --git a/packages/desktop-gui/src/app/intro.jsx b/packages/desktop-gui/src/app/intro.jsx index 97bb775940..85ec80d9d5 100644 --- a/packages/desktop-gui/src/app/intro.jsx +++ b/packages/desktop-gui/src/app/intro.jsx @@ -22,24 +22,25 @@ class Default extends Component { render () { return (
-

Welcome to Cypress!

-

Verbiage about local Cypress usage

-

Verbiage about local Cypress usage

-

Verbiage about local Cypress usage

+

To Get Started...

- + Run this command in your Console (or Terminal) in the project you want to test: + Need help?

+

+

npm install this thang
+

+

Or you can just drag your project here to run it:

-

Drag your project here

-

- or -

- + +

Drag your project here or select manually.

@@ -51,7 +52,8 @@ class Default extends Component { document.removeEventListener('drop', this._nope) } - _selectProject = () => { + _selectProject = (e) => { + e.preventDefault() ipc.showDirectoryDialog().then((path) => { if (!path) return // user cancelled diff --git a/packages/desktop-gui/src/app/intro.scss b/packages/desktop-gui/src/app/intro.scss index ebc4241e2b..5b19c04b45 100644 --- a/packages/desktop-gui/src/app/intro.scss +++ b/packages/desktop-gui/src/app/intro.scss @@ -8,30 +8,60 @@ right: 0; top: 40px; - h2 { - font-size: 20px; - margin-top: 0; + h1 { + color: #636668; + font-family: "Fira Sans"; + font-weight: 100; + margin-top: 15px; + text-align: center; + } + + p { + margin: 10px 0; + color: #636668; + font-size: 14px; + line-height: 21px; + } + + pre { + clear: both; + border: 0; + background-color: #252831; + border-radius: 3px; + color: #eee; + margin-bottom: 15px; } } .project-drop { align-items: center; - background: #f8f8f8; - border: solid 2px #d3d3d3; - border-radius: 2px; + background: #F6F7F8; + border: dashed 2px #e3e4e5; + border-radius: 5px; display: flex; flex-direction: column; - height: 150px; justify-content: center; + margin-bottom: 40px; + height: 150px; + + .fa-cloud-upload { + font-size: 50px; + color: #d3d6d8; + } + + a { + border-bottom: 1px dotted lighten($brand-primary, 30%); + color: lighten($brand-primary, 12%); + } p { - color: #555; + color: #939698; font-size: 1.4em; } &.is-dragging-over { - background: #eee; - border-color: $brand-primary; + background: #F6F7F8; + border: 2px solid lighten($brand-primary, 30%); } }