From 155dfc8c26cba002d4ce818eb7bccdfabce95457 Mon Sep 17 00:00:00 2001 From: Orlando Castillo Date: Mon, 6 Mar 2023 10:49:49 -0500 Subject: [PATCH 1/6] header completed --- .DS_Store | Bin 6148 -> 6148 bytes css/index.css | 441 ++++++++++++++++++++----------- icomoon-v1.0/Read Me.txt | 7 + icomoon-v1.0/demo-files/demo.css | 152 +++++++++++ icomoon-v1.0/demo-files/demo.js | 30 +++ icomoon-v1.0/demo.html | 80 ++++++ icomoon-v1.0/fonts/icomoon.eot | Bin 0 -> 2128 bytes icomoon-v1.0/fonts/icomoon.svg | 13 + icomoon-v1.0/fonts/icomoon.ttf | Bin 0 -> 1964 bytes icomoon-v1.0/fonts/icomoon.woff | Bin 0 -> 2040 bytes icomoon-v1.0/selection.json | 1 + icomoon-v1.0/style.css | 36 +++ index.html | 276 ++++++++++--------- menu.html | 191 +++++-------- 14 files changed, 806 insertions(+), 421 deletions(-) create mode 100644 icomoon-v1.0/Read Me.txt create mode 100644 icomoon-v1.0/demo-files/demo.css create mode 100644 icomoon-v1.0/demo-files/demo.js create mode 100644 icomoon-v1.0/demo.html create mode 100644 icomoon-v1.0/fonts/icomoon.eot create mode 100644 icomoon-v1.0/fonts/icomoon.svg create mode 100644 icomoon-v1.0/fonts/icomoon.ttf create mode 100644 icomoon-v1.0/fonts/icomoon.woff create mode 100644 icomoon-v1.0/selection.json create mode 100644 icomoon-v1.0/style.css diff --git a/.DS_Store b/.DS_Store index 807956c495580cc3bdfe2be806a62c781c2d02c7..8564d0db2dbfac856c110ef2546047263611c2bb 100644 GIT binary patch delta 96 zcmZoMXfc=|#>B`mu~2NHo}wrd0|Nsi1A_oVaY0f}eiD$kBdK6w;qu7_A}pKLSsyTM rR^VV~nb;t>nVo~51E_DaAjfy+$^0Ug0zkDOtsoOXG|T1)ku}T!Idc>e delta 307 zcmZoMXfc=|#>B!ku~2NHo}wrV0|Nsi1A_nqLpnnqgDyiFLncGc=8ufanIk|_JPaue zsSL$HK_qFANK$!mK~heB5>U;Fq=KBx;t~Uc>x@jyEUawo92{I6T)bSd!5R7G!6k_$ zrNvH(MbRK$Kw?Qo(qv~w?|KeS4$gQ1@#<=GGXot3Ba2!cg=$M9Ak)OythSbuLtNF+ z)-xfuvZ}hKwr&Q{79d~*Ius1}p)`z|31r}OX<2YlUQT{qI#3NrKQquTxeS{{8E-Ld jX6NAN00srnyWg27^NUyt02P4k01`|f!#78WtYHQKWW7H8 diff --git a/css/index.css b/css/index.css index 21442c782..d6d33c190 100644 --- a/css/index.css +++ b/css/index.css @@ -3,251 +3,386 @@ 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; +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; +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +menu, +nav, +section { + display: block; } body { - line-height: 1; + line-height: 1; } -ol, ul { - list-style: none; +ol, +ul { + list-style: none; } -blockquote, q { - quotes: none; +blockquote, +q { + quotes: none; } -blockquote:before, blockquote:after, -q:before, q:after { - content: ''; - content: none; +blockquote:before, +blockquote:after, +q:before, +q:after { + content: ''; + content: none; } table { - border-collapse: collapse; - border-spacing: 0; + border-collapse: collapse; + border-spacing: 0; } * { - box-sizing: border-box; + box-sizing: border-box; } html { - max-width: 1920px; - min-width: 428px; - width: 100%; - font-size: 62.5%; + max-width: 1920px; + min-width: 428px; + width: 100%; + font-size: 62.5%; } body { - font-family: 'Roboto', sans-serif; - line-height: 1.5; + font-family: 'Roboto', sans-serif; + line-height: 1.5; } -h1, h2, h3, h4, h5, h6, p, a, i { - text-decoration: none; +h1, +h2, +h3, +h4, +h5, +h6, +p, +a, +i { + text-decoration: none; } h1 { - font-size: 7.5rem; + font-size: 7.5rem; } h2 { - font-size: 6rem; + font-size: 6rem; } h3 { - font-size: 5rem; + font-size: 5rem; } -p, a { - font-size: 3rem; +p, +a { + font-size: 3rem; } /* header section */ header { - width: 100%; - height: 100vh; - background-image: url('../img/home-header.jpg'); - background-size: cover; - background-position: center; - background-repeat: no-repeat; + width: 100%; + height: 100vh; + background-image: url('../img/home-header.jpg'); + background-size: cover; + background-position: center; + background-repeat: no-repeat; +} + +.header-style { + background-color: rgba(0, 0, 0, 0.8); + padding: 3rem; +} + +.header-style--title { + text-align: center; + color: #fff; + font-size: 5.8rem; + margin-bottom: 2rem; +} + +.header-style--links { + display: flex; + justify-content: space-around; + margin-bottom: 3rem; +} + +.header-style--links a { + color: #fff; + font-size: 2.5rem; +} + +.header-style--icons { + display: flex; + justify-content: center; +} + +.header-style--icons span { + font-size: 3rem; + color: #fff; + margin: 0 3rem; +} + +.icon-facebook2:before { + content: '\ea91'; +} + +.icon-instagram:before { + content: '\ea92'; +} + +.icon-twitter:before { + content: '\ea96'; } /* spacers */ .spacer { - width: 100%; - height: 20vh; - background-color: rgb(0, 4, 17); + width: 100%; + height: 20vh; + background-color: rgb(0, 4, 17); } .spacer-sm { - width: 100%; - height: 10vh; - background-color: rgb(0, 4, 17); + width: 100%; + height: 10vh; + background-color: rgb(0, 4, 17); } /* gallery section */ .gallery { - width: 100%; - height: 100vh; - text-align: center; - background-color: rgb(0, 4, 17); + width: 100%; + height: 100vh; + text-align: center; + background-color: rgb(0, 4, 17); } /* about us section */ .about { - width: 100%; - height: 75vh; - text-align: center; - background-image: url("../img/staff-cooks.jpg"); - background-size: cover; - background-position: top; - background-repeat: no-repeat; + width: 100%; + height: 75vh; + text-align: center; + background-image: url('../img/staff-cooks.jpg'); + background-size: cover; + background-position: top; + background-repeat: no-repeat; } .about-container { - height: 100%; - display: flex; - flex-wrap: wrap; - justify-content: center; - align-items: center; - background-color: rgb(0, 4, 17, .8); + height: 100%; + display: flex; + flex-wrap: wrap; + justify-content: center; + align-items: center; + background-color: rgb(0, 4, 17, 0.8); } .about h2 { - width: 100%; + width: 100%; } .about-container .text { - width: 50%; + width: 50%; } /* contact us section */ .contact { - text-align: center; - background-image: url("../img/jumbo-restaurant.jpg"); - background-size: cover; - background-position: center; - background-repeat: no-repeat; - background-color: rgb(0, 4, 17); + text-align: center; + background-image: url('../img/jumbo-restaurant.jpg'); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + background-color: rgb(0, 4, 17); } .contact-container { - width: 100%; - height: 100%; - background-color: rgb(0, 4, 17, .8); + width: 100%; + height: 100%; + background-color: rgb(0, 4, 17, 0.8); } .contact h2 { - padding-top: 5vh; + padding-top: 5vh; } .contact h3 { - padding-top: 2.5vh; + padding-top: 2.5vh; } .contact p { - padding: .5vh 0; + padding: 0.5vh 0; } .info { - width: 100%; - display: flex; - justify-content: space-around; + width: 100%; + display: flex; + justify-content: space-around; } .address { - width: 25%; + width: 25%; } .hours { - width: 25%; - padding-bottom: 2.5vh; + width: 25%; + padding-bottom: 2.5vh; } .contacts { - width: 25%; + width: 25%; } /* footer section */ footer { - width: 100%; - height: 15vh; - padding-top: 2.5vh; - font-size: 3rem; + width: 100%; + height: 15vh; + padding-top: 2.5vh; + font-size: 3rem; } /* mobile media query */ @media (max-width: 428px) { - /* header section */ - - - /* gallery section */ - .gallery { - height: auto; - } - - /* about us section */ - - .about { - height: 200vh; - } - - .about h2 { - width: 100%; - padding-top: 5vh; - } - - .about-container .text { - width: 85%; - } - - /* contact us section */ - .contact h3 { - padding-top: 2.5vh; - } - - .info { - flex-wrap: wrap; - } - - .address { - width: 100%; - padding-bottom: 2.5vh; - } - - .hours { - width: 100%; - } - - .contacts { - width: 100%; - padding-bottom: 2.5vh; - } - - /* footer section */ - footer { - height: auto; - padding-top: 2.5vh; - font-size: 2rem; - } + /* header section */ + + /* gallery section */ + .gallery { + height: auto; + } + + /* about us section */ + + .about { + height: 200vh; + } + + .about h2 { + width: 100%; + padding-top: 5vh; + } + + .about-container .text { + width: 85%; + } + + /* contact us section */ + .contact h3 { + padding-top: 2.5vh; + } + + .info { + flex-wrap: wrap; + } + + .address { + width: 100%; + padding-bottom: 2.5vh; + } + + .hours { + width: 100%; + } + + .contacts { + width: 100%; + padding-bottom: 2.5vh; + } + + /* footer section */ + footer { + height: auto; + padding-top: 2.5vh; + font-size: 2rem; + } } diff --git a/icomoon-v1.0/Read Me.txt b/icomoon-v1.0/Read Me.txt new file mode 100644 index 000000000..8491652f8 --- /dev/null +++ b/icomoon-v1.0/Read Me.txt @@ -0,0 +1,7 @@ +Open *demo.html* to see a list of all the glyphs in your font along with their codes/ligatures. + +To use the generated font in desktop programs, you can install the TTF font. In order to copy the character associated with each icon, refer to the text box at the bottom right corner of each glyph in demo.html. The character inside this text box may be invisible; but it can still be copied. See this guide for more info: https://icomoon.io/#docs/local-fonts + +You won't need any of the files located under the *demo-files* directory when including the generated font in your own projects. + +You can import *selection.json* back to the IcoMoon app using the *Import Icons* button (or via Main Menu → Manage Projects) to retrieve your icon selection. diff --git a/icomoon-v1.0/demo-files/demo.css b/icomoon-v1.0/demo-files/demo.css new file mode 100644 index 000000000..39b8991da --- /dev/null +++ b/icomoon-v1.0/demo-files/demo.css @@ -0,0 +1,152 @@ +body { + padding: 0; + margin: 0; + font-family: sans-serif; + font-size: 1em; + line-height: 1.5; + color: #555; + background: #fff; +} +h1 { + font-size: 1.5em; + font-weight: normal; +} +small { + font-size: .66666667em; +} +a { + color: #e74c3c; + text-decoration: none; +} +a:hover, a:focus { + box-shadow: 0 1px #e74c3c; +} +.bshadow0, input { + box-shadow: inset 0 -2px #e7e7e7; +} +input:hover { + box-shadow: inset 0 -2px #ccc; +} +input, fieldset { + font-family: sans-serif; + font-size: 1em; + margin: 0; + padding: 0; + border: 0; +} +input { + color: inherit; + line-height: 1.5; + height: 1.5em; + padding: .25em 0; +} +input:focus { + outline: none; + box-shadow: inset 0 -2px #449fdb; +} +.glyph { + font-size: 16px; + width: 15em; + padding-bottom: 1em; + margin-right: 4em; + margin-bottom: 1em; + float: left; + overflow: hidden; +} +.liga { + width: 80%; + width: calc(100% - 2.5em); +} +.talign-right { + text-align: right; +} +.talign-center { + text-align: center; +} +.bgc1 { + background: #f1f1f1; +} +.fgc1 { + color: #999; +} +.fgc0 { + color: #000; +} +p { + margin-top: 1em; + margin-bottom: 1em; +} +.mvm { + margin-top: .75em; + margin-bottom: .75em; +} +.mtn { + margin-top: 0; +} +.mtl, .mal { + margin-top: 1.5em; +} +.mbl, .mal { + margin-bottom: 1.5em; +} +.mal, .mhl { + margin-left: 1.5em; + margin-right: 1.5em; +} +.mhmm { + margin-left: 1em; + margin-right: 1em; +} +.mls { + margin-left: .25em; +} +.ptl { + padding-top: 1.5em; +} +.pbs, .pvs { + padding-bottom: .25em; +} +.pvs, .pts { + padding-top: .25em; +} +.unit { + float: left; +} +.unitRight { + float: right; +} +.size1of2 { + width: 50%; +} +.size1of1 { + width: 100%; +} +.clearfix:before, .clearfix:after { + content: " "; + display: table; +} +.clearfix:after { + clear: both; +} +.hidden-true { + display: none; +} +.textbox0 { + width: 3em; + background: #f1f1f1; + padding: .25em .5em; + line-height: 1.5; + height: 1.5em; +} +#testDrive { + display: block; + padding-top: 24px; + line-height: 1.5; +} +.fs0 { + font-size: 16px; +} +.fs1 { + font-size: 32px; +} + diff --git a/icomoon-v1.0/demo-files/demo.js b/icomoon-v1.0/demo-files/demo.js new file mode 100644 index 000000000..6f45f1c40 --- /dev/null +++ b/icomoon-v1.0/demo-files/demo.js @@ -0,0 +1,30 @@ +if (!('boxShadow' in document.body.style)) { + document.body.setAttribute('class', 'noBoxShadow'); +} + +document.body.addEventListener("click", function(e) { + var target = e.target; + if (target.tagName === "INPUT" && + target.getAttribute('class').indexOf('liga') === -1) { + target.select(); + } +}); + +(function() { + var fontSize = document.getElementById('fontSize'), + testDrive = document.getElementById('testDrive'), + testText = document.getElementById('testText'); + function updateTest() { + testDrive.innerHTML = testText.value || String.fromCharCode(160); + if (window.icomoonLiga) { + window.icomoonLiga(testDrive); + } + } + function updateSize() { + testDrive.style.fontSize = fontSize.value + 'px'; + } + fontSize.addEventListener('change', updateSize, false); + testText.addEventListener('input', updateTest, false); + testText.addEventListener('change', updateTest, false); + updateSize(); +}()); diff --git a/icomoon-v1.0/demo.html b/icomoon-v1.0/demo.html new file mode 100644 index 000000000..853696252 --- /dev/null +++ b/icomoon-v1.0/demo.html @@ -0,0 +1,80 @@ + + + + + IcoMoon Demo + + + + + +
+

