From 63519fd61b9a2bb989991e0a541ba89db1b442d2 Mon Sep 17 00:00:00 2001 From: Rajashree K Maiya Date: Mon, 11 Jan 2016 16:00:19 -0500 Subject: [PATCH 1/3] completed main.css --- top-nav-drill/index.html | 7 ++-- top-nav-drill/main.css | 76 ++++++++++++++++++++++++++++++++++++++++ 2 files changed, 80 insertions(+), 3 deletions(-) diff --git a/top-nav-drill/index.html b/top-nav-drill/index.html index fbc0cdb..08084bd 100644 --- a/top-nav-drill/index.html +++ b/top-nav-drill/index.html @@ -8,7 +8,7 @@ The Awesome Company - +
@@ -27,9 +27,10 @@

A Page Title

+

A Paragraph

-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum blandit, tellus ornare mollis rhoncus, risus dui tincidunt nisl, nec vulputate sapien neque at tellus. Aenean in ornare nisl, sed porta dui.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum blandit, tellus ornare mollis rhoncus, risus dui tincidunt nisl, nec vulputate sapien neque at tellus. Aenean in ornare nisl, sed porta dui.

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod.

@@ -41,7 +42,7 @@

A Paragraph

A Paragraph

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas non mauris ac erat consequat rhoncus. Mauris nec sapien luctus, rutrum leo sit amet, pretium elit.

- +

Copyright © 2013 Awesome Company LLC.

diff --git a/top-nav-drill/main.css b/top-nav-drill/main.css index 9d37c16..d737111 100644 --- a/top-nav-drill/main.css +++ b/top-nav-drill/main.css @@ -2,4 +2,80 @@ margin: 0 auto; } +section +{ + + width: 60%; + margin: 0 auto; + +} + +section section +{ + + width: 100%; + margin: 0 auto; +} + +h1 +{ + border-bottom: 1px solid grey; + +} + +header +{ + + background-color: black; + height: 45px; +} + +ul +{ + margin-top: 7px; +} +nav +{ + float: right; + margin-right: 25px; +} + +span +{ + text-decoration: none; + font-size: 28px; + color:white; + display: inline-block; + margin-top: 6px; + margin-left: 25px; +} + +li +{ + float:left; + list-style-type: none; +} + +span a +{ + text-decoration: none; + color: white; +} + +nav ul li a +{ + + display: block; + padding: 5px; + color: white; +} + +footer{ + border-top: 1px solid grey; +} + +/*section:nth-child(2):before { + content: "_______________________________"; + color:grey; +}*/ /*Put your code here*/ From e6db8449a4b29419228958aa5d565b38e9b0ba5b Mon Sep 17 00:00:00 2001 From: Rajashree K Maiya Date: Mon, 11 Jan 2016 16:47:41 -0500 Subject: [PATCH 2/3] made cahnges in indentations --- top-nav-drill/index.html | 43 ++++++++++++++++++++++------------------ top-nav-drill/main.css | 23 +++++++-------------- 2 files changed, 31 insertions(+), 35 deletions(-) diff --git a/top-nav-drill/index.html b/top-nav-drill/index.html index 08084bd..ae91e48 100644 --- a/top-nav-drill/index.html +++ b/top-nav-drill/index.html @@ -26,26 +26,31 @@
-

A Page Title

- -
-

A Paragraph

-

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum blandit, tellus ornare mollis rhoncus, risus dui tincidunt nisl, nec vulputate sapien neque at tellus. Aenean in ornare nisl, sed porta dui.

-

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod.

-
-
-

A Paragraph

-

Donec faucibus sodales lectus, quis dictum ligula aliquet sit amet. Nam sodales nibh quis quam dictum sollicitudin. Nullam ut est euismod, hendrerit tellus et, euismod turpis.

-

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod.

-
-
-

A Paragraph

-

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas non mauris ac erat consequat rhoncus. Mauris nec sapien luctus, rutrum leo sit amet, pretium elit.

+

A Page Title

+ +
+

A Paragraph

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum blandit, tellus ornare mollis rhoncus, risus dui tincidunt nisl, nec vulputate sapien neque at tellus. Aenean in ornare nisl, sed porta dui.

+

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod.

+
+ +
+

A Paragraph

+

Donec faucibus sodales lectus, quis dictum ligula aliquet sit amet. Nam sodales nibh quis quam dictum sollicitudin. Nullam ut est euismod, hendrerit tellus et, euismod turpis.

+

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod.

+
+ +
+

A Paragraph

