From ca53d75d9debfc1839f6237b1ac8432046541b7e Mon Sep 17 00:00:00 2001 From: Micah Godbolt Date: Fri, 15 Feb 2019 16:16:39 -0800 Subject: [PATCH] added js lesson --- step1-00/css-demo/css-demo.html | 2 +- step1-00/html-demo/html-demo.html | 82 +++++++++++++++---------------- step1-00/html-demo/style.css | 13 +++++ step1-00/index.html | 1 + step1-00/js-demo/js-demo.html | 41 ++++++++++++++++ 5 files changed, 95 insertions(+), 44 deletions(-) create mode 100644 step1-00/js-demo/js-demo.html diff --git a/step1-00/css-demo/css-demo.html b/step1-00/css-demo/css-demo.html index 6aed91a..295440c 100644 --- a/step1-00/css-demo/css-demo.html +++ b/step1-00/css-demo/css-demo.html @@ -14,7 +14,7 @@

Our Logo

- fabric logo + fabric logo

Contact Us

diff --git a/step1-00/html-demo/html-demo.html b/step1-00/html-demo/html-demo.html index 25f19ac..356790f 100644 --- a/step1-00/html-demo/html-demo.html +++ b/step1-00/html-demo/html-demo.html @@ -4,17 +4,17 @@ -

Document Meta Data

+

Document Meta Data

head, title, link, style

-

Content Sections

+

Content Sections

@@ -59,34 +59,33 @@
Copyright 2019
+
-

Block Text content

+

Block Text content

-

Blockquote

+

Div

+
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo et quod odio velit, hic qui autem dolores magni earum ducimus dolorem + modi, numquam laborum accusamus adipisci eius excepturi doloremque vero. +
+
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolore voluptatum maiores vitae? Architecto amet provident labore error + officia accusantium reiciendis, vero perspiciatis. Incidunt numquam enim deserunt, velit earum totam veritatis. +
+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium nobis ex optio, minus in, eum ratione magnam aut distinctio, + aliquid libero eaque nihil provident nemo est adipisci repellendus nisi numquam? +
+
-
-

Words can be like X-rays, if you use them properly – they'll go through anything. You read and you're pierced.

-
- - – Aldous Huxley, Brave New World - -

Definition List

-
-
Beast of Bodmin
-
A large feline inhabiting Bodmin Moor.
- -
Morgawr
-
A sea serpent.
- -
Owlman
-
A giant owl-like creature.
-
- -

Figure

-
- Fabric Logo -
The Fabric Logo
-
+

Paragraph

+

+ Lorem ipsum dolor sit amet consectetur, adipisicing elit. Officia, vero! Eum optio veniam nisi, assumenda ea velit in corrupti vel + eos reprehenderit beatae libero rem iusto, maiores, corporis sunt laborum. +

+

+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Reiciendis porro consequuntur exercitationem, perspiciatis nam saepe, odit + enim omnis qui commodi cupiditate in eveniet. Nemo maxime ipsam recusandae consectetur voluptatum non? +

Ordered List

    @@ -102,15 +101,6 @@
  1. items
    2. -

    Paragraph

    -

    - Lorem ipsum dolor sit amet consectetur, adipisicing elit. Officia, vero! Eum optio veniam nisi, assumenda ea velit in corrupti vel - eos reprehenderit beatae libero rem iusto, maiores, corporis sunt laborum. -

    -

    - Lorem ipsum dolor sit, amet consectetur adipisicing elit. Reiciendis porro consequuntur exercitationem, perspiciatis nam saepe, odit - enim omnis qui commodi cupiditate in eveniet. Nemo maxime ipsam recusandae consectetur voluptatum non? -

    Pre

             // This is a pre tag            --           It respects spacing and tabs
@@ -122,20 +112,24 @@
         </ul>
+
-

Inline text elements

+

+ Inline text elements +

Anchor tag, br and span

Website address
- Email
- Phone
+ Email
+ Phone

Inline style tags

b tag em tag i tag sub tag sup tab code tag

+
-

Table content

+

Table content

@@ -155,8 +149,9 @@
+
-

Forms

+

Forms

@@ -224,5 +219,6 @@
+
diff --git a/step1-00/html-demo/style.css b/step1-00/html-demo/style.css index b1a4247..54da6e3 100644 --- a/step1-00/html-demo/style.css +++ b/step1-00/html-demo/style.css @@ -8,3 +8,16 @@ aside { form > div { margin-bottom: 20px; } + +h2 a { + color: #0078d4; + text-decoration: none; +} + +h2 a:hover { + text-decoration: underline; +} + +body { + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; +} diff --git a/step1-00/index.html b/step1-00/index.html index 7764819..8e0bfb1 100644 --- a/step1-00/index.html +++ b/step1-00/index.html @@ -10,6 +10,7 @@
  • HTML Demo
  • CSS Demo
  • CSS Demo Finished
    • +
  • JS Demo
    • diff --git a/step1-00/js-demo/js-demo.html b/step1-00/js-demo/js-demo.html new file mode 100644 index 0000000..ce350c2 --- /dev/null +++ b/step1-00/js-demo/js-demo.html @@ -0,0 +1,41 @@ + + + +
    +

    This is my Title

    +
    +
    +

    Important Links

    + We're Awesome + Learn More + Hire Us +
    +
    +

    Our Logo

    + fabric logo +
    +
    +

    Contact Us

    +
    + + +
    +
    +
    +
    + + +