diff --git a/background1.jpg b/background1.jpg new file mode 100644 index 0000000..5cd10ba Binary files /dev/null and b/background1.jpg differ diff --git a/case1/mi_pricing_txt.html b/case1/mi_pricing.html similarity index 50% rename from case1/mi_pricing_txt.html rename to case1/mi_pricing.html index 127737d..1d537d7 100644 --- a/case1/mi_pricing_txt.html +++ b/case1/mi_pricing.html @@ -7,8 +7,8 @@ Case Problem 1 Marlin Internet Pricing - Author: - Date: + Author: Jeremy Snider and Austin Andrews + Date: 11/26/18 Filename: mi_pricing.html @@ -18,7 +18,8 @@ Marlin Internet - + + @@ -46,7 +47,71 @@

Accelerate with No Speed Traps

We provide more than fast access. Take advantage of our 24/7 customer support (personal help is always on the line), free security tools, email accounts for the whole family, and exclusive online content.

- + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
select a planStarterPrimePrime PlusUltra
$19.95
per month		$29.95
per month		$49.95
per month		$69.95
per month
SummaryJust the speed you need to send emails, download map directions, and search the Internet for restaurant reviews.A great speed at a great price for the family: kids can play games, adults can pay bills, and everyone can surf at the same time.Super speeds for multiple tasks that require more broadband capacity; ideal for gamers who need fast response times.Perfect for a small business running multiple media streams, demanding reduced lag time and fast data delivery.
Download Speed3 Mbps15 Mbps25 Mbps50 Mbps
Upload Speed512 Kbps6 Mbps10 Mbps20 Mbps
Cloud Storage2 GB5 GB15 GB40 GB
E-mail Accounts2 Accounts3 Accounts5 Accounts10 Accounts
24/7 SupportYesYesYesYes
@@ -77,4 +142,4 @@

Accelerate with No Speed Traps

- \ No newline at end of file + diff --git a/case1/mi_tables.css b/case1/mi_tables.css new file mode 100644 index 0000000..a63577d --- /dev/null +++ b/case1/mi_tables.css @@ -0,0 +1,70 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS + Tutorial 6 + Case Problem 1 + + Tables Style Sheet + Author: Jeremy Snider and Austin Andrews + Date: 11/26/18 + + Filename: mi_tables.css + +*/ + +/* Table Styles */ +table.pricing { + background-image: linear-gradient(to bottom, rgb(190, 215, 255), black); + border: 5px solid gray; +} + +table th, table td{ + border: 3px solid gray; + line-height: 1.4em; + padding: 8px; +} +th { + background-color: black; + color: rgb(130, 210, 255); + font-weight: normal; +} + +td { + color: white; + font-size: 0.9em; + vertical-align: top; +} +/* Column Styles */ + + col#firstCol { + width: 24%; + } + + col#dataCols { + width: 19%; + } + +/* Table Header Styles */ + + +thead tr { + height: 60px; +} + +thead tr:first-of-type th:first-of-type { + font-size: 2em; +} + +thead tr:first-of-type th:not(:first-of-type) { + background-color: transparent; + color: white; +} + + + + + + + + diff --git a/case1/mi_tables_txt.css b/case1/mi_tables_txt.css deleted file mode 100644 index db9e6bc..0000000 --- a/case1/mi_tables_txt.css +++ /dev/null @@ -1,35 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML and CSS - Tutorial 6 - Case Problem 1 - - Tables Style Sheet - Author: - Date: - - Filename: mi_tables.css - -*/ - -/* Table Styles */ - - - -/* Column Styles */ - - - -/* Table Header Styles */ - - - - - - - - - - - diff --git a/case2/jpf_sudoku.css b/case2/jpf_sudoku.css new file mode 100644 index 0000000..3dca45c --- /dev/null +++ b/case2/jpf_sudoku.css @@ -0,0 +1,56 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML5 and CSS3, 7th Edition + Tutorial 6 + Case Problem 2 + + Sudoku Style Sheet + Author: Jeremy Snider and Austin Andrews + Date: 11/26/18 + Filename: jpf_sudoku.css + +*/ + +/* Table Styles */ +table.spuzzle { + border-collapse: collapse; + margin-top: 0px; + margin-bottom: 0px; + margin-left: auto; + margin-right: auto; + width: 90%; +} + +table.spuzzle td { + border: 5px outset gray; + width: 33.3%; +} + +table.spuzzle th { + color: gray; + padding-right: 10px; + padding-bottom: 10px; +} + +/* Inner Table Styles */ +table.subTable { + border-collapse: collapse; + width: 100%; +} + +table.subTable td { + box-shadow: inset 0px 0px 15px; + border: 1px solid black; + color: blue; + height: 40px; + text-align: center; +} + +td.goldBox { + background-color: rgb(228, 199, 42); +} + +td.greenBox { + background-color: rgb(203, 229, 130); +} diff --git a/case2/jpf_sudoku.html b/case2/jpf_sudoku.html new file mode 100644 index 0000000..60cc454 --- /dev/null +++ b/case2/jpf_sudoku.html @@ -0,0 +1,310 @@ + + + + + + + + The Sudoku Puzzle + + + + + + +
+ Japanese Puzzle Factory + +
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Sudoku
123456789
A + + + + + + + + + + + + + + + + +
35
+ 		+ + + + + + + + + + + + + + + + +
53
+ 		+ + + + + + + + + + + + + + + + +
7
31
2
+
B
C
D + + + + + + + + + + + + + + + + +
69
472
+ 		+ + + + + + + + + + + + + + + + +
2
9
+ 		+ + + + + + + + + + + + + + + + +
937
48
+
E
F
G + + + + + + + + + + + + + + + + +
1
45
6
+ 		+ + + + + + + + + + + + + + + + +
81
+ 		+ + + + + + + + + + + + + + + + +
52
7
+
H
I
+
+ +
+

