diff --git a/.sass-cache/7c955074303cf28d294b2fce3b1ca78bfc6a2c40/_layout.scssc b/.sass-cache/7c955074303cf28d294b2fce3b1ca78bfc6a2c40/_layout.scssc new file mode 100644 index 0000000..fc79b41 Binary files /dev/null and b/.sass-cache/7c955074303cf28d294b2fce3b1ca78bfc6a2c40/_layout.scssc differ diff --git a/.sass-cache/7c955074303cf28d294b2fce3b1ca78bfc6a2c40/_manifest.scssc b/.sass-cache/7c955074303cf28d294b2fce3b1ca78bfc6a2c40/_manifest.scssc new file mode 100644 index 0000000..d401d43 Binary files /dev/null and b/.sass-cache/7c955074303cf28d294b2fce3b1ca78bfc6a2c40/_manifest.scssc differ diff --git a/.sass-cache/8cbe6110b96ed4f67c5162df40078c84a27ea51d/_manifest.scssc b/.sass-cache/8cbe6110b96ed4f67c5162df40078c84a27ea51d/_manifest.scssc new file mode 100644 index 0000000..d8bb89f Binary files /dev/null and b/.sass-cache/8cbe6110b96ed4f67c5162df40078c84a27ea51d/_manifest.scssc differ diff --git a/.sass-cache/8cbe6110b96ed4f67c5162df40078c84a27ea51d/_states.scssc b/.sass-cache/8cbe6110b96ed4f67c5162df40078c84a27ea51d/_states.scssc new file mode 100644 index 0000000..addd690 Binary files /dev/null and b/.sass-cache/8cbe6110b96ed4f67c5162df40078c84a27ea51d/_states.scssc differ diff --git a/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_base.scssc b/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_base.scssc new file mode 100644 index 0000000..9dd45b4 Binary files /dev/null and b/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_base.scssc differ diff --git a/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_manifest.scssc b/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_manifest.scssc new file mode 100644 index 0000000..6c606f8 Binary files /dev/null and b/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_manifest.scssc differ diff --git a/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_reset.scssc b/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_reset.scssc new file mode 100644 index 0000000..cd11d9b Binary files /dev/null and b/.sass-cache/c70ab9f3361976df3261c455e5c52ba55c9a7711/_reset.scssc differ diff --git a/.sass-cache/dd5c96f33259bb4bd4253dc4a58bde738867502f/_manifest.scssc b/.sass-cache/dd5c96f33259bb4bd4253dc4a58bde738867502f/_manifest.scssc new file mode 100644 index 0000000..1817d5c Binary files /dev/null and b/.sass-cache/dd5c96f33259bb4bd4253dc4a58bde738867502f/_manifest.scssc differ diff --git a/.sass-cache/dd5c96f33259bb4bd4253dc4a58bde738867502f/_modules.scssc b/.sass-cache/dd5c96f33259bb4bd4253dc4a58bde738867502f/_modules.scssc new file mode 100644 index 0000000..f7d67f1 Binary files /dev/null and b/.sass-cache/dd5c96f33259bb4bd4253dc4a58bde738867502f/_modules.scssc differ diff --git a/.sass-cache/e06ed0e2dee3df070e1b6e748fcc507d75c65ebf/application.scssc b/.sass-cache/e06ed0e2dee3df070e1b6e748fcc507d75c65ebf/application.scssc new file mode 100644 index 0000000..f20c0ae Binary files /dev/null and b/.sass-cache/e06ed0e2dee3df070e1b6e748fcc507d75c65ebf/application.scssc differ diff --git a/README.md b/README.md index e69de29..8b1c697 100644 --- a/README.md +++ b/README.md @@ -0,0 +1,5 @@ +#HTML5 as a Platform + +This project was built to show form styling and validation best practices, as well as playable HTML5 video. + +We chose to theme our mini website with a pet adoption form and a video on how to adopt a pet. diff --git a/adoptionform.html b/adoptionform.html new file mode 100644 index 0000000..78a74c0 --- /dev/null +++ b/adoptionform.html @@ -0,0 +1,120 @@ + + + + + SLU Animal Shelter + + + + + + +
+
+

SLU Animal Shelter

+ +
+
+

Pet Adoption Form

+
+
+ Adopter Information +
    +
  • + + +
    • +
  • + + +
    • +
  • + + +
    • +
+
+
+ Home Information +
    +
  • + + +
    • + + + + +
  • + + +
    • +
+
+
+ Adoption Preferences +
    +
  • + + +
    • +
  • + + +
    • +
  • + + +
    • +
  • + + +
    • +
