diff --git a/code/daniel/fhc_files/lab04-burrito_order_form/burrito.jpeg b/code/daniel/fhc_files/lab04-burrito_order_form/burrito.jpeg new file mode 100644 index 00000000..76492949 Binary files /dev/null and b/code/daniel/fhc_files/lab04-burrito_order_form/burrito.jpeg differ diff --git a/code/daniel/fhc_files/lab04-burrito_order_form/index.html b/code/daniel/fhc_files/lab04-burrito_order_form/index.html new file mode 100644 index 00000000..ee0f8067 --- /dev/null +++ b/code/daniel/fhc_files/lab04-burrito_order_form/index.html @@ -0,0 +1,86 @@ + + + + + + + + Demo Page + + + + + +
+
+

Burrito Grande Order Form!

+
+ +
+

Build your order below

+
+ +
+
+

Tortilla:

+ White Flour + Wheat Flour + Spinach + Corn
+

Protein:

+ Carnitas + Chicken + Sofritas +
+

Beans:

+ Black
+ Pinto
+

Rice:

+ White
+ Brown
+

Additional:

+ Cheese
+ Salsa
+ Sour Cream +
+
+
+ + + + + + + +
+ + + + + \ No newline at end of file diff --git a/code/daniel/fhc_files/lab04-burrito_order_form/styles.css b/code/daniel/fhc_files/lab04-burrito_order_form/styles.css new file mode 100644 index 00000000..a52688d1 --- /dev/null +++ b/code/daniel/fhc_files/lab04-burrito_order_form/styles.css @@ -0,0 +1,67 @@ +* { + padding: 0; + margin: 0; + box-sizing: border-box; +} + +header { + display: flex; + justify-content: center; + align-items: center; + font-size: 1.4em; + text-align: center; + border-bottom: 5px solid; + border-top: 3px solid; + border-left: 3px solid; + border-right: 3px solid; + height: 7vh +} + +main { + background-color: darkolivegreen; + display: flex; + justify-content: center; + font-size: 1.2em; + border-bottom: 2px solid; + justify-content: center; +} + +section { + background-color: wheat; + display: flex; + justify-content: flex-start; + text-align: start; +} + +aside { + width: 40%; + padding-left: 15px; + margin-left: 15px; + font-family: cursive; + font-size: 2em; + text-align: center; + display: flex; + justify-content:space-between; + align-items: center; + + } + +footer { + bottom: 10; + background-color: darkolivegreen; + justify-content: flex-end; + text-align:start; +} + +.container { + display: flex; + flex-flow:column; + justify-content: flex-start; + text-align: center; + background: wheat; + height: 100vh + +}; + + +