diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 000000000..bf456a04a Binary files /dev/null and b/.DS_Store differ diff --git a/assets/.DS_Store b/assets/.DS_Store new file mode 100644 index 000000000..0f67c1930 Binary files /dev/null and b/assets/.DS_Store differ diff --git a/assets/fonts/.DS_Store b/assets/fonts/.DS_Store new file mode 100644 index 000000000..6d3e0e5d7 Binary files /dev/null and b/assets/fonts/.DS_Store differ diff --git a/assets/fonts/Circular-Bold.eot b/assets/fonts/Circular-Bold.eot new file mode 100644 index 000000000..34a40cab7 Binary files /dev/null and b/assets/fonts/Circular-Bold.eot differ diff --git a/assets/fonts/Circular-Bold.ttf b/assets/fonts/Circular-Bold.ttf new file mode 100644 index 000000000..53f1bceb1 Binary files /dev/null and b/assets/fonts/Circular-Bold.ttf differ diff --git a/assets/fonts/Circular-Bold.woff b/assets/fonts/Circular-Bold.woff new file mode 100644 index 000000000..890f99612 Binary files /dev/null and b/assets/fonts/Circular-Bold.woff differ diff --git a/assets/fonts/Circular-Bold.woff2 b/assets/fonts/Circular-Bold.woff2 new file mode 100644 index 000000000..dabd7cd93 Binary files /dev/null and b/assets/fonts/Circular-Bold.woff2 differ diff --git a/assets/fonts/Circular-Book.eot b/assets/fonts/Circular-Book.eot new file mode 100644 index 000000000..33bb1b9d0 Binary files /dev/null and b/assets/fonts/Circular-Book.eot differ diff --git a/assets/fonts/Circular-Book.ttf b/assets/fonts/Circular-Book.ttf new file mode 100644 index 000000000..91e15fb3b Binary files /dev/null and b/assets/fonts/Circular-Book.ttf differ diff --git a/assets/fonts/Circular-Book.woff b/assets/fonts/Circular-Book.woff new file mode 100644 index 000000000..e41b40a97 Binary files /dev/null and b/assets/fonts/Circular-Book.woff differ diff --git a/assets/fonts/Circular-Book.woff2 b/assets/fonts/Circular-Book.woff2 new file mode 100644 index 000000000..8a0d8e6b0 Binary files /dev/null and b/assets/fonts/Circular-Book.woff2 differ diff --git a/assets/fonts/LarsseitW05-Bold.eot b/assets/fonts/LarsseitW05-Bold.eot new file mode 100644 index 000000000..3eab15980 Binary files /dev/null and b/assets/fonts/LarsseitW05-Bold.eot differ diff --git a/assets/fonts/LarsseitW05-Bold.ttf b/assets/fonts/LarsseitW05-Bold.ttf new file mode 100644 index 000000000..8a0650c32 Binary files /dev/null and b/assets/fonts/LarsseitW05-Bold.ttf differ diff --git a/assets/fonts/LarsseitW05-Bold.woff b/assets/fonts/LarsseitW05-Bold.woff new file mode 100644 index 000000000..287ae07cb Binary files /dev/null and b/assets/fonts/LarsseitW05-Bold.woff differ diff --git a/assets/fonts/LarsseitW05-Bold.woff2 b/assets/fonts/LarsseitW05-Bold.woff2 new file mode 100644 index 000000000..d1e35d658 Binary files /dev/null and b/assets/fonts/LarsseitW05-Bold.woff2 differ diff --git a/assets/fonts/LarsseitW05-Thin.eot b/assets/fonts/LarsseitW05-Thin.eot new file mode 100644 index 000000000..adb89ca35 Binary files /dev/null and b/assets/fonts/LarsseitW05-Thin.eot differ diff --git a/assets/fonts/LarsseitW05-Thin.ttf b/assets/fonts/LarsseitW05-Thin.ttf new file mode 100644 index 000000000..f9c003112 Binary files /dev/null and b/assets/fonts/LarsseitW05-Thin.ttf differ diff --git a/assets/fonts/LarsseitW05-Thin.woff b/assets/fonts/LarsseitW05-Thin.woff new file mode 100644 index 000000000..9b671c97b Binary files /dev/null and b/assets/fonts/LarsseitW05-Thin.woff differ diff --git a/assets/fonts/LarsseitW05-Thin.woff2 b/assets/fonts/LarsseitW05-Thin.woff2 new file mode 100644 index 000000000..7d90b73f0 Binary files /dev/null and b/assets/fonts/LarsseitW05-Thin.woff2 differ diff --git a/assets/fonts/transfonter.org-20190626-164539.zip b/assets/fonts/transfonter.org-20190626-164539.zip new file mode 100644 index 000000000..d393c5c42 Binary files /dev/null and b/assets/fonts/transfonter.org-20190626-164539.zip differ diff --git a/assets/fonts/transfonter.org-20190626-164539/.DS_Store b/assets/fonts/transfonter.org-20190626-164539/.DS_Store new file mode 100644 index 000000000..5008ddfcf Binary files /dev/null and b/assets/fonts/transfonter.org-20190626-164539/.DS_Store differ diff --git a/assets/fonts/transfonter.org-20190626-164539/demo.html b/assets/fonts/transfonter.org-20190626-164539/demo.html new file mode 100644 index 000000000..f0e956820 --- /dev/null +++ b/assets/fonts/transfonter.org-20190626-164539/demo.html @@ -0,0 +1,233 @@ + + + + + + + + + Transfonter demo + + + + +
+
+