Font Name: icomoon (Glyphs: 3)

+
+
+

Grid Size: 16

+
+
+ + icon-facebook2 +
+
+ + +
+
+ liga: + +
+
+
+
+ + icon-instagram +
+
+ + +
+
+ liga: + +
+
+
+
+ + icon-twitter +
+
+ + +
+
+ liga: + +
+
+
+ + +
+

Font Test Drive

+ + +
  +
+
+ +
+

Generated by IcoMoon

+
+ + + + diff --git a/icomoon-v1.0/fonts/icomoon.eot b/icomoon-v1.0/fonts/icomoon.eot new file mode 100644 index 0000000000000000000000000000000000000000..ebede2e8ac1bdd6b16041a5e77a3cb88e3c0f542 GIT binary patch literal 2128 zcmah~O-vg{6n?X7yx4db?05}03t6yPo8VA`u>lc?n<@!OlR{~g6H?<~V`#u8U=ome z@TEOel}MrrHBwY@=%rHBOAo249IQ(HlX|Lptg1@wiAcTmP_@PVW_J^8hqh1i^Sw9U z%zLvlJ8!m`=%GZ!NT7OQbcb=v<=J{W=UTFJ`_Y5OF(QSQX@QEgidv)s2nx+nj`Flg zE0m#iSORnvmUY?ymveL)qCtwA+{W23a)&KcCXwPZue~tb>XXv2JVw2?u$o!h|NhB2 zkTmG?`OL-|`ZnlW=$rE^+lvPu?}E$9MB1)-#Y(k8X%Q8JPd`5A>AW$$agQ3t ztX?!(8ad1v9%{znI$+cH@9pna|E^ZedHVicTVvH<)D3kFvuju9z8JWzHC9}b(Q%V> z$oyYhwc;Q|AHsq?y-wBZ4m+9Gn`6#M+|ZAuS#@mEXwxE z<(o6*a?q&gdrXH(tc*qZ7^{@iGdIgdFkL=Kk443FbPUHqRIP|r_?f1A^a*`VU%}sS zpuL;b7S->R6job8y+&k^)fU7xI>l;BBH7zGP4zb}ofvMMmKdCNPwG#?smT{)vuYOjR|v+k+LbipTBNR5cdtnCS06yJRssV*xN+vbBcn zs%50&@oB%R`lsXZR4u-c&0aud&Ea5YINTWwi&?C0`j<7I95bS6L>M(1gdP1vdXLAzGVo$<`+7L$o(>if_|o{PBFaR_F(>m_Z|O_SlL#%RapnzgTaH z4MdFbHm@kWI5|~_$0KrU;$-KLnwgfhR`)Tt|Hir0+n3}{PslJ{9T~cwQhyt6M6Hdkj7VvpH zBxh>$;hQ&>Bv}fK>U^twzo-u$-QIbl_4M!5f@ci!^T4NH9`^PhjQ8|en!p_MUBb8G z!XG~q95#|QVj1vAm`rYaW_OdHx@nHxV!xTQCHk8G#}H0$6a{~^<%1F4ZyO81*K8~T zr)=y1-n4NOvWIG8C+siV*iAutm%n-r7c2@!EGz)$Z7c#$+Smd7mW`W`#PGVCbDgly z+1O1Z^wIJ{akW@1)Mvu0x%G|ZVnH7oj31r;j+}L*aW0qNT*<80=hY*b=Zl4sp3fC> z>zPt6t6$&NFD?|XAhtm|Z>HW7c9BOiE|>{9LnZWC*sjwy+KXl?zhbBIL40+dVg5t@ E0ofld9{>OV literal 0 HcmV?d00001 diff --git a/icomoon-v1.0/fonts/icomoon.svg b/icomoon-v1.0/fonts/icomoon.svg new file mode 100644 index 000000000..ac20b0503 --- /dev/null +++ b/icomoon-v1.0/fonts/icomoon.svg @@ -0,0 +1,13 @@ + + + +Generated by IcoMoon + + + + + + + + + \ No newline at end of file diff --git a/icomoon-v1.0/fonts/icomoon.ttf b/icomoon-v1.0/fonts/icomoon.ttf new file mode 100644 index 0000000000000000000000000000000000000000..18aed8f8b64db90ebb006402beb159b6a1ae084d GIT binary patch literal 1964 zcmah~OKcle6uoc8_QZ~761yHJaVM=~J7c?XgJZ`|qBN-~YMT~HAfT=yQ8#w%(D>8D zDT&0w8(1Ku(h5aXLMRJ1NEI6vAk>A0#7|;{SR#Z3t5jmg0s%4S%}j`s2J!Sh=iYZe z=gymXLyU;JsYxOw=U;j%)#H_N&^*Gpu~f;|cfWspk%(!K7fbo|I@Vsun^?O_t6R%^ zA8o^yHHpL@%f);leCMG=WM9O7whV>zh4>BRcOgg0mBywQ0P<&;wAI>Do_!#^4EYDh zy_NiCon-nJ@~@DC)qJJ+;HvXaB8Lq*-mKTw8{mm1z0LPY6r1cFvJ(jpgzuoaYp(1u zrJ0l4busOxGS-ks5TE(Y744y`~mF=ZGXSpKiB-LetbhY@fnf zEbHv)Oz5ba>N^@bojU5489y32Jf?8`P@EUTB&;Ju+EG_&bk=_ccfJ5O7pDAIzgHynk^1KI2sNsKWS5fP>Qv zpuj|r;#5swydDP!tY;9&M%qkpDCs`^OhkL(>_}9f>h*}i(=)TxWHKuEq|XeDsrfls z>v5fM`EFgzzHwC^aEEpM#gUQ3y;}XfXq27KsKQUOM?7(E*c*^eMS49`x}I?NyG4&@ zDjH4pWe2m1gG_NV#-3{^Hc?=+3&NSC!2DiMzvReHJbd+5S&}9HM39%t>&1Bg)7S34 z(sS;2>c%yO_VdUmUmmR17mWK9H;LKcW86!4R=n}c&)oQTmdqVf=5AcxABNUNJ~~AU z><;_Q@RsOn{vD(3XE6k8Qt(xqIT+#owy*$v!@?qP*1|U64GY`x_fReDfc{wvyC^_! z@mtU4ghs)Ri3Q-2g+<^Q3)_HSx3Hc3gxlTlbwIyhVHb_lhbv39O08C<6f;YEIJy({!H7 G5&RG7?i>05 literal 0 HcmV?d00001 diff --git a/icomoon-v1.0/fonts/icomoon.woff b/icomoon-v1.0/fonts/icomoon.woff new file mode 100644 index 0000000000000000000000000000000000000000..5760f87b81abac30496272319274888947adf940 GIT binary patch literal 2040 zcmah~O>7%g5T3VdduzwL$+})AaX0D4cGh;|hK(INiPEG?QPZ?gQUdBJ5_Mz84voEO z;iUa+^f%J0muoo-k{PM63oR~aTRS<)EB7i{P65z zrMOOQU!qQZsdQCVHkZ)$Jplg`mEDiGo>a@l5`gz3+%Hgx-`N(bXhhpn)Du*MFZge( zwZ=UFp9gi7N(h$~YZ3i?8p19r{`jvSkBH}+I>YQVnY#~6@~@}q@GqQqmqK9UpS@<6tbmq&H}@n5af z_;`vuZZ>bvHJeerr9CDZn)uduitdqC)115A)T3r|*BnprW@;Q;3(#)yZOk(Z58)H| z9KObU*+_RkaZe@e6C~oE@tB?*Chm#6#-@pT=JK(_$CU8l(7Ej4WBJj;q2nV;j3)Of zVah6!%hEK3{3y+@^D!NB=duxGNy0v4W~&@j&Zh@6Qs|Tw1vULhn(r$SO@ zFnzwVWKs`V6(#CHID+$_NA*HFJ=qh@D2f^g1Tg|e2?heHqGX~ylj-z@s_oI6iJ*sH zv}1^Vw@1M+X2XgSo;8eu8(%7wE}@VUiD+*k(Hl+hC5+DUi)u*B=qVE!ru2*$I>JyA zRhiacE>+BwyGo8M{0Bw52)}3-agd@@#93M<^Z4T^U7Pyu%ZxM_VSjKPCh@(-MY>s6^`u1TOMs128IaILPhwYXz+R922J3kYWUr4Ce z&JHE@i7uJvo}Zeo8%9#>%$?~SQHryo+8H<*2;aI`cw>2iEF)$s{?Q zSGb==nLl}MFccN~6J7Fzu4jThL0*<8l1Zbx&{tUKBT|qM@=`ubmA%!|o-# zSm?l&Msg3q-my*e7}fWLSpyJ;ewZhB$gk|Q0N>E>7{^`~rZ|g)U$vcsfPgj|bBJ#^ zm`7Z2um|ymgT43ZYT z`@Dk#FbW?oFIqLrs>3oYf(11c3+mU)YwOEaT^kuT;5w9H4c5^CH!#i!41;m(sbh`v z<;uoNaSfA}k?01jKoQoC^_;Ql4XskHm)DAoa!I?nsa;;Qt|GT#m|?jan7x8w>Wonl b8u%=s?IvvEdYKh))h+-zV$ + - - - - - Sprint Challenge - Home - - - - - - -
- -
-
- BLOOMTECH BAR AND GRILL - - - Menu - Reservations - Special Offers - Contact -
-
- - - - - -
- - -
-
-

