diff --git a/Monica-Henok/IndexBem.html b/Monica-Henok/IndexBem.html new file mode 100644 index 0000000..9b518fe --- /dev/null +++ b/Monica-Henok/IndexBem.html @@ -0,0 +1,78 @@ + + + + Marissa and Loann + + + + + +
+ +
+
+

Main Introduction

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas in mi urna. Phasellus rhoncus tempor velit, vitae finibus felis. Vestibulum tempor justo ante, a tincidunt purus dignissim eu. Quisque maximus ut lorem suscipit molestie. Nullam interdum ante et maximus varius. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin interdum tellus tortor, sit amet placerat lectus gravida quis.

+
+
+

Programs

+
+

Sample Header

+

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas in mi urna. Phasellus rhoncus tempor velit, vitae finibus felis. Vestibulum tempor justo ante, a tincidunt purus dignissim eu.

+
+
+

Sample Header

+

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas in mi urna. Phasellus rhoncus tempor velit, vitae finibus felis. Vestibulum tempor justo ante, a tincidunt purus dignissim eu.

+
+
+

Sample Header

+

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas in mi urna. Phasellus rhoncus tempor velit, vitae finibus felis. Vestibulum tempor justo ante, a tincidunt purus dignissim eu.

+
+
+
+

Sign up to receive more information

+ + + +
+
+

feature and Speakers

+
+ +

Professor Name

+

Professor Title and Department

+
+
+ +

Professor Name

+

Professor Title and Department

+
+
+ +

Professor Name

+

Professor Title and Department

+
+
+ +

Professor Name

+

Professor Title and Department

+
+
+ + diff --git a/Monica-Henok/README.md b/Monica-Henok/README.md new file mode 100644 index 0000000..4c3c59b --- /dev/null +++ b/Monica-Henok/README.md @@ -0,0 +1,15 @@ +# Refractor Another Team's CSS + +##Overview + +-We repaired the image tag for col 1_of_4 +-Changed the navigation from white to black (so that it appears on screen) +-Got rid of the main link on the nav bar +-Removed blue, yellow and green classes +-Got rid of height parameters dept 1-3 and main tags +-Switched

tags to

(there were multiple

tags on the HTML) +-On dept. we added margin 0 auto to center +-Condensed CSS + +###Collaborators +Henok and Monica refractored this assignment \ No newline at end of file diff --git a/Monica-Henok/css/.DS_Store b/Monica-Henok/css/.DS_Store new file mode 100644 index 0000000..040fd5e Binary files /dev/null and b/Monica-Henok/css/.DS_Store differ diff --git a/Monica-Henok/css/bem.css b/Monica-Henok/css/bem.css new file mode 100644 index 0000000..97e39ab --- /dev/null +++ b/Monica-Henok/css/bem.css @@ -0,0 +1,221 @@ +* { + -moz-box-sizing: border-box; /* Firefox 1, probably can drop this */ + -webkit-box-sizing: border-box; /* Safari 3-4, also probably droppable */ + box-sizing: border-box; /* Everything else */ +} + +body { + font-size: 1em; +} +/* nav */ +nav { + width:100%; + height: 3em; + padding:5% 0; + text-align: center; +} + +nav .item { + display: inline-block; +} + +nav .link { + color: black; + margin:0 1em; + font-size: 1.5em; + text-decoration: none; +} +/* main intro */ +.main { + background-color:MediumOrchid; + padding:5% 0; + text-align:center; +} + +.main__header { + color:white; + font-size: 5em; + width:100%; +} + +.intro { + color:white; + font-size: 1em; + line-height: 1.5em; + width:600px; + margin:auto; +} + +.dept { + margin: 0 auto; + display: inline-block; + width:100%; + text-align:center; +} + +.dept__header { + text-align: center; + margin:3% 0; + text-transform: uppercase; + font-size: 1.25em; + color:gray; +} + +.deptOne { + padding:3%; + display: inline-block; + background-color: SkyBlue; +} + +.deptOne__header { + color:white; + font-size:1.1em; +} + +.deptOne__date { + color:white; + font-size: 1em; + line-height: 2em; +} + +.deptOne__info { + color:white; + line-height: 1em; +} + +.deptTwo { + padding:3%; + display: inline-block; + background-color: LemonChiffon; +} + +.deptTwo__header { + color:gray; + font-size:1.1em; +} + +.deptTwo__date { + color:gray; + font-size: 1em; + line-height: 2em; +} + +.deptTwo__info { + color:gray; + line-height: 1em; +} + +.deptThree { + padding:3%; + display: inline-block; + background-color: MediumSeaGreen; +} + +.deptThree__header { + color:white; + font-size:1.1em; +} + +.deptThree__date{ + color:white; + font-size: 1em; + line-height: 2em; +} + +.deptThree__info { + color:white; + line-height: 1em; +} +/* form section */ +.sign-up { + text-align: center; + display: block; + font-size: 1.25em; + cursor:pointer; + height:60px; + margin:10% 0; +} + +.sign-up__field { + margin-top:20px; + width:275px; + height:35px; + padding:2px; +} +/* feature section */ +.feature { + text-align: center; + display: block; + width:100%; +} + +.feature__title { + text-align: center; + margin:3% 0; + text-transform: uppercase; + font-size: 1.25em; + width:100%; +} + +.feature__header { + margin-top:3px; + color:gray; + line-height: 1.5em; +} + +.feature__info { + color:gray; +} + +.feature__one { + display: inline-block; + padding:1%; +} + +.feature__two { + display: inline-block; + padding:1%; +} + +.feature__three { + height:450px; + display: inline-block; + padding:1%; +} + +.feature__four { + height:450px; + display: inline-block; + padding:1%; +} + +/*Grids*/ +.col_1_of_3 { + width: 25.25%; +} + +.col_1_of_4 { + width: 21%; +} + +/*GO FULL WIDTH AT LESS THAN 480 PIXELS */ + +@media only screen and (max-width: 480px) { +.col_3_of_3 { + width: 100%; +} + +.col_1_of_3 { + width: 100%; + } +} + +@media only screen and (max-width: 480px) { + +.col_4_of_4 { + width: 100%; + } +.col_1_of_4 { + width: 100%; + } +} diff --git a/Monica-Henok/css/reset.css b/Monica-Henok/css/reset.css new file mode 100755 index 0000000..af94440 --- /dev/null +++ b/Monica-Henok/css/reset.css @@ -0,0 +1,48 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} \ No newline at end of file diff --git a/Monica-Henok/img/profile.jpg b/Monica-Henok/img/profile.jpg new file mode 100644 index 0000000..0aa404e Binary files /dev/null and b/Monica-Henok/img/profile.jpg differ