+
+ +
+
+ +
+ + diff --git a/css/application.css b/css/application.css new file mode 100644 index 0000000..2871dae --- /dev/null +++ b/css/application.css @@ -0,0 +1,165 @@ +body { + margin: 0px auto; + font-family: 'Quicksand', sans-serif; } + +form { + width: 45%; + margin: 0px auto; + font-size: 1.1em; } + +legend { + font-size: 1.5em; } + +input { + border: 1px solid #aaa; + border-radius: 5px; + height: 20px; + width: 220px; + padding: 5px 8px; + margin-top: 10px; + font-size: 1em; } + +label { + width: 150px; + margin-top: 10px; + display: inline-block; + float: left; } + +select { + border: 1px solid #aaa; + background-color: white; + border-radius: 5px; + height: 30px; + width: 220px; + padding: 5px 8px; + margin-top: 10px; + font-size: 1rem; } + +button { + padding: 5px 8px; + border: 3px solid #616060; + background-color: #1f4894; + width: 100%; + height: 60px; + margin-top: 15px; + border-radius: 5px; + font-size: 1.2rem; } + +@media screen and (max-width: 690px) { + .floatRight { + float: none; } + + .contentBox { + padding: 0; } + + img { + width: 100%; } + + .bannerText { + position: static; + display: block; + color: #EEE; + font-size: 3em; + text-align: center; + color: #3333aa; + margin: 1em 0 1em 0; } } +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ +html, body, div, span, +h1, p, +ul, li, +fieldset, form, label, legend, +section, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; } + +/* HTML5 display-role reset for older browsers */ +section { + display: block; } + +body { + line-height: 1; } + +ol, ul { + list-style: none; } + +a { + text-decoration: none; } + +.floatRight { + float: right; } + +.inlineBlock { + display: inline-block; } + +.spanAll { + width: 100%; } + +.headerText { + font-size: 3.2em; + margin-bottom: .5em; } + +.catBackground { + background-image: url(images/catbackground.jpg); + background-size: cover; + background-repeat: no-repeat; } + +.contentBox { + padding-left: 10%; + padding-right: 10%; + padding-top: 4%; + padding-bottom: 4%; + text-align: center; } + +.bannerText { + position: absolute; + left: 10rem; + top: 15rem; + color: #EEE; + font-size: 3em; } + +.centered { + margin: 0px auto; + display: block; } + +.logoFont { + font-family: 'Berkshire Swash', cursive; + font-size: 3.5em; + display: inline-block; } + +.mainHeader { + background-color: #79a0e8; + padding: 2%; } + +.navLinks { + color: #EEE; + font-size: 1.5em; } + +.grayBackground { + background-color: #d5d7db; } + +.blueBackground { + background-color: #1f4894; + color: #EEE; } + +.border { + background-color: #F2F2F2; + border: 3px solid #616060; + padding: 3%; + border-radius: 5px; + margin-top: 5px; } + +.red-alert { + color: red; } + +button:hover { + background-color: rgba(42, 31, 255, 0.8); + cursor: pointer; } + +/*# sourceMappingURL=application.css.map */ diff --git a/css/application.css.map b/css/application.css.map new file mode 100644 index 0000000..be7fcdf --- /dev/null +++ b/css/application.css.map @@ -0,0 +1,7 @@ +{ +"version": 3, +"mappings": "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", +"sources": ["../sass/base/_base.scss","../sass/base/_reset.scss","../sass/layout/_layout.scss","../sass/modules/_modules.scss","../sass/states/_states.scss"], +"names": [], +"file": "application.css" +} \ No newline at end of file diff --git a/css/base.css b/css/base.css new file mode 100644 index 0000000..62b9dc8 --- /dev/null +++ b/css/base.css @@ -0,0 +1,80 @@ +body { + margin: 0px auto; + font-family: 'Quicksand', sans-serif; +} + +form { + width: 45%; + margin: 0px auto; + font-size: 1.1em; +} + +legend { + font-size: 1.5em; +} + +input { + border: 1px solid #aaa; + border-radius: 5px; + height: 20px; + width: 220px; + padding: 5px 8px; + margin-top: 10px; + font-size: 1em; +} + +label { + width: 150px; + margin-top: 10px; + display: inline-block; + float: left; +} + +select { + border: 1px solid #aaa; + background-color: white; + border-radius:5px; + height: 30px; + width: 220px; + padding: 5px 8px; + margin-top: 10px; + font-size: 1rem; +} + +button { + padding: 5px 8px; + border: 3px solid #616060; + background-color: #1f4894; + width: 100%; + height: 60px; + margin-top: 15px; + border-radius: 5px; + font-size: 1.2rem; +} + +@media screen and (max-width: 690px) { + + .floatRight { + float: none; + } + + .contentBox { + padding: 0; + } + + img { + width: 100%; + } + + .bannerText { + position: static; + display: block; + color: #EEE; + font-size: 3em; + text-align: center; + color: #3333aa; + margin: 1em 0 1em 0; + } + +} + diff --git a/css/layout.css b/css/layout.css new file mode 100644 index 0000000..29d278e --- /dev/null +++ b/css/layout.css @@ -0,0 +1,41 @@ +.floatRight { + float: right; +} + +.inlineBlock { + display: inline-block; +} + +.spanAll { + width: 100%; +} + +.headerText { + font-size: 3.2em; + margin-bottom: .5em; +} + +.catBackground { + background-image: url(images/catbackground.jpg); + background-size: cover; + background-repeat: no-repeat; +} +.contentBox { + padding-left: 10%; + padding-right: 10%; + padding-top: 4%; + padding-bottom: 4%; + text-align: center; +} + +.bannerText { + position: absolute; + left: 10rem; + top: 15rem; + color: #EEE; + font-size: 3em; +} +.centered { + margin: 0px auto; + display:block; +} diff --git a/css/modules.css b/css/modules.css new file mode 100644 index 0000000..8a57113 --- /dev/null +++ b/css/modules.css @@ -0,0 +1,35 @@ +.logoFont { + font-family: 'Berkshire Swash', cursive; + font-size: 3.5em; + display: inline-block; +} + +.mainHeader { + background-color: #79a0e8; + padding: 2%; +} +.navLinks { + color: #EEE; + font-size: 1.5em; +} + +.grayBackground { + background-color: #d5d7db; +} + +.blueBackground { + background-color: #1f4894; + color: #EEE; +} + +.border { + background-color: #F2F2F2; + border: 3px solid #616060; + padding: 3%; + border-radius: 5px; + margin-top: 5px; +} + +.red-alert { + color: red; +} diff --git a/css/reset.css b/css/reset.css new file mode 100644 index 0000000..fc72b3b --- /dev/null +++ b/css/reset.css @@ -0,0 +1,32 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, +h1, p, +ul, li, +fieldset, form, label, legend, +section, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} + +a { + text-decoration: none; +} + diff --git a/css/states.css b/css/states.css new file mode 100644 index 0000000..35a9fb1 --- /dev/null +++ b/css/states.css @@ -0,0 +1,4 @@ +button:hover { + background-color: rgba(42, 31, 255, 0.80); + cursor: pointer; +} diff --git a/images/adoptablepet1.jpg b/images/adoptablepet1.jpg new file mode 100644 index 0000000..183423b Binary files /dev/null and b/images/adoptablepet1.jpg differ diff --git a/images/backgroundimage.jpg b/images/backgroundimage.jpg new file mode 100644 index 0000000..55d9c46 Binary files /dev/null and b/images/backgroundimage.jpg differ diff --git a/images/catbackground.jpg b/images/catbackground.jpg new file mode 100644 index 0000000..6f7bb03 Binary files /dev/null and b/images/catbackground.jpg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..fb7d565 --- /dev/null +++ b/index.html @@ -0,0 +1,43 @@ + + + + + SLU Animal Shelter + + + + + + +
+

SLU Animal Shelter

+ +
+
+ +
+

We Need Your Help!

+ +
+
+

Meet the Animals

+ +
+
+

Adoption 101

+ +

Video from Petfinder.com

+
+ +
+ + diff --git a/jquery.js b/jquery.js new file mode 100644 index 0000000..8f3ab42 --- /dev/null +++ b/jquery.js @@ -0,0 +1,22 @@ +// 1. Hide fenced yard option +$("#yardOption").hide(); + +// 2. When user selects "dog", fenced yard option appears +$("#type").on("focusout", function() { + if ($("select option:selected").val() == "dog") { + $("#yardOption").show(); + } +}); + + + +// cat popup +$("#adoptCat").hide(); + +$("#submit").on("click", function(e) { + e.preventDefault(); + if ($("input").val()) { + $("#adoptCat").show(); + } +}); + diff --git a/sass/application.scss b/sass/application.scss new file mode 100644 index 0000000..269af73 --- /dev/null +++ b/sass/application.scss @@ -0,0 +1,4 @@ +@import "base/_manifest.scss"; +@import "layout/_manifest.scss"; +@import "modules/_manifest.scss"; +@import "states/_manifest.scss"; diff --git a/sass/base/_base.scss b/sass/base/_base.scss new file mode 100644 index 0000000..62b9dc8 --- /dev/null +++ b/sass/base/_base.scss @@ -0,0 +1,80 @@ +body { + margin: 0px auto; + font-family: 'Quicksand', sans-serif; +} + +form { + width: 45%; + margin: 0px auto; + font-size: 1.1em; +} + +legend { + font-size: 1.5em; +} + +input { + border: 1px solid #aaa; + border-radius: 5px; + height: 20px; + width: 220px; + padding: 5px 8px; + margin-top: 10px; + font-size: 1em; +} + +label { + width: 150px; + margin-top: 10px; + display: inline-block; + float: left; +} + +select { + border: 1px solid #aaa; + background-color: white; + border-radius:5px; + height: 30px; + width: 220px; + padding: 5px 8px; + margin-top: 10px; + font-size: 1rem; +} + +button { + padding: 5px 8px; + border: 3px solid #616060; + background-color: #1f4894; + width: 100%; + height: 60px; + margin-top: 15px; + border-radius: 5px; + font-size: 1.2rem; +} + +@media screen and (max-width: 690px) { + + .floatRight { + float: none; + } + + .contentBox { + padding: 0; + } + + img { + width: 100%; + } + + .bannerText { + position: static; + display: block; + color: #EEE; + font-size: 3em; + text-align: center; + color: #3333aa; + margin: 1em 0 1em 0; + } + +} + diff --git a/sass/base/_manifest.scss b/sass/base/_manifest.scss new file mode 100644 index 0000000..3215312 --- /dev/null +++ b/sass/base/_manifest.scss @@ -0,0 +1,2 @@ +@import "_base.scss"; +@import "_reset.scss"; diff --git a/sass/base/_reset.scss b/sass/base/_reset.scss new file mode 100644 index 0000000..1d4bf9d --- /dev/null +++ b/sass/base/_reset.scss @@ -0,0 +1,31 @@ +/* http://meyerweb.com/eric/tools/css/reset/ + v2.0 | 20110126 + License: none (public domain) +*/ + +html, body, div, span, +h1, p, +ul, li, +fieldset, form, label, legend, +section, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} + +a { + text-decoration: none; +} diff --git a/sass/layout/_layout.scss b/sass/layout/_layout.scss new file mode 100644 index 0000000..29d278e --- /dev/null +++ b/sass/layout/_layout.scss @@ -0,0 +1,41 @@ +.floatRight { + float: right; +} + +.inlineBlock { + display: inline-block; +} + +.spanAll { + width: 100%; +} + +.headerText { + font-size: 3.2em; + margin-bottom: .5em; +} + +.catBackground { + background-image: url(images/catbackground.jpg); + background-size: cover; + background-repeat: no-repeat; +} +.contentBox { + padding-left: 10%; + padding-right: 10%; + padding-top: 4%; + padding-bottom: 4%; + text-align: center; +} + +.bannerText { + position: absolute; + left: 10rem; + top: 15rem; + color: #EEE; + font-size: 3em; +} +.centered { + margin: 0px auto; + display:block; +} diff --git a/sass/layout/_manifest.scss b/sass/layout/_manifest.scss new file mode 100644 index 0000000..e54aab7 --- /dev/null +++ b/sass/layout/_manifest.scss @@ -0,0 +1 @@ +@import "_layout.scss"; diff --git a/sass/modules/_manifest.scss b/sass/modules/_manifest.scss new file mode 100644 index 0000000..e993b4f --- /dev/null +++ b/sass/modules/_manifest.scss @@ -0,0 +1 @@ +@import "_modules.scss"; diff --git a/sass/modules/_modules.scss b/sass/modules/_modules.scss new file mode 100644 index 0000000..8a57113 --- /dev/null +++ b/sass/modules/_modules.scss @@ -0,0 +1,35 @@ +.logoFont { + font-family: 'Berkshire Swash', cursive; + font-size: 3.5em; + display: inline-block; +} + +.mainHeader { + background-color: #79a0e8; + padding: 2%; +} +.navLinks { + color: #EEE; + font-size: 1.5em; +} + +.grayBackground { + background-color: #d5d7db; +} + +.blueBackground { + background-color: #1f4894; + color: #EEE; +} + +.border { + background-color: #F2F2F2; + border: 3px solid #616060; + padding: 3%; + border-radius: 5px; + margin-top: 5px; +} + +.red-alert { + color: red; +} diff --git a/sass/states/_manifest.scss b/sass/states/_manifest.scss new file mode 100644 index 0000000..b052bd1 --- /dev/null +++ b/sass/states/_manifest.scss @@ -0,0 +1 @@ +@import "_states.scss"; diff --git a/sass/states/_states.scss b/sass/states/_states.scss new file mode 100644 index 0000000..35a9fb1 --- /dev/null +++ b/sass/states/_states.scss @@ -0,0 +1,4 @@ +button:hover { + background-color: rgba(42, 31, 255, 0.80); + cursor: pointer; +}