To Play

+

Sudoku is played on a 9x9 grid with nine 3x3 boxes + placed within the grid. Enter a digit from 1 to 9 in + each table cell. A few starting numbers have been + supplied for you. The digits from 1 to 9 can appear + only once each in every row, column, and box in the + table (diagonals don't count). Every Sudoku puzzle + has a unique solution. +

+

Good luck!

+
+ + + + + diff --git a/case2/jpf_sudoku_txt.css b/case2/jpf_sudoku_txt.css deleted file mode 100644 index 758307c..0000000 --- a/case2/jpf_sudoku_txt.css +++ /dev/null @@ -1,22 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML5 and CSS3, 7th Edition - Tutorial 6 - Case Problem 2 - - Sudoku Style Sheet - Author: - Date: - - Filename: jpf_sudoku.css - -*/ - -/* Table Styles */ - - - -/* Inner Table Styles */ - - diff --git a/case2/jpf_sudoku_txt.html b/case2/jpf_sudoku_txt.html deleted file mode 100644 index fb6b192..0000000 --- a/case2/jpf_sudoku_txt.html +++ /dev/null @@ -1,90 +0,0 @@ - - - - - - - - The Sudoku Puzzle - - - - - -
- Japanese Puzzle Factory - -
- -
-
- -
-

To Play

-

Sudoku is played on a 9x9 grid with nine 3x3 boxes - placed within the grid. Enter a digit from 1 to 9 in - each table cell. A few starting numbers have been - supplied for you. The digits from 1 to 9 can appear - only once each in every row, column, and box in the - table (diagonals don't count). Every Sudoku puzzle - has a unique solution. -

-

Good luck!

-
- - - - - \ No newline at end of file diff --git a/case3/lht_columns.css b/case3/lht_columns.css new file mode 100644 index 0000000..8188f84 --- /dev/null +++ b/case3/lht_columns.css @@ -0,0 +1,39 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS, 7th Edition + Tutorial 6 + Case Problem 3 + + Columns Style Sheet + Author: Jeremy Snider Austin Andrews + Date: November 27th 2018 + + Filename: lht_columns.css + +*/ + + + +/* Column Styles */ + +article { + -moz-column-width: 260px; + -webkit-column-width: 260px; + column-width: 260px; + + -moz-column-gap: 20px; + -webkit-column-gap: 20px; + column-gap: 20px; + + -moz-column-rule: 1px solid rgb(154, 64, 31); + -webkit-column-rule: 1px solid rgb(154, 64, 31); + column-rule: 1px solid rgb(154, 64, 31); + + widows: 2; + orphans: 2; +} + +article h1 { + column-span: all; +} diff --git a/case3/lht_columns_txt.css b/case3/lht_columns_txt.css deleted file mode 100644 index 0849ed0..0000000 --- a/case3/lht_columns_txt.css +++ /dev/null @@ -1,19 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML and CSS, 7th Edition - Tutorial 6 - Case Problem 3 - - Columns Style Sheet - Author: - Date: - - Filename: lht_columns.css - -*/ - - - -/* Column Styles */ - diff --git a/case3/lht_feb.html b/case3/lht_feb.html new file mode 100644 index 0000000..26f0d64 --- /dev/null +++ b/case3/lht_feb.html @@ -0,0 +1,418 @@ + + + + + + + + Lyman Hall Theater in February + + + + + + + +
+ The Lyman Hall Theater + +
+ +
+

Coming Up at the Lyman Hall Theater

+

February will be another banner month at the Lyman Hall + Theatre with three performances of the Tony Award winning + musical, West Side Story by the Broadway Touring Company. + Tickets are going fast, so order yours today. +

+ +

Celebrate Valentine's Day with the Chamberlain Symphony and + their special selection of classical music for lovers. Later that + week, exercise your mind by attending the Charles Dickens classic, + The Mystery of Edwin Drood. Can you solve Dickens' + unfinished mystery? +

+ +

Jazz lovers have a lot to celebrate in February with a visit + from the Jazz Masters on February 21st, and then on February + 24th, enjoy the music of The Duke with an Ellington Tribute + performed by the Jazz Company of Kansas City. +

+ +

Pins, bottles, plates, and chairs are flying at the Chamberlain + Civic Center in February. The Taiwan Acrobats return on + February 2nd with another amazing performance. We close out the + month with a visit from the Madtown Jugglers and their unique + blend of comedy, juggling, and madness. +

+ +

Enjoy a classical brunch every Sunday in February with music + provided by the Carson Quartet. Seating is limited, so please order + your table in advance. +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
February 2018 Calendar +
SunMonTueWedThuFriSat
+

28

+
+
Carson Qurtet
+
1 pm
+
$12
+
+ 		+

29

+
+
Harlem Choir
+
6pm
+
$18/$24/$32
+
+ 		+

30

+
+
+
+
+
+ 		+

31

+
+
+
+
+
+ 		+

1

+
+
+
+
+
+ 		+

2

+
+
Taiwan Acrobats
+
8 pm
+
$24/$32/$48
+
+ 		+

3

+
+
Joey Gallaway
+
8 pm
+
$24/$32/$48
+
+
+

4

+
+
Carson Qurtet
+
1 pm
+
$12
+
+ 		+

5

+
+
+
+
+
+ 		+

6

+
+
Ralph Williams
+
8 pm
+
$24/$32/$48
+
+ 		+

7

+
+
+
+
+
+ 		+

8

+
+
West Side Story
+
7pm
+
$36/$48/$64
+
+ 		+

9

+
+
West Side Story
+
7 pm
+
$36/$48/$64
+
+ 		+

10

+
+
West Side Story
+
7 pm
+
$36/$48/$64
+
+
+

11

+
+
Carson Qurtet
+
1 pm
+
$12
+
+ 		+

12

+
+
+
+
+
+ 		+

13

+
+
+
+
+
+ 		+

14

+
+
Chamberlain Symphony
+
8 pm
+
$18/$24/$32
+
+ 		+

15

+
+
+
+
+
+ 		+

16

+
+
Edwin Drood
+
8 pm
+
$36/$48/$58
+
+ 		+

17

+
+
Edwin Drood
+
8 pm
+
$36/$48/$58
+
+
+

18

+
+
Carson Qurtet
+
1 pm
+
$12
+
+ 		+

19

+
+
+
+
+
+ 		+

20

+
+
+
+
+
+ 		+

21

+
+
Jazz Masters
+
8 pm
+
$18/$24/$32
+
+ 		+

22

+
+
+
+
+
+ 		+

23

+
+
The Yearling
+
7 pm
+
$12/$18/$24
+
+ 		+

24

+
+
An Ellington Tribute
+
8 pm
+
$24/$38/$48
+
+
+

25

+
+
Carson Qurtet
+
1 pm
+
$12
+
+ 		+

26

+
+
+
+
+
+ 		+

27

+
+
+
+
+
+ 		+

28

+
+
Madtown Jugglers
+
8 pm
+
$12/$16/$20
+
+ 		+

1

+
+
Othello
+
8 pm
+
$24/$36/$48
+
+ 		+

2

+
+
Othello
+
8 pm
+
$24/$36/$48
+
+ 		+

3

+
+
Othello
+
8 pm
+
$24/$36/$48
+
+
+ + + + + diff --git a/case3/lht_feb_txt.html b/case3/lht_feb_txt.html deleted file mode 100644 index cc52041..0000000 --- a/case3/lht_feb_txt.html +++ /dev/null @@ -1,105 +0,0 @@ - - - - - - - - Lyman Hall Theater in February - - - - - -
- The Lyman Hall Theater - -
- -
-

Coming Up at the Lyman Hall Theater

-

February will be another banner month at the Lyman Hall - Theatre with three performances of the Tony Award winning - musical, West Side Story by the Broadway Touring Company. - Tickets are going fast, so order yours today. -

- -

Celebrate Valentine's Day with the Chamberlain Symphony and - their special selection of classical music for lovers. Later that - week, exercise your mind by attending the Charles Dickens classic, - The Mystery of Edwin Drood. Can you solve Dickens' - unfinished mystery? -

- -

Jazz lovers have a lot to celebrate in February with a visit - from the Jazz Masters on February 21st, and then on February - 24th, enjoy the music of The Duke with an Ellington Tribute - performed by the Jazz Company of Kansas City. -

- -

Pins, bottles, plates, and chairs are flying at the Chamberlain - Civic Center in February. The Taiwan Acrobats return on - February 2nd with another amazing performance. We close out the - month with a visit from the Madtown Jugglers and their unique - blend of comedy, juggling, and madness. -

- -

Enjoy a classical brunch every Sunday in February with music - provided by the Carson Quartet. Seating is limited, so please order - your table in advance. -

-
- - - - - - \ No newline at end of file diff --git a/case3/lht_tables.css b/case3/lht_tables.css new file mode 100644 index 0000000..70a24b1 --- /dev/null +++ b/case3/lht_tables.css @@ -0,0 +1,135 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS, 7th Edition + Tutorial 6 + Case Problem 3 + + Calendar Style Sheet + Author: Jeremy Snider Austin Andrews + Date: November 27th 2018 + + Filename: lht_tables.css + +*/ + +/* =============================== + Mobile Styles: 0px to 640px + =============================== +*/ + +@media only screen and (max-width : 640px) { + + table , tbody , tr , td, th , caption { + display: block; + } + + thead , h1 { + display: none; + } + + caption { + color: white; + background-color: LightGray; + font-size: 1.5em; + line-height: 2em; + } + + td { + border: 1px dotted gray; + color: rgb(11, 12, 145); + position: relative; + padding-left: 40%; + min-height: 40px; + } + + tr:nth-of-type(odd) { + background-color: rgb(255, 235, 178); + border: 2px solid gray; + } + + td::before { + content: " " attr(data-date) ""; + position: absolute; + left: 0; + top: 0; + width: 40%; + padding: 5px; + } + +} + + + +/* ============================================= + Tablet and Desktop Styles: greater than 640px + ============================================= +*/ + + +@media only screen and (min-width: 641px) { + + table { + background-image: url('lht_photo1.png'); + background-repeat: no-repeat; + background-position: bottom right; + background-size: 40%; + border: 6px double rgb(154, 64, 3); + border-collapse: collapse; + margin-top: 20px; + margin-bottom: 20px; + margin-left: auto; + margin-right: auto; + table-layout: fixed; + width: 85%; + } + + td , th { + border: 1px solid gray; + font-size: 0.85em; + font-weight: normal; + padding: 5px; + vertical-align: top; + width: 14.28%; + word-wrap: auto; + } + + td { + background-color: rgba(171, 171, 171, 0.6); + color: rgb(11, 12, 145); + } + + td[data-date~="Feb"] { + background-color: rgba(232, 214, 148, 0.6); + box-shadow: inset 0px 0px 20px gray; + } + + caption { + vertical-align: top; + text-align: center; + padding-bottom: 10px; + font-size: 1.2em; + letter-spacing: 3px; + } + + thead th { + background-color: rgb(154, 64, 3); + color: white; + } + + + + } + + + + + + + + + + + + + diff --git a/case3/lht_tables_txt.css b/case3/lht_tables_txt.css deleted file mode 100644 index 0d3a542..0000000 --- a/case3/lht_tables_txt.css +++ /dev/null @@ -1,27 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML and CSS, 7th Edition - Tutorial 6 - Case Problem 3 - - Calendar Style Sheet - Author: - Date: - - Filename: lht_tables.css - -*/ - -/* =============================== - Mobile Styles: 0px to 640px - =============================== -*/ - - - - -/* ============================================= - Tablet and Desktop Styles: greater than 640px - ============================================= -*/ diff --git a/case4/hcc_layout.css b/case4/hcc_layout.css new file mode 100644 index 0000000..4cabe2e --- /dev/null +++ b/case4/hcc_layout.css @@ -0,0 +1,176 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS, 7th Edition + Tutorial 6 + Case Problem 4 + + Schedule Table Style Sheet + Author: Jeremy Snider and Austin Andrews + Date: November 27th 2018 + + Filename: hcc_layout.css + Supporting Files: + +*/ + + +/* HTML and Body styles */ + +html { + background: white; + font-family: Verdana, Geneva, sans-serif; + height: 100%; +} + +body { + -webkit-display: flex; + display: -webkit-flex; + display: flex; + -webkit-flex-flow: row wrap; + flex-flow: row wrap; + background-color: cornsilk; + box-shadow: rgb(51, 51, 51) 10px 0px 25px, rgb(51, 51, 51) -10px 0px 25px; + border-left: 1px solid gray; + border-right: 1px solid gray; + min-height: 100%; + margin: 0px auto; + min-width: 400px; + max-width: 1024px; + width: 100%; +} + +p { + text-align: center; +} + +header h1 { + font-size: 1.5em; + font-weight: bold; + color: orangered; + text-align: center; + margin-top: 20px; + margin-bottom: 20px; +} + +/* Navigation list styles */ + +header { + background-color: lightblue; + min-height: 59px; +} + +header li { + float: left; +} + +header::after { + clear: both; + content: ""; + display: table; +} + +header nav ul { + width: 100%; +} + +header nav ul li { + font-size: 0.9em; + width: 11.11; + box-shadow: inset 1px 0px 3px, + inset -1px 0px 3px, + inset 0px 1px 3px, + inset 0px -1px 3px; + text-align: center; + vertical-align: center; +} + +header nav ul li a { + color: black; + display: block; + padding: 5px 20px; + width: 100%; +} + +header nav ul li a:hover { + color: rgb(11, 12, 145); +} + +a#navicon { + display: none; +} + +/* Aside Styles */ +aside { + width: 100%; + border: 3px solid steelblue; +} + +aside > h1 { + text-align: center; +} + +dt { + margin-top: 4px; +} + +dd { + margin-bottom: 4px; +} + +dt:nth-of-type(even) , dd:nth-of-type(even) { + clear: both; + float: right; + margin-right: 300px; + height: 100%; +} + +dt:nth-of-type(odd) , dd:nth-of-type(odd) { + clear: both; + float: left; + margin-left: 300px; + height: 100%; +} + + + +/* Footer styles */ + +footer { + clear: both; + color: white; + background: linear-gradient(to bottom, rgb(178, 97, 63), rgb(41, 41, 41)); + font-size: 0.8em; + font-style: normal; + width: 100%; +} + +footer nav ul, footer section { + float: left; + padding: 20px 30px; + width: 20%; +} + +footer section { + float: left; + padding: 20px 30px; + width: 40%; +} + +footer nav ul a { + color: white; +} + +footer nav ul a:hover { + text-decoration: underline; +} + +footer::after { + display: table; + content: ""; + clear: both; +} + + + + diff --git a/case4/hcc_reset.css b/case4/hcc_reset.css new file mode 100644 index 0000000..82dbf18 --- /dev/null +++ b/case4/hcc_reset.css @@ -0,0 +1,56 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML5 and CSS3, 7th Edition + Tutorial 6 + Case Problem 4 + + LHT Reset Style Sheet + + Filename: hcc_reset.css + +*/ + + +/* Basic styles to be used with all devices and under all conditions */ + +article, aside, figcaption, figure, +footer, header, main, nav, section { + display: block; +} + +address, article, aside, blockquote, body, cite, +div, dl, dt, dd, em, figcaption, figure, footer, +h1, h2, h3, h4, h5, h6, header, html, img, +li, main, nav, nav a, ol, p, section, span, ul, +table, tr, td, th, col, colgroup { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + background: transparent; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +} + + +/* Set the default page element styles */ + +body { + line-height: 1.2em; +} + +ul, ol { + list-style: none; +} + +nav ul { + list-style: none; + list-style-image: none; +} + +nav a { + text-decoration: none; +} + diff --git a/case4/hcc_schedule.css b/case4/hcc_schedule.css new file mode 100644 index 0000000..4b872ca --- /dev/null +++ b/case4/hcc_schedule.css @@ -0,0 +1,56 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS, 7th Edition + Tutorial 6 + Case Problem 4 + + Schedule Table Style Sheet + Author: Jeremy Snider and Austin Andrews + Date: November 27th 2018 + + Filename: hcc_schedule.css + Supporting Files: + +*/ + +/* Table Styles */ + +table { + border-collapse: collapse; + border: 2px solid black; +} + +table , td, th { + border-collapse: collapse; + border: 1px solid black; + text-align: center; +} + +th { + background-color: rgb(191, 208, 210); +} +thead th:first-of-type { + background-color: cornflowerblue; + color: black; + width: 8%; +} + +thead th { + background-color: sandybrown; + color: black; + width: 12.5%; +} + +td { + background-color: moccasin; +} + +caption { + background-color: darkslategray; + color: snow; + font-weight: bold; +} + + + diff --git a/case4/hcc_schedule.html b/case4/hcc_schedule.html new file mode 100644 index 0000000..01602dd --- /dev/null +++ b/case4/hcc_schedule.html @@ -0,0 +1,513 @@ + + + + + + + + + + + + + +
+ +
+ +

+ To reserve a room, please contact Yancy Inwe at extension 388 or by e-mail at yancyinwe@hconfcenter.org. + Reservations should be made at least 48 hours in advance. Cancellations require 24 hour notice. Room deposits will + not be returned for cancellations within 24 hours of the scheduled event. +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Reservations for Conference Rooms
+ Tuesday, April 10 +
TimeSunrise RoomMountain View RoomArbor HallMitchell TheaterGold RoomBlue RoomGreen Room
8:00 amMarriage EncounterBreakfast Club of OhioComputer Expo set upAvailableAvailableAvailableAvailable
8:30 am
9:00 amAvailableThe Tompkins GroupRetirement PlanningDrivers' Ed
9:30 am
10:00 amAvailable
10:30 amPearson PlanningThe Senior Group
11:00 amOhio Conference of LibrariansMovie Club
11:30 am
12:00 pmMarriage Encounter LuncheonAvailableAvailableSenior Luncheon
12:30 pm
1:00 pmAvailableAvailableComputer Expo opening sessonSenior Classes
1:30 pmAvailable
2:00 pmOhio Book Resale SetupMothers Of Multiples
2:30 pm
3:00 pmMarriage Encounter TalksYouth Theatre
3:30 pmTeen ConnectionTutoringTutoring
4:00 pm
4:30 pm
5:00 pm
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TimeSunrise RoomMountain View Room
8:00 amMarriage EncounterBreakfast Club of Ohio
8:30 am
9:00 amAvailable
9:30 am
10:00 amAvailable
10:30 am
11:00 amOhio Conference of Librarians
11:30 am
12:00 pmMarriage Encounter Luncheon
12:30 pm
1:00 pmAvailableAvailable
1:30 pm
2:00 pmOhio Book Resale Setup
2:30 pm
3:00 pmMarriage Encounter Talks
3:30 pm
4:00 pm
4:30 pm
5:00 pm
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TimeArbor HallMitchell Theater
8:00 amComputer Expo set upAvailable
8:30 am
9:00 am
9:30 am
10:00 am
10:30 am
11:00 am
11:30 am
12:00 pmAvailable
12:30 pm
1:00 pmComputer Expo opening sesson
1:30 pm
2:00 pm
2:30 pm
3:00 pmYouth Theatre
3:30 pm
4:00 pm
4:30 pm
5:00 pm
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TimeGold RoomBlue Room
8:00 amAvailableAvailable
8:30 am
9:00 amThe Tompkins GroupRetirement Planning
9:30 am
10:00 am
10:30 amPearson PlanningThe Senior Group
11:00 am
11:30 am
12:00 pmAvailableSenior Luncheon
12:30 am
1:00 pmSenior Classes
1:30 pm
2:00 pmMothers Of Multiples
2:30 pm
3:00 pm
3:30 pmTeen ConnectionTutoring
4:00 pm
4:30 pm
5:00 pm
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TimeGreen Room
8:00 amAvailable
8:30 am
9:00 amDrivers' Ed
9:30 am
10:00 am
10:30 am
11:00 amMovie Club
11:30 am
12:00 pm
12:30 am
1:00 pm
1:30 pmAvailable
2:00 pm
2:30 pm
3:00 pm
3:30 pmTutoring
4:00 pm
4:30 pm
5:00 pm
+ +

+ + + + + diff --git a/case4/hcc_schedule_txt.css b/case4/hcc_schedule_txt.css deleted file mode 100644 index 5bd8aaa..0000000 --- a/case4/hcc_schedule_txt.css +++ /dev/null @@ -1,13 +0,0 @@ -/* - New Perspectives on HTML and CSS, 7th Edition - Tutorial 6 - Case Problem 4 - - Schedule Table Style Sheet - Author: - Date: - - Filename: hcc_schedule.css - Supporting Files: - -*/ diff --git a/case4/hcc_schedule_txt.html b/case4/hcc_schedule_txt.html deleted file mode 100644 index dfa6f23..0000000 --- a/case4/hcc_schedule_txt.html +++ /dev/null @@ -1,22 +0,0 @@ - - - - - - - - - - - \ No newline at end of file diff --git a/case4/hcc_styles.css b/case4/hcc_styles.css new file mode 100644 index 0000000..85f653e --- /dev/null +++ b/case4/hcc_styles.css @@ -0,0 +1,88 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS, 7th Edition + Tutorial 6 + Case Problem 4 + + Hamilton Conference Center Style Sheet + Author: Jeremy Snider and Austin Andrews + Date: November 27th 2018 + + Filename: hcc_styles.css + Supporting files: + +*/ + +@media only screen and (max-width: 640px) { + + a#navicon { + display: block; + } + + header { + width: 100%; + } + + header nav { + padding-bottom: 5px; + } + + header nav ul { + display: none; + } + + header nav ul li { + font-size: 1em; + height: 1.6em; + box-shadow: none; + border: 1px solid black; + } + + a#navicon:hover+ul, header nav ul:hover { + display: block; + } + + aside { + display: none; + } + + footer{ + -webkit-order: 100; + order: 100; + } + + table.schedule { + display: none; + } + + table.mobile { + margin-bottom: 10px; + margin-left: auto; + margin-right: auto; + } +} + +@media only screen and (min-width: 641px) { + a#navicon { + display: none; + } + + nav.horizontal ul{ + display: -webkit-flex; + display: flex; + -webkit-flex-flow: row wrap; + flex-flow: row wrap; + height: 59px; + } + + nav.horizontal ul li{ + -webkit-flex: 1 1 auto; + flex: 1 1 auto; + } + + table.mobile { + display: none; + } + +} diff --git a/case4/hcc_styles_txt.css b/case4/hcc_styles_txt.css deleted file mode 100644 index 8ab480c..0000000 --- a/case4/hcc_styles_txt.css +++ /dev/null @@ -1,14 +0,0 @@ -/* - New Perspectives on HTML and CSS, 7th Edition - Tutorial 6 - Case Problem 4 - - Hamilton Conference Center Style Sheet - Author: - Date: - - Filename: hcc_styles.css - Supporting files: - -*/ - diff --git a/case4/tf_navicon.png b/case4/tf_navicon.png new file mode 100644 index 0000000..6db3593 Binary files /dev/null and b/case4/tf_navicon.png differ diff --git a/index.html b/index.html index 3a65fb4..ed9373d 100644 --- a/index.html +++ b/index.html @@ -3,37 +3,65 @@ - Tutorial 5 + Tutorial 6 - - + + +
-

Tutorial 5 links

+

Tutorial 6 links

+ + + + + + + + + + + + + + + + + + + + + + + + +
Back
Tutorial
Review
Case 1
Case 2
Case 3
Case 4
- + +
- diff --git a/mobile.css b/mobile.css new file mode 100644 index 0000000..950e175 --- /dev/null +++ b/mobile.css @@ -0,0 +1,37 @@ +@media only screen and (max-width: 640px) { + + nav.horizontal { + display: none; + } + + table.nav { + width: 100%; + height: 100%; + text-align: center; + background-color: rgb(117, 140, 72); + } + + table.nav td { + border: 3px solid black; + font-size: 1.4em; + font-weight: bold; + padding-top: 12%; + padding-bottom: 12%; + } + + section img { + display: none; + } + + section::after { + display: none; + } +} + +@media only screen and (min-width: 641px) { + + table.nav { + display: none; + } + +} diff --git a/review/dlr_columns2.css b/review/dlr_columns2.css new file mode 100644 index 0000000..607298a --- /dev/null +++ b/review/dlr_columns2.css @@ -0,0 +1,34 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS + Tutorial 6 + Review Assignment + + Columns Style Sheet + Author: Jeremy and Austin + Date: 11/20/18 + + Filename: dlr_columns2.css + +*/ + + + +/* Column Styles */ +@media only screen and (min-width: 641px) { + p { + -moz-column-count: 3; + -webkit-column-count: 3; + column-count: 3; + + -moz-column-gap: 20px; + -webkit-column-gap: 20px; + column-gap: 20px; + + -moz-column-rule: 1px solid black; + -webkit-column-rule: 1px solid black; + column-rule: 1px solid black; + } +} + diff --git a/review/dlr_columns2_txt.css b/review/dlr_columns2_txt.css deleted file mode 100644 index 0ef6bdb..0000000 --- a/review/dlr_columns2_txt.css +++ /dev/null @@ -1,20 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML and CSS - Tutorial 6 - Review Assignment - - Columns Style Sheet - Author: - Date: - - Filename: dlr_columns2.css - -*/ - - - -/* Column Styles */ - - diff --git a/review/dlr_mornings.html b/review/dlr_mornings.html new file mode 100644 index 0000000..6ae7463 --- /dev/null +++ b/review/dlr_mornings.html @@ -0,0 +1,153 @@ + + + + + + + + DLR Morning Schedule + + + + + + + +
+

Listener Supported Since 1975

+ +
+ +
+ +
+ DLR +

DLR Morning Schedule

+

DLR airs listener-supported public radio in Bismarck, North Dakota from + 5:00 a.m. to 10:30 p.m.
You can Listen Live to streaming audio + of our broadcast or download programs from our Podcast. +
Please refer below for our current morning schedule.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
All Times Central
TimeMonTueWedThuFriSatSun
Support your Public Radio Station
5:00Dawn AirDawn Air WeekendsSunday Magazine
5:30
6:00Weekend Reflections
6:30
7:00Local NewsWeekend WrapRadio U
7:30World News Feed
8:00Classical RootsWhat Can You Say?University on the Air
8:30
9:00
9:30Animal Talk
10:00Symphony CityWord Play
10:30Brain Stew
11:00Opera Live from the East CoastThe Inner Mind
11:30Grammar Rules!!
12:00Book ClubWeekend Wrap
+ +
+ +
+ + + + + diff --git a/review/dlr_mornings_txt.html b/review/dlr_mornings_txt.html deleted file mode 100644 index f90b239..0000000 --- a/review/dlr_mornings_txt.html +++ /dev/null @@ -1,61 +0,0 @@ - - - - - - - - DLR Morning Schedule - - - - - -
-

Listener Supported Since 1975

- -
- -
- -
- DLR -

DLR Morning Schedule

-

DLR airs listener-supported public radio in Bismarck, North Dakota from - 5:00 a.m. to 10:30 p.m.
You can Listen Live to streaming audio - of our broadcast or download programs from our Podcast. -
Please refer below for our current morning schedule.

- -
- -
- - - - - \ No newline at end of file diff --git a/review/dlr_tables2.css b/review/dlr_tables2.css new file mode 100644 index 0000000..31d4620 --- /dev/null +++ b/review/dlr_tables2.css @@ -0,0 +1,79 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS + Tutorial 6 + Review Assignment + + Tables Style Sheet + Author: Jeremy and Austin + Date: 11/20/18 + + Filename: dlr_tables2.css + +*/ + +/* Table Styles */ +table.programs { + width: 100%; + border: 15px outset rgb(151, 151, 151); + border-collapse: collapse; + font-family: Arial, Verdana, sans-serif; +} + +table.programs tr { + height: 25px; +} + +table.programs th, table.programs td { + border: 1px solid gray; + vertical-align: top; + padding: 5px; +} + +/* Table Caption Styles */ +caption { + caption-side: bottom; + text-align: center; +} + +/* Table Column Styles */ +col.timeColumn { + width: 10%; + background-color: rgb(215, 205, 151); +} + +col.wDayColumns { + width: 11%; + background-color: rgb(236, 255, 211); +} + +col.wEndColumns { + width: 17%; + background-color: rgb(255, 231, 255); +} + +/* Table Header Styles */ +table.programs thead { + color: white; + background-color: rgb(105, 177, 60); +} + +table.programs thead th:first-of-type { + background-color: rgb(153, 86, 7); +} + +table.programs thead th:nth-of-type(7), table.programs thead th:nth-of-type(8) { + background-color: rgb(153, 0, 153); +} +/* Table Footer Styles */ +table.programs tfoot { + color: white; + background-color: black; +} + + + + + + diff --git a/review/dlr_tables2_txt.css b/review/dlr_tables2_txt.css deleted file mode 100644 index 4c58fb9..0000000 --- a/review/dlr_tables2_txt.css +++ /dev/null @@ -1,39 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML and CSS - Tutorial 6 - Review Assignment - - Tables Style Sheet - Author: - Date: - - Filename: dlr_tables2.css - -*/ - -/* Table Styles */ - - - -/* Table Caption Styles */ - - - -/* Table Column Styles */ - - - -/* Table Header Styles */ - - - -/* Table Footer Styles */ - - - - - - - diff --git a/styles.css b/styles.css index fa79ea2..55971f7 100644 --- a/styles.css +++ b/styles.css @@ -34,9 +34,9 @@ nav.horizontal { } nav.horizontal ul { - list-style-type: none; - margin: 0; - padding: 0; + list-style-type: none; + margin: 0; + padding: 0; } nav.horizontal li { @@ -44,12 +44,13 @@ nav.horizontal li { float: left; line-height: 2em; text-transform: uppercase; - width: 16%; + width: 14%; } nav.horizontal a { display: block; font-size: 1em; + text-align: center; } nav.horizontal a:visited, nav.horizontal a:link { diff --git a/tutorial/dlr_columns.css b/tutorial/dlr_columns.css new file mode 100644 index 0000000..260a160 --- /dev/null +++ b/tutorial/dlr_columns.css @@ -0,0 +1,44 @@ +@charset "utf-8"; + +/* + New Perspectives on HTML and CSS + Tutorial 6 + Tutorial Case + + Columns Style Sheet + Author: Jeremy and Austin + Date: 11/20/18 + + Filename: dlr_columns.css + +*/ + + + +/* Column Styles */ + +@media only screen and (min-width: 641px) { + article { + -moz-column-count: 2; + -webkit-column-count: 2; + column-count: 2; + + -moz-column-gap: 30px; + -webkit-column-gap: 30px; + column-gap: 30px; + + -moz-column-rule: 2px solid gray; + -webkit-column-rule: 2px solid gray; + column-rule: 2px solid gray; + + widows: 3; + orphans: 3; + + } + + article h1 { + -moz-column-span: all; + -webkit-column-span: all; + column-span: all; + } +} diff --git a/tutorial/dlr_columns_txt.css b/tutorial/dlr_columns_txt.css deleted file mode 100644 index b14a401..0000000 --- a/tutorial/dlr_columns_txt.css +++ /dev/null @@ -1,19 +0,0 @@ -@charset "utf-8"; - -/* - New Perspectives on HTML and CSS - Tutorial 6 - Tutorial Case - - Columns Style Sheet - Author: - Date: - - Filename: dlr_columns.css - -*/ - - - -/* Column Styles */ - diff --git a/tutorial/dlr_evenings_txt.html b/tutorial/dlr_evenings.html similarity index 55% rename from tutorial/dlr_evenings_txt.html rename to tutorial/dlr_evenings.html index 9a7c4ad..b9a3924 100644 --- a/tutorial/dlr_evenings_txt.html +++ b/tutorial/dlr_evenings.html @@ -7,8 +7,8 @@ Tutorial Case DLR Nightly Schedule - Author: - Date: + Author: Jeremy and Austin + Date: 11/20/18 Filename: dlr_evenings.html @@ -19,6 +19,7 @@ DLR Nightly Schedule + @@ -49,7 +50,77 @@

DLR Nightly Schedule

You can Listen Live to streaming audio of our broadcast. Please refer below for our current nightly schedule.

- + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
All Times Central
TimeMonTueWedThuFriSatSun
DLR ends its broadcast day at 10:30 p.m.
6:00 PMNational News
6:30 PMWorld News
7:00 PMOpera FestRadio UScience WeekThe Living WorldWord PlayAgri-WeekFolk Fest
7:30 PMBrain StewBismarck Forum
8:00 PMThe Classical Music ConnectionOld Time RadioSaturday Nite JazzThe Indie Connection
8:30 PMThe Inner Mind
9:00 PMOpemn Mike Nite
9:30 PM
10:00 PMWorld News Feed