From 8a4fd19fd47c629b1d3e878d45af748b1fc4a8a3 Mon Sep 17 00:00:00 2001 From: Joshua Ashton Date: Thu, 6 Feb 2025 14:14:45 -0700 Subject: [PATCH] input assignment completed. --- input/.gitkeep | 0 input/css/.gitkeep | 0 input/css/styles.css | 118 +++++++++++++++++++++++++++++++++++++++++++ input/img/.gitkeep | 0 input/index.php | 54 ++++++++++++++++++++ input/js/.gitkeep | 0 input/js/index.js | 0 7 files changed, 172 insertions(+) create mode 100644 input/.gitkeep create mode 100644 input/css/.gitkeep create mode 100644 input/css/styles.css create mode 100644 input/img/.gitkeep create mode 100644 input/index.php create mode 100644 input/js/.gitkeep create mode 100644 input/js/index.js diff --git a/input/.gitkeep b/input/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/input/css/.gitkeep b/input/css/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/input/css/styles.css b/input/css/styles.css new file mode 100644 index 0000000..e06646e --- /dev/null +++ b/input/css/styles.css @@ -0,0 +1,118 @@ +* { + margin: 0; + padding: 0; +} + +body { + /* Positioning */ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + /* Styling */ + background-color: #bbedbe; +} + +h1 { + /* Positioning */ + width: 80%; + padding: 2vw; + + /* Font */ + font-size: 8vw; + text-align: center; +} + +h3 { + font-size: 4vw; +} + +h5 { + font-size: 2vw; +} + +h1, +h3, +h5, +p, +input { + color: #0e3610; +} + +#form { + /* Positioning */ + width: 80%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +form { + /* Form Shape */ + width: 60%; + padding: 2.5vw 5vw 2.5vw 5vw; + + /* Positioning */ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.row { + /* Row Shape */ + width: 100%; + display: flex; +} + +input { + /* Input Shape */ + width: 50%; + padding: 1vw; + margin: 1vw; + border: none; + border-radius: 18px; + + /* Styling */ + background-color: #f1fbf2; + + /* Font */ + font-size: 1vw; + font-weight: 400; +} + +button { + /* Button Shape */ + width: 60%; + padding: 1vw; + border: none; + border-radius: 18px; + + /* Font */ + color: white; + font-size: 1vw; + font-weight: 600; + + /* Transition for hover */ + transition-duration: 500ms; + + background-color: #1c6b20; +} + +button:hover { + background-color: #26942D; +} + +#confirmation { + width: 60%; + padding: 5vw 0 5vw 0; + border-radius: 18px; + background-color: #57d45f; + + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} diff --git a/input/img/.gitkeep b/input/img/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/input/index.php b/input/index.php new file mode 100644 index 0000000..2911a05 --- /dev/null +++ b/input/index.php @@ -0,0 +1,54 @@ + + + + + + Input + + + + + +

Input Assignment

+ +

Thank you for contacting me!

+
Your submitted information is:
+
+

Name: ' . $last_name . ', ' . $first_name . '

+

Email: ' . $email . '

+

Phone: ' . $phone_number . '

+
+ + '; +} else { + echo ' +
+
+
+ + +
+
+ + +
+ +
+
+'; +} +?> + + diff --git a/input/js/.gitkeep b/input/js/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/input/js/index.js b/input/js/index.js new file mode 100644 index 0000000..e69de29