From 5ae6dcd5ac8de2157427c3b20da315b59967c5f0 Mon Sep 17 00:00:00 2001 From: thienqui-communistspy Date: Mon, 30 Sep 2019 00:37:20 -0400 Subject: [PATCH 1/4] Finally done --- airbnb/index.html | 47 ++++++++++++++++++++++++++++++ airbnb/styles.css | 58 +++++++++++++++++++++++++++++++++++++- amazon/index.html | 37 ++++++++++++++++++++++++ amazon/styles.css | 39 +++++++++++++++++++++++++ github/index.html | 39 +++++++++++++++++++++++++ github/styles.css | 49 ++++++++++++++++++++++++++++++++ instagram/index.html | 56 ++++++++++++++++++++++++++++++++++++ instagram/styles.css | 34 ++++++++++++++++++++++ stevens-college/index.html | 33 ++++++++++++++++++++++ stevens-college/styles.css | 52 ++++++++++++++++++++++++++++++++++ 10 files changed, 443 insertions(+), 1 deletion(-) diff --git a/airbnb/index.html b/airbnb/index.html index 4884712..ed95e2c 100644 --- a/airbnb/index.html +++ b/airbnb/index.html @@ -1 +1,48 @@ + + + + + + + + +
+ +
+
+

WHERE

+ +
+

CHECK OUT

+

CHECK IN

+
+
+ + +
+

GUESTS

+
+
+
+
+
Search
+
+
+

Explore AirBnB

+ <
+

Home

+ +
+
+

Experiences

+ +
+
+

Restaurants

+ +
+
+ + diff --git a/airbnb/styles.css b/airbnb/styles.css index b9ad8b6..f78ae01 100644 --- a/airbnb/styles.css +++ b/airbnb/styles.css @@ -1 +1,57 @@ -/* Add your CSS here */ +.Head{ + display: flex; +} +.flex1 input{ + width: 100%; +} +.flex1{ + display: flex; +} +.Head h2:last-child{ + padding-left: 800px; +} +.form input{ + width: 100%; +} +.button{ + display: flex; + height: 20px; + width: 100%; + background-color: red; +} +.button div{ + padding-left: 50%; +} +.explore{ + position: relative; + display: flex; + height: 100px; +} +.explore img{ + margin-left: 200px; +} +.explore h2:first-child{ + position: absolute; + margin-bottom: 500px; +} +.explore .one{ + border: 1px solid black; + margin-top: 100px; +} +.explore .two{ + border: 1px solid black; + margin-top: 100px; +} +.explore .three{ + border: 1px solid black; + margin-top: 100px; +} +.explore img{ + height: 100px; + width:100px; + justify-content: space-between; +} +.explore{ + margin-right: 300px; + justify-content: space-between; +} diff --git a/amazon/index.html b/amazon/index.html index 4884712..8128e00 100644 --- a/amazon/index.html +++ b/amazon/index.html @@ -1 +1,38 @@ + + + + + + + + +
+

Computer & Technology Books

+

Browse a wide selection of programming guides, Android resources, and java books

+

Shop By Category

+
+
+
+ +

Programming

+ +

Computer Science

+ +

Programming language

+ +

Network & Cloud Computing

+
+
+ +

Security $ Encryption

+ +

Software

+ +

Operating Systems

+ +

Game & Strategy Guides

+
+
+ + diff --git a/amazon/styles.css b/amazon/styles.css index b9ad8b6..decdc9a 100644 --- a/amazon/styles.css +++ b/amazon/styles.css @@ -1 +1,40 @@ /* Add your CSS here */ +body{ + box-sizing: border-box; +} +.top{ + display: flex; + flex-direction: row; +} +.top img{ + justify-content: center; + height: 100px; +} +.top h2{ + margin-right: 50px; + margin-top: 110px; + color: green; +} +.bottom{ + display: flex; + flex-direction: row; +} +.bottom img{ + height: 100px; +} +.bottom h2{ + justify-content: center; + margin-right: 50px; + margin-top: 110px; + color: green; +} +.header h2:first-child{ + font-size: 30px; + color: gold; +} +.body{ + border-top: 1px solid black; +} +.header p span{ + color: blue; +} diff --git a/github/index.html b/github/index.html index 4884712..d336955 100644 --- a/github/index.html +++ b/github/index.html @@ -1 +1,40 @@ + + + + + + + + +
+

Come help us make collaboration even better

+

