From 93a99490e74bcf73c41c461f4824cad028f31f2e Mon Sep 17 00:00:00 2001 From: "Brian P. Gallagher" Date: Sun, 27 May 2018 22:00:27 -0400 Subject: [PATCH 1/2] finished home and about pages --- README.md | 4 - aboutpage/README.txt | 4 + aboutpage/css/style.css | 133 ++++++++++++++++++++ aboutpage/index.html | 260 ++++++++++++++++++++++++++++++++++++++++ aboutpage/license.txt | 16 +++ hompage/README.txt | 4 + hompage/css/style.css | 111 +++++++++++++++++ hompage/index.html | 231 +++++++++++++++++++++++++++++++++++ hompage/license.txt | 16 +++ 9 files changed, 775 insertions(+), 4 deletions(-) delete mode 100644 README.md create mode 100644 aboutpage/README.txt create mode 100644 aboutpage/css/style.css create mode 100644 aboutpage/index.html create mode 100644 aboutpage/license.txt create mode 100644 hompage/README.txt create mode 100644 hompage/css/style.css create mode 100644 hompage/index.html create mode 100644 hompage/license.txt diff --git a/README.md b/README.md deleted file mode 100644 index d0b411b..0000000 --- a/README.md +++ /dev/null @@ -1,4 +0,0 @@ -prep_facebook_pages -=================== - -[This is an HTML and CSS project from the Viking Code School Prep Work](http://www.vikingcodeschool.com/web-markup-and-coding/let-s-build-facebook). diff --git a/aboutpage/README.txt b/aboutpage/README.txt new file mode 100644 index 0000000..bc46e0c --- /dev/null +++ b/aboutpage/README.txt @@ -0,0 +1,4 @@ +A Pen created at CodePen.io. You can find this one at https://codepen.io/bpgallagher/pen/RyzJwZ. + + http://prismjs.com +https://johnresig.com/projects/javascript-diff-algorithm/ \ No newline at end of file diff --git a/aboutpage/css/style.css b/aboutpage/css/style.css new file mode 100644 index 0000000..ce6945a --- /dev/null +++ b/aboutpage/css/style.css @@ -0,0 +1,133 @@ +header { + width: 110%; + height: ; + margin-left: 0; + padding: 10px; + background-color: #3b5998; + border-radius: 0px; + border: solid; +} +.logo { + background: #3b5998; + color: white; + line-height: 20px; + font-size: 20px; +} +.searchbox { + background: #3b5998; + line-height: 20px; +} +.userfirstname { + background: #3b5998; + color: white; +} +aside, footer, header, article { + min-height: 40px; + border: 1px solid black; + float: left; + padding: 15px; + margin-bottom: 0px; + box-sizing: border-box; } + +aside { + height: 500px; + width: 15%; + float: left; + background-color: pink; + position: relative; + text-align: center; + } + aside > div { + width=100%; + padding: 15px; + line-height: 36px; + box-sizing: border-box; + } + aside img { + width: 75px; + height: 75px; + border: 2px solid blue; + } + @media screen and (max-width: 890px) { + aside { display: none; } } + + +main { + width: 84%; + float: right; } + +main header { + background-color: #3b5998; + color: white; +} + +main footer { + background-color: #3b5998; + color: white; + padding: 5px; + font: auto; +} + +main header, main footer { + clear: both; + width: 100%; + height: auto; +} + +@media screen and (min-width: 890px) { + main header, main footer { + border-radius: 0px; } } + +@media screen and (max-width: 890px) {main { width: 100%}} + +article { + clear: both; + width: 100%; + margin: 0%; + background-color: white; } + @media screen and (max-width: 890px) {article { width: 100%; }} + +img { + width: 100%; + height: 300px; + margin: 0%; + } + +.btn-group .button { + background-color: white; /* Green */ + border: 1px solid grey; + color: #3b5998; + padding: 15px 32px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 14px; + cursor: pointer; + float: left; + width: 16.66% +} +.btn-group .button:not(:last-child) { + border-right: none; /* Prevent double borders */ +} +.btn-group .button:hover { + background-color: #3b5998; + color: white; +} +.w3-cell-row { + line-height: 1.6; +} +.BasicData li { + line-height: 1.6; +} +.ContactInfo li { + line-height: 1.6; +} + +.vertical-align { + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + diff --git a/aboutpage/index.html b/aboutpage/index.html new file mode 100644 index 0000000..451340c --- /dev/null +++ b/aboutpage/index.html @@ -0,0 +1,260 @@ + + + + + + #CodePenChallenge - VikingBlog + + + + + + + + + + + + + + + + + + + + + + Viking Micro Blog + + + + + + + +
+
+ +
+ +
+

+
+
+

Brian

+
+
+ +
+ +
+ + +
+ +
+
+ Lights + + +
+
+ + + + + + +
+
+ +
+
+
+
    +

  • Basic Information

    • +
  • Birthday: July 31, 1980
    • +
  • College: Hogwarts College
    • +
  • Hometown: Godrick's Hollow, England
    • +
  • Current City: Godrick's Hollow, England
    • +
+
    +

  • Contact Information

    • +
  • Email: harry.potter@hogwarts.edu
    • +
  • Telephone: 555-123-4567
    • +
+
+ +
+

Words to Live By

+

Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.

+

About Me

+

Lorem ipsum Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

+
+
+ +
+
+ +
+

This copyrighted telecast is presented by authority of the Office of the Commissioner of Blogging. It may not be reproduced or retransmitted in any form, and the accounts and descriptions of this game may not be disseminated without express written consent.

+
+ +
+
+ + + + + + + + + + + diff --git a/aboutpage/license.txt b/aboutpage/license.txt new file mode 100644 index 0000000..363a6db --- /dev/null +++ b/aboutpage/license.txt @@ -0,0 +1,16 @@ + + + diff --git a/hompage/README.txt b/hompage/README.txt new file mode 100644 index 0000000..61fce3e --- /dev/null +++ b/hompage/README.txt @@ -0,0 +1,4 @@ +A Pen created at CodePen.io. You can find this one at https://codepen.io/bpgallagher/pen/JvawVP. + + http://prismjs.com +https://johnresig.com/projects/javascript-diff-algorithm/ \ No newline at end of file diff --git a/hompage/css/style.css b/hompage/css/style.css new file mode 100644 index 0000000..e69097e --- /dev/null +++ b/hompage/css/style.css @@ -0,0 +1,111 @@ + + diff --git a/hompage/index.html b/hompage/index.html new file mode 100644 index 0000000..c1022f5 --- /dev/null +++ b/hompage/index.html @@ -0,0 +1,231 @@ + + + + + + Viking homepage build project + + + + + + + + + + + + + + + + + + + +W3.CSS + + + + + + +
+
+ + +
+ +
+ +
+
+
+ + + + + +
+
+
+ +
+ + + +
+ + + + + +
+

Connect with all your friends!

+
    +
  • See photos and updates on your news feed.
    • +
  • Post your status for the world to see from your profile.
    • +
  • Get in touch with your friends by friending them.
    • +
  • Like things because you're a positive person!
    • +
+
+ + + +
+ + + + + + + + + + + + diff --git a/hompage/license.txt b/hompage/license.txt new file mode 100644 index 0000000..a80dc8b --- /dev/null +++ b/hompage/license.txt @@ -0,0 +1,16 @@ + + + From c423a4c81fe385fb8ffa347e7272081ca30ff49a Mon Sep 17 00:00:00 2001 From: "Brian P. Gallagher" Date: Mon, 28 May 2018 23:52:36 -0400 Subject: [PATCH 2/2] Sasst CSS added --- aboutpage/README.txt => README.txt | 0 aboutpage/index.html => aboutpage.html | 7 +++---- aboutpage/css/style.css => css/aboutpage.css | 0 hompage/css/style.css => css/homepage.css | 0 hompage/README.txt | 4 ---- hompage/license.txt | 16 ---------------- hompage/index.html => index.html | 9 ++++----- aboutpage/license.txt => license.txt | 0 sass/_colors.scss | 6 ++++++ sass/styles.scss | 3 +++ 10 files changed, 16 insertions(+), 29 deletions(-) rename aboutpage/README.txt => README.txt (100%) rename aboutpage/index.html => aboutpage.html (95%) rename aboutpage/css/style.css => css/aboutpage.css (100%) rename hompage/css/style.css => css/homepage.css (100%) delete mode 100644 hompage/README.txt delete mode 100644 hompage/license.txt rename hompage/index.html => index.html (93%) rename aboutpage/license.txt => license.txt (100%) create mode 100644 sass/_colors.scss create mode 100644 sass/styles.scss diff --git a/aboutpage/README.txt b/README.txt similarity index 100% rename from aboutpage/README.txt rename to README.txt diff --git a/aboutpage/index.html b/aboutpage.html similarity index 95% rename from aboutpage/index.html rename to aboutpage.html index 451340c..64fb0ce 100644 --- a/aboutpage/index.html +++ b/aboutpage.html @@ -4,11 +4,10 @@ #CodePenChallenge - VikingBlog - - - - + + + diff --git a/sass/styles.scss b/sass/styles.scss new file mode 100644 index 0000000..0c79fc8 --- /dev/null +++ b/sass/styles.scss @@ -0,0 +1,3 @@ +// styles.scss + +@import 'colors';