+

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas non mauris ac erat consequat rhoncus. Mauris nec sapien luctus, rutrum leo sit amet, pretium elit.

+
+ +
+

Copyright © 2013 Awesome Company LLC.

+
+
- -
-

Copyright © 2013 Awesome Company LLC.

-
+
diff --git a/top-nav-drill/main.css b/top-nav-drill/main.css index d737111..f67ae70 100644 --- a/top-nav-drill/main.css +++ b/top-nav-drill/main.css @@ -1,18 +1,16 @@ -.container { +.container +{ margin: 0 auto; } section { - width: 60%; margin: 0 auto; - } section section { - width: 100%; margin: 0 auto; } @@ -20,12 +18,10 @@ section section h1 { border-bottom: 1px solid grey; - } header { - background-color: black; height: 45px; } @@ -34,6 +30,7 @@ ul { margin-top: 7px; } + nav { float: right; @@ -52,8 +49,8 @@ span li { - float:left; - list-style-type: none; + float:left; + list-style-type: none; } span a @@ -64,18 +61,12 @@ span a nav ul li a { - display: block; padding: 5px; color: white; } -footer{ +footer +{ border-top: 1px solid grey; } - -/*section:nth-child(2):before { - content: "_______________________________"; - color:grey; -}*/ -/*Put your code here*/ From ce7ce2c91d5e777b205465c3ca1f574ccea7a16d Mon Sep 17 00:00:00 2001 From: Rajashree K Maiya Date: Mon, 18 Jan 2016 11:40:13 -0500 Subject: [PATCH 3/3] Completed Haml and Sass --- .../main.sassc | Bin 0 -> 11116 bytes haml_sass/index.haml | 46 +++++++++++++++ haml_sass/index.html | 55 ++++++++++++++++++ haml_sass/main.css | 45 ++++++++++++++ haml_sass/main.css.map | 7 +++ haml_sass/main.sass | 46 +++++++++++++++ 6 files changed, 199 insertions(+) create mode 100644 haml_sass/.sass-cache/3301e3e8ccd3533e534811c959623982cf9e8c5f/main.sassc create mode 100644 haml_sass/index.haml create mode 100644 haml_sass/index.html create mode 100644 haml_sass/main.css create mode 100644 haml_sass/main.css.map create mode 100644 haml_sass/main.sass diff --git a/haml_sass/.sass-cache/3301e3e8ccd3533e534811c959623982cf9e8c5f/main.sassc b/haml_sass/.sass-cache/3301e3e8ccd3533e534811c959623982cf9e8c5f/main.sassc new file mode 100644 index 0000000000000000000000000000000000000000..3b18448748f396cc8059494910364f6809932752 GIT binary patch literal 11116 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 P;Cl)VMMH`3E@AaQz{9Sm literal 0 HcmV?d00001 diff --git a/haml_sass/index.haml b/haml_sass/index.haml new file mode 100644 index 0000000..68ab970 --- /dev/null +++ b/haml_sass/index.haml @@ -0,0 +1,46 @@ +!!! 5 + +/DON'T change this file! You should be able to complete this challenge by changing the CSS file only. + +%html{:lang => 'en'} + %head + %meta{:charset => 'UTF-8'} + %title The Awesome Company + %link{:href => 'bower_components/normalize-css/normalize.css', :rel => 'stylesheet'} + %link{:href => 'main.css', :rel => 'stylesheet'} + %body + .container + %header + %span + %a{:href => '#'} Awesome Company% + %nav + %ul + %li + %a{:href => '#'} Home + %li + %a{:href => '#'} About + %li + %a{:href => '#'} Services + %li + %a{:href => '#'} Contact + %section + %h1 A Page Title + + %section + %h2 A Paragraph%/h2 + %p Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum blandit, tellus ornare mollis rhoncus, risus dui tincidunt nisl, nec vulputate sapien neque at tellus. Aenean in ornare nisl, sed porta dui. + %p Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapie n. Maecenas consectetur egestas euismod. + + %section + %h2 A Paragraph + %p Donec faucibus sodales lectus, quis dictum ligula aliquet sit amet. Nam sodales nibh quis quam dictum sollicitudin. Nullam ut est euismod, hendrerit tellus et, euismod turpis. + %p Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod. + + %section + %h2 A Paragraph + %p Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas non mauris ac erat consequat rhoncus. Mauris nec sapien luctus, rutrum leo sit amet, pretium elit. + + %footer + %p Copyright © 2013 Awesome Company LLC. + + diff --git a/haml_sass/index.html b/haml_sass/index.html new file mode 100644 index 0000000..ab07544 --- /dev/null +++ b/haml_sass/index.html @@ -0,0 +1,55 @@ + + + + + + The Awesome Company + + + + +
+
+ + Awesome Company% + + +
+
+

A Page Title

+
+

A Paragraph%/h2

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum blandit, tellus ornare mollis rhoncus, risus dui tincidunt nisl, nec vulputate sapien neque at tellus. Aenean in ornare nisl, sed porta dui.

+

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapie n. Maecenas consectetur egestas euismod.

+
+
+

A Paragraph

+

Donec faucibus sodales lectus, quis dictum ligula aliquet sit amet. Nam sodales nibh quis quam dictum sollicitudin. Nullam ut est euismod, hendrerit tellus et, euismod turpis.

+

Nunc sit amet arcu id ligula commodo consequat vel a lorem. Proin auctor, purus in dictum efficitur, mauris purus dictum augue, vitae laoreet ante nunc in sapien. Maecenas consectetur egestas euismod.

+
+
+

A Paragraph

+

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas non mauris ac erat consequat rhoncus. Mauris nec sapien luctus, rutrum leo sit amet, pretium elit.

+
+ +
+
+ + diff --git a/haml_sass/main.css b/haml_sass/main.css new file mode 100644 index 0000000..1188d82 --- /dev/null +++ b/haml_sass/main.css @@ -0,0 +1,45 @@ +.container { + margin: 0 auto; } + +section { + width: 60%; + margin: 0 auto; } + section section { + width: 100%; + margin: 0 auto; } + +h1 { + border-bottom: 1px solid grey; } + +header { + background-color: black; + height: 45px; } + +ul { + margin-top: 7px; } + +nav { + float: right; + margin-right: 25px; } + nav ul li a { + display: block; + padding: 5px; + color: white; } + +span { + text-decoration: none; + font-size: 28px; + display: inline-block; + margin-top: 6px; + margin-left: 25px; } + span a { + text-decoration: none; + color: white; } + +li { + list-style-type: none; } + +footer { + border-top: 1px solid grey; } + +/*# sourceMappingURL=main.css.map */ diff --git a/haml_sass/main.css.map b/haml_sass/main.css.map new file mode 100644 index 0000000..2649c42 --- /dev/null +++ b/haml_sass/main.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "AAAA,UAAU;EACR,MAAM,EAAE,MAAM;;AAEhB,OAAO;EACL,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,MAAM;EACd,eAAO;IACL,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,MAAM;;AAElB,EAAE;EACA,aAAa,EAAE,cAAc;;AAE/B,MAAM;EACJ,gBAAgB,EAAE,KAAK;EACvB,MAAM,EAAE,IAAI;;AAEd,EAAE;EACA,UAAU,EAAE,GAAG;;AAEjB,GAAG;EACD,KAAK,EAAE,KAAK;EACZ,YAAY,EAAE,IAAI;EAClB,WAAO;IACL,OAAO,EAAE,KAAK;IACd,OAAO,EAAE,GAAG;IACZ,KAAK,EAAE,KAAK;;AAEhB,IAAI;EACF,eAAe,EAAE,IAAI;EACrB,SAAS,EAAE,IAAI;EAEf,OAAO,EAAE,YAAY;EACrB,UAAU,EAAE,GAAG;EACf,WAAW,EAAE,IAAI;EACjB,MAAC;IACC,eAAe,EAAE,IAAI;IACrB,KAAK,EAAE,KAAK;;AAGhB,EAAE;EAEA,eAAe,EAAE,IAAI;;AAEvB,MAAM;EACJ,UAAU,EAAE,cAAc", +"sources": ["main.sass"], +"names": [], +"file": "main.css" +} diff --git a/haml_sass/main.sass b/haml_sass/main.sass new file mode 100644 index 0000000..811ee16 --- /dev/null +++ b/haml_sass/main.sass @@ -0,0 +1,46 @@ +.container + margin: 0 auto + +section + width: 60% + margin: 0 auto + section + width: 100% + margin: 0 auto + +h1 + border-bottom: 1px solid grey + +header + background-color: black + height: 45px + +ul + margin-top: 7px + +nav + float: right + margin-right: 25px + ul li a + display: block + padding: 5px + color: white + +span + text-decoration: none + font-size: 28px + color:white + display: inline-block + margin-top: 6px + margin-left: 25px + a + text-decoration: none + color: white + + +li + float:left + list-style-type: none + +footer + border-top: 1px solid grey \ No newline at end of file