At GitHub we build tools that make collaboration and writing + software easier for everyone. We've built a company we truly love + working for, and we think you will too.

+ +
+
+ +

A diverse and inclusive workplace

+

At GitHub we think that a diverse company + is a strong company, and we work hard to foster + a supportive and welcoming workplace. Learn more about our + commitment to diversity and inclusion and see our current demographic +data.

+
+
+ +

Work Happier

+

Build amazing things with autonomy,self-direction, + and a healthy work-life balance. We offer a flexible + work sechdule for all our employees and unlimited PTO. We + also believe that if a job allows for it, you should work whenever + you feel happiest.

+
+ + diff --git a/github/styles.css b/github/styles.css index b9ad8b6..3276fad 100644 --- a/github/styles.css +++ b/github/styles.css @@ -1 +1,50 @@ /* Add your CSS here */ +.P h2{ + font-size: 50px; +} +.P ul{ + list-style-type: none; + display: flex; + justify-content: center; + justify-content: space-evenly; + width: 450px; + margin-left: 300px; + margin-top: 60px; + color: blue; +} +.P1 img{ + width: 200px; + height: 200px; + position: absolute; + bottom: 100px; + left: 100px; +} +.P1 h3{ + position: absolute; + bottom: 260px; + left: 300px; +} +.P1 p{ + position: absolute; + bottom: 170px; + left: 300px; + width: 340px; +} +.P2 img{ + width: 200px; + height: 200px; + position: absolute; + bottom: 100px; + right: 600px; +} +.P2 h3{ + position: absolute; + bottom: 260px; + right: 350px; +} +.P2 p{ + position: absolute; + bottom: 170px; + right: 250px; + width: 340px; +} diff --git a/instagram/index.html b/instagram/index.html index 4884712..6879dcf 100644 --- a/instagram/index.html +++ b/instagram/index.html @@ -1 +1,57 @@ + + + + + + + + +
+

ABOUT US

+

Head of Instagram

+
+

Adam Mosseri(@mosseri) is the Head of Instagram where he oversees all functions of the business including engineering, product and operations. A designer at heart, Adam is known for balancing sharp design thinking with thoughtful product strategy to create experiences that bring people together and encourage authentic communication. + +Adam has been at Facebook for more than ten years. He was design director for Facebook's mobile apps and then moved into product management where he led the News Feed product and engineering teams for many years. He was Head of News Feed prior to joining Instagram where he oversaw product before managing the entire organization. + +Prior to Facebook, Adam worked at TokBox as the company’s first designer. He began his career founding a design consultancy in 2003 with offices in New York and San Francisco that focused on graphic, interaction and exhibition design. Adam holds a BA from the Gallatin School of Interdisciplinary Study at NYU where he studied Information Design and Media. + +Born and raised in New York, he now lives in San Francisco with his wife and two sons.

+
+
+

Founder

+

Kevin Systrom(Co-Founder)

+

Kevin Systrom (@kevin) co-founded Instagram and served as CEO for 8 years before leaving the company in September 2018 to pursue his next passion project. With Kevin’s focus on simplicity and inspiring creativity through solving problems with thoughtful product design, Instagram became the home for innovation on visual storytelling launching dozens of products including Stories and IGTV. + +Prior to founding Instagram, Kevin was part of the startup Odeo, which later became Twitter, and spent two years at Google working on products like Gmail and Google Reader. He graduated from Stanford University with a BS in Management Science & Engineering.

+
+
+

Mike Krieger(Co-Founder)

+

Mike Krieger (@mikeyk) co-founded Instagram and served as Instagram's Head of Engineering for 8 years, before leaving the company in September 2018 to explore new projects. Mike focused on building a broad range of creative products to empower the community on Instagram to connect with their interests and passions. In addition, Mike grew the engineering organization to more than 400 employees in Instagram offices located in Menlo Park, New York and San Francisco. + +A native of São Paulo, Brazil, Mike holds an MS in Symbolic Systems from Stanford University. Prior to founding Instagram, he worked at Meebo as a user experience designer and front-end engineer.

+
+
+
+
About
+
    +
  • Company
    • +
  • Press
    • +
  • Jobs
    • +
+
+
+
Legal
+
    +
  • Terms
    • +
  • Privacy
    • +
  • Platform
    • +
  • Libraries
    • +
