From 1a35b91ac85eb24c1facaeabbb35909478934993 Mon Sep 17 00:00:00 2001 From: zepp Date: Mon, 4 Nov 2024 21:57:40 -0500 Subject: [PATCH] Add layout and required content --- freecodcamp/build-a-survey-form/index.html | 49 +++++++++++++ freecodcamp/build-a-survey-form/styles.css | 80 ++++++++++++++++++++++ 2 files changed, 129 insertions(+) create mode 100644 freecodcamp/build-a-survey-form/index.html create mode 100644 freecodcamp/build-a-survey-form/styles.css diff --git a/freecodcamp/build-a-survey-form/index.html b/freecodcamp/build-a-survey-form/index.html new file mode 100644 index 0000000..6d9de89 --- /dev/null +++ b/freecodcamp/build-a-survey-form/index.html @@ -0,0 +1,49 @@ + + + + + + Cat Owner Survey + + + + +
+

Cat Owner Survey Form

+

Please fill out this survey about cat ownership

+
+
+ Basic information + + + +
+
+ Cat Ownership Information + + +

Your cats are...

+ + +
+
+ Additional Information +

How do you learn about your cats? (choose any that apply)

+ + + + +
+ +
+
+ + \ No newline at end of file diff --git a/freecodcamp/build-a-survey-form/styles.css b/freecodcamp/build-a-survey-form/styles.css new file mode 100644 index 0000000..b5f981f --- /dev/null +++ b/freecodcamp/build-a-survey-form/styles.css @@ -0,0 +1,80 @@ +body { + width: 100%; + height: 100vh; + margin: 0; + background: linear-gradient(#01377D 85%,#009DD1, #97E7F5) no-repeat fixed; + color: #F5C400; + + } + + form { + margin: 0; + } + + .container { + min-width: 300px; + width: 80%; + max-width: 500px; + margin: 16px auto; + background-color: #0018407F; + border-radius: 10px; + padding: 48px; + } + + #title, #description { + text-align: center; + } + + #description { + margin-bottom: -4px; + } + + input { + display: block; + height: 35px; + width: 100%; + } + + input, select, textarea { + margin: 8px 0; + background-color: #001840; + color: #FFFDF0; + } + + input[type="radio"], input[type="checkbox"] { + width: unset; + display: inline; + } + + fieldset:nth-child(2) label, fieldset:nth-child(3) label { + display: block; + } + + fieldset { + border: none; + border-bottom: 1px solid #000000; + } + + fieldset:last-of-type { + border-bottom: none; + } + + textarea { + width: 100%; + margin-bottom: 8px; + } + + input[type=submit] { + background-color: #7ED348; + color: #00184D; + } + + + input[type="radio"], input[type="checkbox"] { + vertical-align: middle; + margin-right: 8px; + } + + legend { + margin-top: 16px; + } \ No newline at end of file