From dd72f4f5852b30f57048699ff2ea95b0d28abcf9 Mon Sep 17 00:00:00 2001 From: nathaliemar Date: Tue, 8 Apr 2025 18:44:02 +0200 Subject: [PATCH 1/3] first version --- starter_code/index.html | 351 +++++++++++++++-------------- starter_code/stylesheets/style.css | 195 ++++++++++++++++ 2 files changed, 377 insertions(+), 169 deletions(-) diff --git a/starter_code/index.html b/starter_code/index.html index 2f593610f..235d953d7 100644 --- a/starter_code/index.html +++ b/starter_code/index.html @@ -1,179 +1,192 @@ + + + + + + + + + + + + + Slack is your digital HQ | Slack + + + + + + + +
+
+

Great teamwork starts with a digital HQ

+ +

+ Slack is free to try for as long as you'd + like. +

+ +
+ + +
+
-
-
-

Trusted by companies all over the world

+
+ Slack app screenshot +
+
+ +
+
+

Trusted by companies all over the world

+ +
+ Airbnb logo + NASA logo + Uber logo + Target logo + New York Times logo + Spotify logo +
+
+ +
+

Teams large and small rely on Slack

+

+ Slack securely scales up to support collaboration at the world’s + biggest companies. +

+ +
    +
  • +

    85%

    +

    + of users say Slack has improved communication + * +

    +
    • + +
  • +

    86%

    +

    + feel their ability to work remotely has improved has improved + * +

    +
    • + +
  • +

    88%

    +

    + feel more connected to their teams + * +

    +
    • +
+ + * + Weighted average. Based on 2,707 survey responses form weekly Slack + users in the U.S., UK, Australia, and Canada with a ± 2% margin + of error at 95% CI (August 2020). + +
+ +
+

Welcome to your new digital HQ

+ + + +
+
+ + + + diff --git a/starter_code/stylesheets/style.css b/starter_code/stylesheets/style.css index 59f4a7798..3f673aae1 100644 --- a/starter_code/stylesheets/style.css +++ b/starter_code/stylesheets/style.css @@ -8,3 +8,198 @@ paragraph yellow: #ECB12F links blue: #2E71A6 footer links grey: #454245 */ + +/* STYLES */ + +/* Fonts */ +body { + font-family: "Poppins", sans-serif; + background-color: #540b51; + color: #000000; + font-size: 16px; + line-height: 1.5; + width: 100vw; +} + +/* Basic styles */ +body { + text-align: center; + padding: 0; + margin: 0; + width: 100vw; +} +ul { + list-style: none; + padding: 0; +} +small { + color: #454245; +} +.btn { + background-color: #540b51; + color: #fff; + padding: 10px 20px; + border: none; + border-radius: 3px; + font-size: 1em; + font-weight: bold; + text-decoration: none; + margin-top: 30px; + text-transform: uppercase; + height: 50px; +} +.btn-white { + border-color: #540b51; + background-color: white; + color: #540b51; +} +.btn-purple { + border: solid 2px white; +} +.btn-blue { + background-color: #4285f4; + color: white; + display: flex; +} + +/* Font sizes */ +h1 { + font-size: 4em; + font-weight: 600; + color: white; +} +h3 { + font-size: 2em; + font-weight: 600; +} + +/*NAVIGATION*/ + +nav { + background-color: #540b51; + display: flex; + justify-content: space-between; + padding: 0 3% 0 3%; +} + +.nav-links { + display: none; + flex-direction: row; +} +.nav-links ul { + list-style: none; +} +.nav-links ul li { +} +.nav-right { +} +.nav-cta { + display: none; +} + +/*HEADER - HERO*/ +header { + background-color: #540b51; + padding: 0 3% 0 3%; +} + +.hero-text { +} +.signups { +} +.email-signup-btn { +} +.google-logo { + background-color: gray; + width: 12%; + display: flex; +} +.google-logo img { + width: 15%; +} +.hero-image > img { + height: 50vh; +} +.hero-text p { + color: white; +} +.orange { + color: #ecb12f; +} +/*MAIN SECTION*/ +main { + padding: 0 3% 0 3%; +} +.customer-logos { + background-color: #f3eae2; +} +.customer-logos p { + text-transform: uppercase; + font-weight: 600; +} +.logos-container { + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; +} +.logos-container img { + display: flex; + max-width: calc(100% / 4); + max-height: 50px; + margin: 10px; +} +.pitch { + background-color: white; +} +.pitch h3 { + color: #540b51; +} +.stats { +} +.stats span { + color: #540b51; +} +.stat-text { + font-weight: bold; +} +.cta { + display: flex; + flex-direction: column; +} +.cta h3 { + color: white; +} + +/*FOOTER*/ +footer { + background-color: white; + padding: 0 3% 0 3%; +} +.footer-links { + display: flex; + flex-direction: column; + align-items: flex-start; + font-weight: bold; +} +.footer-links li:last-child { + color: #2e71a6; +} +.line-before-socials { + display: none; +} +.socials-container { + height: 50px; + display: flex; + align-items: center; + justify-content: center; +} +.social-links { + display: flex; + flex-direction: row; + justify-content: space-between; + width: 100%; +} +.disclaimer { + color: #454245; +} From 6a62935a0e57ab28fc7c3f014e5b3057eecd60b3 Mon Sep 17 00:00:00 2001 From: nathaliemar Date: Tue, 8 Apr 2025 23:29:19 +0200 Subject: [PATCH 2/3] further changes --- starter_code/index.html | 18 +++--- starter_code/stylesheets/style.css | 100 +++++++++++++++++++++++++---- 2 files changed, 97 insertions(+), 21 deletions(-) diff --git a/starter_code/index.html b/starter_code/index.html index 235d953d7..73d68e9ab 100644 --- a/starter_code/index.html +++ b/starter_code/index.html @@ -76,7 +76,7 @@

Great teamwork starts with a digital HQ

-