ABOUT US

- -
-
- -
-

Good Food, Great People

-

Quis duis aute, shank ut pork eiusmod in ball tip jerky non. Short ribs tail dolore, fatback in - tempor meatloaf pig sunt porchetta beef. Ad hamburger pig veniam, andouille exercitation cillum - eiusmod doner irure tail burgdoggen rump chislic officia. Pancetta frankfurter sed, est t-bone - porchetta capicola id tri-tip cillum cow leberkas do minim. Sausage ea velit boudin laboris - dolore - short loin corned beef commodo jowl beef dolor tempor. Dolor culpa enim in meatloaf, ham mollit - shankle duis chicken dolore andouille do tenderloin qui.

-
- -
-
-
-
- - -
- - -
-
-

CONTACT US

- -
-
-

Address

- -
-

100 Main St

-

San Francisco, CA

-
-
- -
-

Hours

- -
-

Sunday to Thursday:

-

12:00p - 12:00a

-

Friday and Saturday:

-

12:00p - 4:00a

-
-
- -
-

Contacts

- - -
-
-
-
- - -
- - -
- - Join our mailing list! - Sign Up - - Menu - Reservations - Special Offers - Contact - - ©2022 BloomTech Restaurant Group, Inc. All Rights Reserved. -
-
- - - \ No newline at end of file + + + + + Sprint Challenge - Home + + + + + + + +
+ +
+
+

