diff --git a/css/reset.css b/css/reset.css new file mode 100644 index 0000000..0784f21 --- /dev/null +++ b/css/reset.css @@ -0,0 +1,30 @@ +/* + Modern CSS Reset + https://www.joshwcomeau.com/css/custom-css-reset/ +*/ +*, *::before, *::after { + box-sizing: border-box; +} +* { + margin: 0; +} +html, body { + height: 100%; +} +body { + line-height: 1.5; + -webkit-font-smoothing: antialiased; +} +img, picture, video, canvas, svg { + display: block; + max-width: 100%; +} +input, button, textarea, select { + font: inherit; +} +p, h1, h2, h3, h4, h5, h6 { + overflow-wrap: break-word; +} +#root, #__next { + isolation: isolate; +} \ No newline at end of file diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..e8f0ee1 --- /dev/null +++ b/css/styles.css @@ -0,0 +1,215 @@ +body { + font-family: "Inter", sans-serif; + font-size: 12pt +} + +header{ + background-color: #0694A0; + color: white; +} + +h1{ + padding:1rem; + color: white; +} + +h3{ + font-weight: normal; + font-size:x-large; + padding:1rem; + padding-left:0; +} + +.darkblue{ + display:flex; + justify-content: space-between; + padding: 1rem; + margin-right: 2rem; +} + +.lightblue-whole{ + background-color: #88DDE4; +} + +.navigation{ + display:flex; + justify-content: space-between; + padding: 1rem; + margin-right: 2rem; +} + + +form.search { + display:flex; + flex-direction: column; +} + +.search div.input-group { + display: flex; + flex-direction: row; + margin: 1em; +} + + +.search input[type="search"] { + background: #D7F7FA; + border: none; + border-radius: 10px 0 0 10px; + padding: 0.5rem; + width:400px; + + } + +.search input[type="submit"] { + background: #FF9767; + border: none; + border-radius: 0 10px 10px 0; + display: inline-block; + padding: 0.4rem; +} + + .clear-button, +.search-button { + position: absolute; + top: 50%; + transform: translateY(-50%); +} + +.search-bar { + position: relative; + } + + .search-input { + background: #D7F7FA; + border: none; + border-radius: 10px; + padding: 1rem; + width: 400px; + margin: 1rem; + padding-left: 40px; /* Adjust for icon size */ + } + + + + + +.event-flyer{ + font-family:'Courier New', Courier, monospace; + background-color: #FFE098; + border-radius: 1rem; + margin:1rem; + padding:0; + overflow: hidden; +} + +.text{ + padding:1rem; +} + +.date-QR{ + padding-top:1rem; + display:flex; + justify-content:space-between +} + +.upcoming-events{ + margin:1rem; + padding-bottom:1rem; +} + +.black-history{ + padding-top: 1rem; + padding-bottom:2rem; +} + + + +a { + color: #333; + text-decoration: none; + } + span { + text-decoration: underline; + } + li { + margin-bottom: 1rem; + } + +ul.cards li{ + padding: 2rem; + padding-top: 3rem; + margin: 1rem; + border-radius: 1em; + color:white; + font-size: larger; + font-weight: bolder; +} + +.kids{ + background-color:#90B71D; +} + +.teen{ + background-color:#C6004C; +} + +.programs{ + background-color:#FD6B28; +} + +.eLibrary{ + background-color:#A082AE +} + +.culture-pass{ + background-color:#EA6E77 +} + +.seed-library{ + background-color:#01A0AF +} + +.links{ + display: flex; + justify-content: space-between; + margin:1rem; +} + +.info{ + line-height: 2rem; +} + +.support{ + line-height: 2rem; +} + +footer{ + padding:1rem; + background-color: #0694A0; + color: white; +} + + +ul{ + list-style: none; + padding: 0; +} + +a{ + text-decoration: none; + color:inherit +} +@media screen and (min-width: 600px){ + + .darkblue{ + display: grid; + grid-template-columns: 1fr 1fr; + } +} + +.input-group { + display: flex; + flex-direction: row; +} + + diff --git a/img/phxlogo.png b/img/phxlogo.png new file mode 100644 index 0000000..1329c89 --- /dev/null +++ b/img/phxlogo.png Binary files differ diff --git a/img/png.png b/img/png.png new file mode 100644 index 0000000..325afb1 --- /dev/null +++ b/img/png.png Binary files differ diff --git a/index.html b/index.html index 370a0b4..0ea3521 100644 --- a/index.html +++ b/index.html @@ -1,27 +1,171 @@ - - - - - - - Main Document - - -
-
My Header
-
-
- Big Ass Block + + + + + Starter Project + + + + + + + + + + + +
+

Phoenix Public Library

+ +
+ +
+ + +
+
+ +
-
-

One minority from this branch is going to get into this program.

+ + + +
+ +
+ Sheply Bulfinch buildings in Phoenix + +
+

Preserve Historic Phoenix 2025 Update

+

+ Burton Barr Central Library
+ Pullium Auditorium
+ 1221 N Central Ave
+ Phoenix, AZ 85004
+

+ +

- Who would I refer? Hmm... the competent, hardworking one who does things his own way, or the malleable simpleton who can be bought for a few fashion magazines? What? Hey, what's up. Hey, this is your apology letter. I expect to do very well tonight. I have an acute ability to read people. Jim, for instance, has a huge tell. When he gets a good hand, he coughs. Well, adults are supposed to go to the dentist, too. + 2pm-4pm
+ Saturday Feb. 24 2024

+ QR code
-
- +
+ + + + +
+
+

Upcoming Events

+

Celebrating Black History Month

+ + + +
+ + + +
+ +
+ +
+
+

Information

+ +
+ +
+

Support Us

+ +
- - \ No newline at end of file + + + + + + + + diff --git a/js/scripts.js b/js/scripts.js new file mode 100644 index 0000000..0010893 --- /dev/null +++ b/js/scripts.js @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/styles/reset.css b/styles/reset.css deleted file mode 100644 index e29c0f5..0000000 --- a/styles/reset.css +++ /dev/null @@ -1,48 +0,0 @@ -/* 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; -} diff --git a/styles/styles.css b/styles/styles.css deleted file mode 100644 index 2686022..0000000 --- a/styles/styles.css +++ /dev/null @@ -1,31 +0,0 @@ -html, body { - height: 100vh; - overflow: hidden; -} - -.main-layout { - display: flex; - flex-direction: column; - height: 100%; - -} - -.main-layout header { - background-color: blueviolet; -} - -.main-layout main { - flex-grow: 1; - flex-shrink: 1; - overflow-y: auto; -} - -.main-layout footer { - background-color: blue; -} - -.hero { - font-size: 40pt; - height: 10em; - background-color: aquamarine; -} \ No newline at end of file