+
+
+
+ + + diff --git a/instagram/styles.css b/instagram/styles.css index b9ad8b6..4a83c3d 100644 --- a/instagram/styles.css +++ b/instagram/styles.css @@ -1 +1,35 @@ /* Add your CSS here */ +.legal ul{ + list-style-type: none; + font-size: 20px; +} +.about ul{ + list-style-type: none; + font-size: 20px; +} +.Para{ + position: relative; + padding: 50px; + border: 1px solid black; + width: 50%; + margin-left: 30%; + height: 100%; +} +.side{ + display: flex; + flex-direction: column; + align-items: flex-end; + position: absolute; + padding: 50px; + border: 1px solid black; + width: 70px; + left: -173px; + top: 0px; + height: 87%; +} +.side .about ul li:hover{ + border-left: 10px solid black; +} +.side .legal ul li:hover{ + border-left: 10px solid black; +} diff --git a/stevens-college/index.html b/stevens-college/index.html index 4884712..bb2bb4d 100644 --- a/stevens-college/index.html +++ b/stevens-college/index.html @@ -1 +1,34 @@ + + + + + + + + +
+
+
COMPUTER
+
SOFTWARE
+
ENGINEERING
+
TECHNOLOGY
+
+
+
+ +
+
    +
  • SCHEDULE
    • +
  • FACULTY
    • +
  • TOOL LIST
    • +
+
+

Computers have been a major factor in the development and + operation of the modern industry. From providing means of + communication, to operating machines, to facilitating +international commerce, to system animation, computers and their +software related programs makes things possible.

+
+ + diff --git a/stevens-college/styles.css b/stevens-college/styles.css index b9ad8b6..3dd4279 100644 --- a/stevens-college/styles.css +++ b/stevens-college/styles.css @@ -1 +1,53 @@ /* Add your CSS here */ +.Title{ + font-family: Arial; + font-weight: bold; + display: flex; + justify-content: space-between; +} +img{ + display: flex; + height: 100%; + width: 100%; +} +.Title div{ + color: #0C2C30; +} +.Image{ + display: flex; + height: 500px; + width: 48%; + margin-left: 10px; + justify-content: center; +} +.button{ + display: flex; + list-style-type: none; + margin-left: 80px; + margin-top: 50px; +} +.button li{ + font-family: Arial; + font-size: 15px; + color: #FFFFFF; + display: flex; + display: inline; + border: 1px solid black; + padding-top: 15px; + padding-left: 30px; + padding-right: 30px; + padding-bottom: 15px; + background-color: #A6093D; + margin-right: 20px; +} +.Paragraphs{ + display:flex; +} +.Paragraphs p{ + font-size: 20px; +} +body{ + display: flex; + flex-direction: column; + justify-content: center; +} From 660ea81c1457d78c562abf77409b919bc52ca9de Mon Sep 17 00:00:00 2001 From: thienqui-communistspy Date: Mon, 30 Sep 2019 00:50:36 -0400 Subject: [PATCH 2/4] Changes to AirBnb --- airbnb/index.html | 3 ++- airbnb/styles.css | 18 ++++++++++++++++++ 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/airbnb/index.html b/airbnb/index.html index ed95e2c..50e133a 100644 --- a/airbnb/index.html +++ b/airbnb/index.html @@ -9,6 +9,7 @@
+

Book Unique Homes and Experiences

WHERE

@@ -21,8 +22,8 @@

CHECK IN

-

GUESTS

GUESTS
diff --git a/airbnb/styles.css b/airbnb/styles.css index f78ae01..d73d409 100644 --- a/airbnb/styles.css +++ b/airbnb/styles.css @@ -55,3 +55,21 @@ margin-right: 300px; justify-content: space-between; } +.text h2{ + font-weight: bold; +} +.images{ + display: flex; + position: relative; +} +.images img{ + width: 100%; + height: 300px; +} +.images h2{ + position: absolute; + top: 25%; + left: 25%; + font-size: 50px; + color: white; +} From d9655a420b65a974bdc407aeb80cac57b3be57a1 Mon Sep 17 00:00:00 2001 From: thienqui-communistspy Date: Tue, 1 Oct 2019 14:15:22 -0400 Subject: [PATCH 3/4] Fixed Amazon --- amazon/index.html | 2 +- amazon/styles.css | 43 ++++++++++++++++++++++++++++++++++++------- 2 files changed, 37 insertions(+), 8 deletions(-) diff --git a/amazon/index.html b/amazon/index.html index 8128e00..9d9947e 100644 --- a/amazon/index.html +++ b/amazon/index.html @@ -25,7 +25,7 @@