Circular Book

+ 
.your-style {
+    font-family: 'Circular Book';
+    font-weight: normal;
+    font-style: normal;
+}
+
+

+ abcdefghijklmnopqrstuvwxyz
+ABCDEFGHIJKLMNOPQRSTUVWXYZ
+ 0123456789.:,;()*!?'@#<>$%&^+-=~ +

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+
+
+
+

Circular Bold

+ 
.your-style {
+    font-family: 'Circular';
+    font-weight: bold;
+    font-style: normal;
+}
+
+

+ abcdefghijklmnopqrstuvwxyz
+ABCDEFGHIJKLMNOPQRSTUVWXYZ
+ 0123456789.:,;()*!?'@#<>$%&^+-=~ +

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+

The quick brown fox jumps over the lazy dog.

+
+
+
+ + \ No newline at end of file diff --git a/assets/fonts/transfonter.org-20190626-164539/stylesheet.css b/assets/fonts/transfonter.org-20190626-164539/stylesheet.css new file mode 100644 index 000000000..b3d5705da --- /dev/null +++ b/assets/fonts/transfonter.org-20190626-164539/stylesheet.css @@ -0,0 +1,22 @@ +@font-face { + font-family: 'Circular Book'; + src: url('Circular-Book.eot'); + src: url('Circular-Book.eot?#iefix') format('embedded-opentype'), + url('Circular-Book.woff2') format('woff2'), + url('Circular-Book.woff') format('woff'), + url('Circular-Book.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'Circular'; + src: url('Circular-Bold.eot'); + src: url('Circular-Bold.eot?#iefix') format('embedded-opentype'), + url('Circular-Bold.woff2') format('woff2'), + url('Circular-Bold.woff') format('woff'), + url('Circular-Bold.ttf') format('truetype'); + font-weight: bold; + font-style: normal; +} + diff --git a/images/Slack.ico b/assets/images/Slack.ico similarity index 100% rename from images/Slack.ico rename to assets/images/Slack.ico diff --git a/images/airbnb-logo.png b/assets/images/airbnb-logo.png similarity index 100% rename from images/airbnb-logo.png rename to assets/images/airbnb-logo.png diff --git a/images/capital-one-logo.png b/assets/images/capital-one-logo.png similarity index 100% rename from images/capital-one-logo.png rename to assets/images/capital-one-logo.png diff --git a/images/harvard-logo.png b/assets/images/harvard-logo.png similarity index 100% rename from images/harvard-logo.png rename to assets/images/harvard-logo.png diff --git a/images/home_talking.png b/assets/images/home_talking.png similarity index 100% rename from images/home_talking.png rename to assets/images/home_talking.png diff --git a/images/iso-slack.png b/assets/images/iso-slack.png similarity index 100% rename from images/iso-slack.png rename to assets/images/iso-slack.png diff --git a/images/los-angeles-times-logo.png b/assets/images/los-angeles-times-logo.png similarity index 100% rename from images/los-angeles-times-logo.png rename to assets/images/los-angeles-times-logo.png diff --git a/images/oracle-logo.png b/assets/images/oracle-logo.png similarity index 100% rename from images/oracle-logo.png rename to assets/images/oracle-logo.png diff --git a/images/slack-logo.png b/assets/images/slack-logo.png similarity index 100% rename from images/slack-logo.png rename to assets/images/slack-logo.png diff --git a/images/ticketmaster-logo.png b/assets/images/ticketmaster-logo.png similarity index 100% rename from images/ticketmaster-logo.png rename to assets/images/ticketmaster-logo.png diff --git a/images/us-flag.png b/assets/images/us-flag.png similarity index 100% rename from images/us-flag.png rename to assets/images/us-flag.png diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 000000000..6dc7e65a5 --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,10 @@ +var toggleElement = $('#toggle'); +var menu = $('.nav-mobile'); +var closeToggle = $('.x'); + +toggleElement.click(function() { + menu.addClass( 'opened' ); +}); +closeToggle.click(function(){ + menu.removeClass('opened') +}) diff --git a/assets/stylesheets/style.css b/assets/stylesheets/style.css new file mode 100644 index 000000000..5696144ad --- /dev/null +++ b/assets/stylesheets/style.css @@ -0,0 +1,182 @@ +/* +background-grey: #F4F3F4; +button-purple: #192592 +main-titles dark-grey: #2C303F; +paragraph grey: #5b5e6d; +nav grey: #5b5e6d; +*/ +@font-face { + font-family: 'LarsseitW05'; + src: url('../fonts/LarsseitW05-Thin.eot'); + src: url('../fonts/LarsseitW05-Thin.eot?#iefix') format('embedded-opentype'), + url('../fonts/LarsseitW05-Thin.woff2') format('woff2'), + url('../fonts/LarsseitW05-Thin.woff') format('woff'), + url('../fonts/LarsseitW05-Thin.ttf') format('truetype'); + font-weight: 100; + font-style: normal; +} + +@font-face { + font-family: 'LarsseitW05'; + src: url('../fonts/LarsseitW05-Bold.eot'); + src: url('../fonts/LarsseitW05-Bold.eot?#iefix') format('embedded-opentype'), + url('../fonts/LarsseitW05-Bold.woff2') format('woff2'), + url('../fonts/LarsseitW05-Bold.woff') format('woff'), + url('../fonts/LarsseitW05-Bold.ttf') format('truetype'); + font-weight: bold; + font-style: normal; +} + +@font-face { + font-family: 'Circular Book'; + src: url('../fonts/Circular-Book.eot'); + src: url('../fonts/Circular-Book.eot?#iefix') format('embedded-opentype'), + url('../fonts/Circular-Book.woff2') format('woff2'), + url('../fonts/Circular-Book.woff') format('woff'), + url('../fonts/Circular-Book.ttf') format('truetype'); + font-weight: normal; + font-style: normal; +} + +@font-face { + font-family: 'Circular'; + src: url('../fonts/Circular-Bold.eot'); + src: url('../fonts/Circular-Bold.eot?#iefix') format('embedded-opentype'), + url('../fonts/Circular-Bold.woff2') format('woff2'), + url('../fonts/Circular-Bold.woff') format('woff'), + url('../fonts/Circular-Bold.ttf') format('truetype'); + font-weight: bold; + font-style: normal; +} + +* { + box-sizing: border-box; + margin:0; + padding: 0; +} + +body { + font-family: 'Circular Book'; +} +main{ + margin: 61px 0 0; + padding: 25px; +} +p { + color: #454545; +} +a{ + text-decoration: none; + display: inline-block; +} +.title { + font-family: 'LarsseitW05'; + font-weight: 700; +} + +.nav-header { + position: fixed; + top: 0; + padding: 25px; + background-color: white; + width: 100%; +} + +.nav-header a { +display: block; +float: left; +} + +#toggle { + float: right; + padding: 5px; +} + +.nav-mobile { + position: fixed; + background-color: #611f69; + width: 100%; + top: 0; + transform: translateX(100%); + height: 100vh; + display: none; + transition-duration: .5s; + background-image: url('https://a.slack-edge.com/73e3f1/spacesuit/source/images/backgrounds/bg-halftone-black-30p@2x.png'); + background-size: 1300px 700px; + padding: 25px; +} +.nav-mobile header{ + display: flex; + align-items: center; + margin: 0 -25px; + justify-content: space-between; + padding: 0 25px 25px; + border-bottom: 1px solid rgba(255,255,255,.1); +} +.nav-mobile header svg:nth-child(2){ + fill: white; +} +.nav-mobile ul{ + margin: 25px 0px; +} +.nav-mobile ul li{ + color: white; + list-style: none; + font-size: 24px; +} +.nav-mobile ul li a{ + color:white; + padding: 25px 0px; +} +.opened{ + display: block; + transform: translateX(0%); + transition-duration: .5s; +} + +.clearfix { + clear: both; +} +.button{ + background: white; +} +a.button{ + color: #611f69 !important; +} +.nav-footer { + position: absolute; + bottom: 0; + width: 100%; + margin:0 -25px; +} + +.nav-footer a { + display: block; + width: 100%; + padding: 20px 30px; + text-align: center; + color: white; +} + +.section-clients { + background-color: #f5f5f5; +} + +.link-style { + font-family: Slack-Circular-Pro,"Helvetica Neue",Helvetica,"Segoe UI",Tahoma,Arial,sans-serif; + font-weight: 700; + line-height: 1.44444444; + letter-spacing: normal; +} + +.customer-image { + border: 0; + max-width: 100%; + height: auto; +} + +.customer-card { + border: 0; + max-width: 100%; + height: auto; +} \ No newline at end of file diff --git a/index.html b/index.html index 8300a1607..19bb11783 100644 --- a/index.html +++ b/index.html @@ -6,96 +6,175 @@ + Where work happens | Slack + -
- home_work_happening -

Where Work Happens

-

When your team needs to kick off a project, hire a new employee, deploy some code, review a sales contract, finalize next year's budget, measure an A/B test, plan your next office opening, and more, Slack has you covered.

- -

Already using Slack? Sign in

-
-
-
-

You´re in good company

-

Millions of people around the world have already made Slack the place where their work happens.

- - - - - - - -
-
-

Try it for free

-

Already using Slack? Sign in

- -
-
- + + + - + \ No newline at end of file diff --git a/stylesheets/style.css b/stylesheets/style.css deleted file mode 100644 index cff873eb2..000000000 --- a/stylesheets/style.css +++ /dev/null @@ -1,7 +0,0 @@ -/* -background-grey: #F4F3F4; -button-purple: #192592 -main-titles dark-grey: #2C303F; -paragraph grey: #5b5e6d; -nav grey: #5b5e6d; -*/