Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Adding Search Bar and Hero Section #15

Merged
merged 3 commits into from
Mar 2, 2022
Merged

Adding Search Bar and Hero Section #15

merged 3 commits into from
Mar 2, 2022

Conversation

shriekdj
Copy link
Owner

@shriekdj shriekdj commented Mar 2, 2022 •
edited
Loading

Preface.

So Now I Made Some Changes About an Search Bar.

I Created the Search bar on Home Page of The Website

Section Addition in <body> tag.

I Added Given Code in body tag before main tag and after header tag.

<form method="GET" action="/search">
  <label>Search Here : </label>
  <input type="search" name="search-key" placeholder="Enter Your Query" />
  <input type="submit" />
</form>

Search Bar and Label Configuration..

I added the for attribute to label tag.

By Doing this Whenever we click the label element it automatically clicked to input bar as well.

The name attribute of input tag is used by back-end server as key name for dictionary of inputs in form.

<label for="search-id">Search Here : </label>
<input type="search" id="search-id" name="search-key" placeholder="Enter Your Query" />

Also Hero Section In main tag added

Like Given Below.

<section class="hero">
  <img src="#" alt="Hero Section Image" />
  <h1 class="page-title">Home Page</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</section>

Pull Request

#15

GitHub Repo

https://github.com/shriekdj/site-from-scratch

@shriekdj shriekdj merged commit 777e6cc into main Mar 2, 2022
@shriekdj shriekdj deleted the shriekdj-edits branch March 2, 2022 22:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@shriekdj