From 3fd972896529d78f289a7450573de570795d8449 Mon Sep 17 00:00:00 2001 From: victoriachanimal Date: Sun, 26 Aug 2018 17:48:41 -0400 Subject: [PATCH 1/3] changes + added javascript --- about.html | 19 ++- dev/styles/partials/.DS_Store | Bin 6148 -> 6148 bytes dev/styles/partials/_aboutUs.scss | 19 ++- dev/styles/partials/_header.scss | 21 ++++ dev/styles/partials/_mq.scss | 20 ++- dev/styles/partials/assets/earth.svg | 8 ++ dev/styles/partials/smoke.jpg | Bin 195793 -> 0 bytes index.html | 178 ++++++++++++++++++++++++--- public/styles/style.css | 57 +++++++-- resources.html | 19 ++- results.html | 85 +++++++++++++ 11 files changed, 386 insertions(+), 40 deletions(-) create mode 100644 dev/styles/partials/assets/earth.svg delete mode 100644 dev/styles/partials/smoke.jpg create mode 100644 results.html diff --git a/about.html b/about.html index e60ed5d..08e4706 100644 --- a/about.html +++ b/about.html @@ -8,7 +8,7 @@ - Project 4 - About + Global Alerts - About @@ -26,7 +26,7 @@
-

Title of our App

+

Global Alerts

+ + + + + +
@@ -51,7 +60,7 @@

Title of our App

About Us

-

"Title of our App" is an app designed to assist users with finding real-time data and information on natural disasters happening in 37 high-risk countries across the world.

+

Global Alerts is an app designed to assist users with finding real-time data and information on natural disasters happening in 37 of the most high-risk countries across the world, according to the World Risk Index.

Using two key search features, users can filter their requested data by country and vulnerable group. The app returns the latest reports and articles, organized by natural disaster category and gathered directly from the ReliefWeb API, a leading humanitarian information source on global crises and disasters.

Each search result also returns a general list of international or local charities and organizations that serve natural disasters in a specific country. For clarification on whether an organization is addressing a particular natural disaster at a given time, we strongly suggest users contact them directly.

"Title of our App" was designed and developed by Stefan Miranda and Victoria Chan in the summer of 2018.

@@ -64,7 +73,7 @@

About Us

+ + + + + +
+
+

© Global Alerts