BLOOMTECH BAR AND GRILL

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

ABOUT US

+ +
+ +
+

Good Food, Great People

+

+ Quis duis aute, shank ut pork eiusmod in ball tip jerky non. Short + ribs tail dolore, fatback in tempor meatloaf pig sunt porchetta + beef. Ad hamburger pig veniam, andouille exercitation cillum + eiusmod doner irure tail burgdoggen rump chislic officia. Pancetta + frankfurter sed, est t-bone porchetta capicola id tri-tip cillum + cow leberkas do minim. Sausage ea velit boudin laboris dolore + short loin corned beef commodo jowl beef dolor tempor. Dolor culpa + enim in meatloaf, ham mollit shankle duis chicken dolore andouille + do tenderloin qui. +

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

CONTACT US

+ +
+
+

Address

+ +
+

100 Main St

+

San Francisco, CA

+
+
+ +
+

Hours

+ +
+

Sunday to Thursday:

+

12:00p - 12:00a

+

Friday and Saturday:

+

12:00p - 4:00a

+
+
+ +
+

Contacts

+ + +
+
+
+
+ + +
+ + +
+ + Join our mailing list! Sign Up + + Menu Reservations Special Offers Contact + + ©2022 BloomTech Restaurant Group, Inc. All Rights Reserved. +
+
+ + diff --git a/menu.html b/menu.html index 08457325c..a0ebaa63b 100644 --- a/menu.html +++ b/menu.html @@ -1,135 +1,68 @@ - + - - - - + + + + Sprint Challenge - Menu - - - - - + + + + + +
- -
- BLOOMTECH BAR AND GRILL - - - Menu - Reservations - Special Offers - Contact -
- - -
- - - - - -
- - -
- - Join our mailing list! - Sign Up - - Menu - Reservations - Special Offers - Contact - - ©2022 BloomTech Restaurant Group, Inc. All Rights Reserved. -
+ +
+ BLOOMTECH BAR AND GRILL + + + Menu Reservations Special Offers Contact +
+ + +
+ + + + + +
+ + +
+ + Join our mailing list! Sign Up + + Menu Reservations Special Offers Contact + + ©2022 BloomTech Restaurant Group, Inc. All Rights Reserved. +
- - - \ No newline at end of file + + From 5159db7d7acd33d1c22c5ccc2ca8928ab1ab8a23 Mon Sep 17 00:00:00 2001 From: Orlando Castillo Date: Mon, 6 Mar 2023 14:56:23 -0500 Subject: [PATCH 2/6] desktop homepage completed --- css/index.css | 101 +++++++++++++++++++++++++++++++++++++++++++++++--- index.html | 61 ++++++++++++++++++++++-------- 2 files changed, 141 insertions(+), 21 deletions(-) diff --git a/css/index.css b/css/index.css index d6d33c190..dcbaef0bc 100644 --- a/css/index.css +++ b/css/index.css @@ -142,6 +142,7 @@ html { body { font-family: 'Roboto', sans-serif; line-height: 1.5; + background-color: rgb(0, 4, 17); } h1, @@ -174,13 +175,14 @@ a { } /* header section */ -header { +.header-section { width: 100%; height: 100vh; background-image: url('../img/home-header.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat; + margin-bottom: 2rem; } .header-style { @@ -213,8 +215,8 @@ header { .header-style--icons span { font-size: 3rem; - color: #fff; margin: 0 3rem; + color: #fff; } .icon-facebook2:before { @@ -247,6 +249,20 @@ header { height: 100vh; text-align: center; background-color: rgb(0, 4, 17); + margin-bottom: 17rem; +} + +.gallery-style--title { + color: #fff; +} + +.gallery-style--boxes { + display: flex; + justify-content: center; + flex-flow: row wrap; +} +.gallery-style--boxes img { + margin: 2rem; } /* about us section */ @@ -273,10 +289,27 @@ header { width: 100%; } -.about-container .text { +.about-container { + color: #fff; +} + +.about-container--text { width: 50%; } +.about-container--title { + margin-bottom: 7rem; + font-size: 5rem; +} + +.about-container--text h3 { + font-size: 4rem; +} + +.about-container--text p { + font-size: 2.5rem; +} + /* contact us section */ .contact { text-align: center; @@ -291,6 +324,7 @@ header { width: 100%; height: 100%; background-color: rgb(0, 4, 17, 0.8); + color: #fff; } .contact h2 { @@ -324,14 +358,66 @@ header { width: 25%; } +.contacts--address a { + color: #fff; + text-decoration: none; +} + /* footer section */ -footer { +.footer-section { width: 100%; height: 15vh; padding-top: 2.5vh; font-size: 3rem; } +.footer-style { + display: flex; + /* justify-content: space-around; */ + color: #fff; + margin-bottom: 3rem; +} + +.footer-style--signup { + display: flex; + flex-flow: column wrap; + justify-content: center; + align-items: center; + margin: 0 5rem; + width: 25%; +} + +.footer-style--signup p { + font-size: 2rem; +} + +.footer-style--links { + width: 100%; + display: flex; + justify-content: space-around; +} +.footer-style--links a { + color: #fff; +} + +/* .footer-style p { + color: ; +} */ + +.footer-style--form { + display: flex; +} + +.footer-section--copyright { + display: flex; + justify-content: flex-end; + margin-right: 4rem; + color: #fff; +} + +.footer-section--copyright p { + font-size: 1.5rem; +} /* mobile media query */ @media (max-width: 428px) { /* header section */ @@ -379,8 +465,13 @@ footer { padding-bottom: 2.5vh; } + .contacts--address a { + color: inherit; + text-decoration: none; + } + /* footer section */ - footer { + .footer-section { height: auto; padding-top: 2.5vh; font-size: 2rem; diff --git a/index.html b/index.html index babde8059..70883edf1 100644 --- a/index.html +++ b/index.html @@ -41,12 +41,19 @@

BLOOMTECH BAR AND GRILL

@@ -56,11 +63,11 @@

OUR FOOD

-

ABOUT US

+

ABOUT US

-
+

Good Food, Great People

Quis duis aute, shank ut pork eiusmod in ball tip jerky non. Short @@ -109,9 +116,9 @@

Hours

-

Contacts

+

Contacts

-
+
999-999-9999 restaurant@bloomtech.comContacts
-
- - Join our mailing list! Sign Up - - Menu Reservations Special Offers Contact +
+ + - ©2022 BloomTech Restaurant Group, Inc. All Rights Reserved.
From 06810697fd5147c3049e4c4fc9fc4839b7991d38 Mon Sep 17 00:00:00 2001 From: Orlando Castillo Date: Mon, 6 Mar 2023 19:16:54 -0500 Subject: [PATCH 3/6] mobile response for the home page completed --- css/index.css | 54 +++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 6 +++--- 2 files changed, 57 insertions(+), 3 deletions(-) diff --git a/css/index.css b/css/index.css index dcbaef0bc..056475596 100644 --- a/css/index.css +++ b/css/index.css @@ -398,6 +398,7 @@ a { } .footer-style--links a { color: #fff; + font-size: 2rem; } /* .footer-style p { @@ -418,14 +419,35 @@ a { .footer-section--copyright p { font-size: 1.5rem; } + /* mobile media query */ @media (max-width: 428px) { /* header section */ + .header-style--title { + font-size: 4rem; + } + + .header-style--links { + flex-flow: column wrap; + align-items: center; + } + + .header-style--links a { + font-size: 3rem; + } + + .header-style--icons { + display: none; + } + /* gallery section */ .gallery { height: auto; + margin-bottom: 0; } + /* .gallery-style--boxes { + } */ /* about us section */ @@ -470,10 +492,42 @@ a { text-decoration: none; } + .spacer-sm { + display: none; + } + /* footer section */ .footer-section { height: auto; padding-top: 2.5vh; font-size: 2rem; } + + .footer-style { + display: flex; + flex-flow: column wrap; + } + + .footer-style--signup { + width: 100%; + margin: 2rem 0; + } + + .footer-style--links { + flex-flow: column wrap; + align-items: center; + margin-bottom: 0; + } + .footer-style--links a:not(:last-child) { + margin-bottom: 1rem; + } + + .footer-section--copyright { + display: inline-block; + text-align: center; + width: 100%; + } + .footer-section--copyright p { + font-size: 1.3rem; + } } diff --git a/index.html b/index.html index 70883edf1..77c2bb4c0 100644 --- a/index.html +++ b/index.html @@ -32,9 +32,9 @@

BLOOMTECH BAR AND GRILL

Contact
- - - + + +
From 0472aafe3d44b47f3b572aa950133f8b2c85db2f Mon Sep 17 00:00:00 2001 From: Orlando Castillo Date: Tue, 7 Mar 2023 09:27:00 -0500 Subject: [PATCH 4/6] HTML completed and passed --- css/index.css | 19 +++- index.html | 30 +++--- menu.html | 268 +++++++++++++++++++++++++++++++++++++++++++++----- 3 files changed, 276 insertions(+), 41 deletions(-) diff --git a/css/index.css b/css/index.css index 056475596..ccb66b501 100644 --- a/css/index.css +++ b/css/index.css @@ -190,13 +190,17 @@ a { padding: 3rem; } -.header-style--title { +.header-style--title a { text-align: center; color: #fff; font-size: 5.8rem; margin-bottom: 2rem; + color: #fff; } +/* .header-style--title a { +} */ + .header-style--links { display: flex; justify-content: space-around; @@ -213,7 +217,7 @@ a { justify-content: center; } -.header-style--icons span { +.header-style--icons i { font-size: 3rem; margin: 0 3rem; color: #fff; @@ -428,6 +432,10 @@ a { font-size: 4rem; } + .header-style--title a { + font-size: 4rem; + } + .header-style--links { flex-flow: column wrap; align-items: center; @@ -438,7 +446,12 @@ a { } .header-style--icons { - display: none; + /* display: none; */ + font-size: 2rem; + } + + .header-style--icons i { + margin: 0 1rem; } /* gallery section */ diff --git a/index.html b/index.html index 77c2bb4c0..56c181a87 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,7 @@ src="https://kit.fontawesome.com/5b12ffad4b.js" crossorigin="anonymous" > - + @@ -23,19 +23,23 @@
@@ -152,7 +156,7 @@

Contacts