Network & Cloud Computing

-

Security $ Encryption

+

Security & Encryption

Software

diff --git a/amazon/styles.css b/amazon/styles.css index decdc9a..998d119 100644 --- a/amazon/styles.css +++ b/amazon/styles.css @@ -2,31 +2,60 @@ body{ box-sizing: border-box; } +.private{ + flex-wrap: nowrap; +} .top{ display: flex; flex-direction: row; + margin-bottom: 100px; + margin-top: 50px; } .top img{ + width: 25%; + margin-left: 50px; justify-content: center; - height: 100px; + height: 10%; } .top h2{ - margin-right: 50px; - margin-top: 110px; + font-size: 20px; + white-space: nowrap; + justify-content: space-between; + justify-content: flex-start; + position: relative; + top: 300px; color: green; + right: 170px; +} +.top h2:nth-of-type(2){ + right: 180px; +} +.top h2:nth-of-type(3){ + right: 200px; +} +.top h2:nth-of-type(4){ + right: 200px; } .bottom{ + margin-left: 50px; display: flex; flex-direction: row; } .bottom img{ - height: 100px; + margin-left: 0px; + height: 10%; + width: 25%; } .bottom h2{ - justify-content: center; - margin-right: 50px; - margin-top: 110px; + font-size: 20px; + white-space: nowrap; + bottom: 0px; + position: relative; + margin-bottom: 0px; color: green; + padding-left: 50px; + top: 290px; + right: 230px; } .header h2:first-child{ font-size: 30px; From cbb29b9f933221aa83bbde8d887f58d5f2f32a78 Mon Sep 17 00:00:00 2001 From: thienqui-communistspy Date: Tue, 1 Oct 2019 14:49:15 -0400 Subject: [PATCH 4/4] Fixed up more stuff --- airbnb/index.html | 6 +++--- airbnb/styles.css | 25 ++++++++++++++++++++----- github/styles.css | 12 ++++++------ 3 files changed, 29 insertions(+), 14 deletions(-) diff --git a/airbnb/index.html b/airbnb/index.html index 50e133a..13cd54c 100644 --- a/airbnb/index.html +++ b/airbnb/index.html @@ -22,7 +22,7 @@

CHECK IN

-

GUESTS

@@ -32,8 +32,8 @@

GUESTS

Explore AirBnB

- <
-

Home

+
+

Home

diff --git a/airbnb/styles.css b/airbnb/styles.css index d73d409..db06191 100644 --- a/airbnb/styles.css +++ b/airbnb/styles.css @@ -12,43 +12,55 @@ } .form input{ width: 100%; + height: 50px; } .button{ + margin-top: 50px; display: flex; - height: 20px; + height: 50px; width: 100%; background-color: red; } .button div{ + margin-top: 15px; padding-left: 50%; } .explore{ + display: flex; position: relative; display: flex; height: 100px; } .explore img{ - margin-left: 200px; + margin-right: 200px; } -.explore h2:first-child{ +.explore h2{ position: absolute; + right: 0px; margin-bottom: 500px; } .explore .one{ + position: relative; border: 1px solid black; margin-top: 100px; } +.explore .one h2{ + position: absolute; + right: 0px; +} .explore .two{ + position: relative; border: 1px solid black; margin-top: 100px; } .explore .three{ + position: relative; border: 1px solid black; margin-top: 100px; } .explore img{ - height: 100px; - width:100px; + height: 90px; + width:90px; justify-content: space-between; } .explore{ @@ -73,3 +85,6 @@ font-size: 50px; color: white; } +.text h2{ + font-weight: bold; +} diff --git a/github/styles.css b/github/styles.css index 3276fad..b7f6d39 100644 --- a/github/styles.css +++ b/github/styles.css @@ -17,17 +17,17 @@ height: 200px; position: absolute; bottom: 100px; - left: 100px; + left: 0px; } .P1 h3{ position: absolute; bottom: 260px; - left: 300px; + left: 200px; } .P1 p{ position: absolute; bottom: 170px; - left: 300px; + left: 200px; width: 340px; } .P2 img{ @@ -35,16 +35,16 @@ height: 200px; position: absolute; bottom: 100px; - right: 600px; + right: 800px; } .P2 h3{ position: absolute; bottom: 260px; - right: 350px; + right: 670px; } .P2 p{ position: absolute; bottom: 170px; - right: 250px; + right: 450px; width: 340px; }