+
+ + +
+
+
+ + + + + + + + + \ No newline at end of file diff --git a/public/styles/style.css b/public/styles/style.css index 42a8e27..9542628 100644 --- a/public/styles/style.css +++ b/public/styles/style.css @@ -185,9 +185,6 @@ header { top: 0; left: -25px; } -.highlight { - font-weight: 700; } - .searchSection { margin-top: 50px; } .searchSection h4 { @@ -315,6 +312,59 @@ button { margin: 0 auto; box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); } +.resultsSection { + background: linear-gradient(#EBEBEB, white, #EBEBEB); + padding: 20px 0 50px 0; + margin-top: 50px; } + .resultsSection h5 { + font-size: 18px; + font-size: 1.8rem; + font-family: 'Cabin', sans-serif; + color: #D2113A; + font-weight: 400; } + .resultsSection h6 { + font-size: 15px; + font-size: 1.5rem; + font-family: 'Cabin', sans-serif; + font-weight: 400; + margin: 12px 0; } + +.resultsHeadings { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; } + +.back a { + display: flex; + align-items: center; + flex-direction: row; + margin-top: 5px; } + .back a:hover { + color: gray; + transition: all 0.3s; } + .back a .fa-long-arrow-alt-left { + font-size: 25px; } + .back a h6 { + margin-left: 10px; } + +.results { + padding: 15px 30px; + background: white; + box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); } + +.resultListItem { + padding-bottom: 10px; } + +.vulnerableGroupHeading { + color: gray; } + +.charities { + font-size: 15px; + font-size: 1.5rem; + font-family: 'Cabin', sans-serif; + font-weight: 400; } + .aboutSection { padding-bottom: 60px; } .aboutSection p:last-child { @@ -344,13 +394,6 @@ button { right: 0; padding-bottom: 1px; } -.resultsSection { - background: linear-gradient(#EBEBEB, white, #EBEBEB); } - -.results { - background: white; - box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2); } - footer { background-color: #333333; padding: 1px 0; } @@ -494,3 +537,9 @@ p { font-size: 1.45rem; font-family: 'Varela', sans-serif; line-height: 1.5; } + +.highlight { + font-weight: 700; } + +.italic { + font-style: italic; } diff --git a/results.html b/results.html deleted file mode 100644 index 3186da7..0000000 --- a/results.html +++ /dev/null @@ -1,85 +0,0 @@ - - - - - - - - - - - Global Alerts - About - - - - - - - - - - - - - -
- -
-

Global Alerts

-
- - - - - - - -
-
-
- - - -
-
-
-

Results

- -
- -
-
- -
-
- - - -
-
-

© Global Alerts

-
- - -
-
-
- - - \ No newline at end of file diff --git a/script.js b/script.js deleted file mode 100644 index 34824dc..0000000 --- a/script.js +++ /dev/null @@ -1,22 +0,0 @@ -// ROADMAP - -// Create namespace - - -// 1. Create method and Ajax request to GET data we need -// Then create a .then method to allow us to know the data is ready - - -// 2. Method to DISPLAY data: -// We want to create variables that link specific pieces of data to elements on our page (eg. country, disaster category, vulnerable groups), after which we will organize according to the wireframe - - -// 3. Listen to user submit: -// Method - return data based on user's choice of category -// Method - some sort of for loop or forEach method that iterates through all the results, giving relevant info to user - - -// 4. Return results of charity organizations - - -// Init method \ No newline at end of file From bb523c1a4d55d4af565afc3d1447cf63c85f57b5 Mon Sep 17 00:00:00 2001 From: victoriachanimal Date: Mon, 27 Aug 2018 09:50:36 -0400 Subject: [PATCH 3/3] final changes --- about.html | 5 +++-- dev/styles/partials/_home.scss | 6 +++--- index.html | 12 ++++-------- resources.html | 3 +++ 4 files changed, 13 insertions(+), 13 deletions(-) diff --git a/about.html b/about.html index 08e4706..3644ef2 100644 --- a/about.html +++ b/about.html @@ -34,9 +34,10 @@

Global Alerts

  • - + +

    Global Alerts

    @@ -52,6 +53,7 @@

    Global Alerts

    + @@ -64,7 +66,6 @@

    About Us

    Using two key search features, users can filter their requested data by country and vulnerable group. The app returns the latest reports and articles, organized by natural disaster category and gathered directly from the ReliefWeb API, a leading humanitarian information source on global crises and disasters.

    Each search result also returns a general list of international or local charities and organizations that serve natural disasters in a specific country. For clarification on whether an organization is addressing a particular natural disaster at a given time, we strongly suggest users contact them directly.

    "Title of our App" was designed and developed by Stefan Miranda and Victoria Chan in the summer of 2018.

    - diff --git a/dev/styles/partials/_home.scss b/dev/styles/partials/_home.scss index e81a596..029c1b6 100644 --- a/dev/styles/partials/_home.scss +++ b/dev/styles/partials/_home.scss @@ -155,8 +155,8 @@ button { // END OF SECTION 2: SEARCH STYLES -// SECTION 3: *RESULTS* -// Results Page styles (results.html) +// SECTION 3: * RESULTS * +// Results Page styles (located in home.html) .resultsSection { background: linear-gradient($thirdColor, white, $thirdColor); padding: 20px 0 50px 0; @@ -222,4 +222,4 @@ button { @include primaryFont(15); font-weight: 400; } -// END OF SECTION 3: RESULTS \ No newline at end of file +// END OF SECTION 3: * RESULTS * \ No newline at end of file diff --git a/index.html b/index.html index 25413d2..8d87f84 100644 --- a/index.html +++ b/index.html @@ -37,6 +37,7 @@

    Global Alerts

    +

    Global Alerts

    @@ -52,6 +53,7 @@

    Global Alerts

    + @@ -69,13 +71,10 @@

    How to Use

    -
    -
    - -

    Search By

    +

    Search By

    @@ -86,7 +85,6 @@

    Search By

    -

    Bangladesh

    @@ -436,8 +434,7 @@

    Search By

    - - +
    @@ -481,5 +478,4 @@

    Results

    - \ No newline at end of file diff --git a/resources.html b/resources.html index 23f6ec5..36b7aef 100644 --- a/resources.html +++ b/resources.html @@ -36,6 +36,8 @@

    Global Alerts

    + +

    Global Alerts

    @@ -51,6 +53,7 @@

    Global Alerts

    +