Skip to content

Abdirahim Hussein_Karma_Project_Week 2_Week3 #434

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

Open
12shussein wants to merge 12 commits into
base: master
Choose a base branch
from
Open

Abdirahim Hussein_Karma_Project_Week 2_Week3 #434

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
de1ec07
Abdirahim-Hussein- HTML-CSS-Module-Project
12shussein Jun 26, 2022
792084e
changed the images in css
12shussein Jul 1, 2022
2eb409f
added homepage extenstion
12shussein Jul 5, 2022
b3b77d2
changed icon sizes
12shussein Jul 7, 2022
04bdfc8
I have created the html for the store and form pag
12shussein Jul 7, 2022
d4dcb2c
improved a few tags
12shussein Jul 7, 2022
4d7c2e0
added a small section for sumbit
12shussein Jul 10, 2022
6bed59e
started css and added one radio button
12shussein Jul 11, 2022
7a38334
css file
12shussein Jul 11, 2022
956fcd3
added small form section and new checkbox, radio b
12shussein Jul 12, 2022
39d05c1
updated size of text box and repostioned page size
12shussein Jul 12, 2022
0dbded3
organised sumbit button and checkbox
12shussein Jul 13, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 8 additions & 5 deletions .github/pull_request_template.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,21 +16,24 @@ Please complete the details below this message

# Your Details

- Your Name:
- Your City:
- Your Slack Name:
- Your Name: Abdirahim Sharif Hussein
- Your City: Birmingham
- Your Slack Name:Abdirahim Sharif Hussein

# Homework Details

- Module:
- Week:
- Module: HTML-CSS-Module-Project
- Week: 2

# Notes

- What did you find easy?


- What did you find hard?
indenting the code

- What do you still not understand?


- Any other notes?
221 changes: 221 additions & 0 deletions css/store.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,221 @@
*{
margin: 0;
}
.colour-radio{
display: inline-flex;
align-items: center;
cursor: pointer;
margin-right: 10px;
}
.grey-radio{
display: inline-flex;
align-items: center;
cursor: pointer;
margin-right: 10px;
}
.header {
display: flex;
align-items: center;
justify-content: space-around;
height: 5rem;
width: 100%;
background-color: rgb(238, 231, 231);
}

.navigation-menu{
display: flex;
list-style: none;
}

.nav-item {
padding: 16px 0;

}
.nav-header{
color: grey;
font-weight: 500;
text-decoration: none;
padding: 0 1em;
margin-right: 10px;
transition: opacity 0.25s;
}
.nav-header:hover {
color: orangered;
}
/*form section*/
.main{
position: absolute;
width: 1318px;
height: 1235px;
left: 122px;
top: 98px;

}
.form-container {
margin: 0px 5%;
display: flex;
justify-content: space-between;
width: 70%;
height: 50%;
}

.image-form{
position: absolute;
width: 701px;
height: 1235px;
left: 739px;
top: 98px;
}

.title {
position: absolute;
width: 521px;
height: 118px;
left: 123px;
top: 214px;

font-family: 'Roboto';
font-style: normal;
font-weight: 500;
font-size: 50px;
line-height: 59px;

color: #DE6E49;
}

.form {
position: absolute;
width: 501px;
height: 849px;
left: 122px;
top: 414px;
}
.first-name {
position: absolute;
width: 235px;
height: 90px;
left: 122px;
top: 414px;
}
.Last-name {
position: absolute;
width: 235px;
height: 90px;
left: 384px;
top: 414px;
}

.first-name input,
.Last-name input{
width: 320px;
height: 50px;
margin-top: 1rem;
border: 3px solid rgb(177, 174, 174);
border-radius: 5px;
}

.Address {
position: absolute;
width: 499px;
height: 90px;
left: 122px;
top: 536px;
}
.Address input{
width: 685px;
height: 53px;
margin-top: 1rem;
border: 3px solid rgb(177, 174, 174);
border-radius: 4px;
}
.Address-2{
position: absolute;
width: 499px;
height: 90px;
left: 122px;
top: 658px;
}
.Address-2 input{
width: 685px;
height: 53px;
margin-top: 1rem;
border: 3px solid rgb(177, 174, 174);
border-radius: 5px;
}

.city{
position: absolute;
width: 250px;
height: 90px;
left: 122px;
top: 780px;
}
.city select {
width: 405px;
height: 50px;
margin-top: 1rem;
font-family: 'Roboto';
font-style: italic;
font-weight: 400;
font-size: 21px;
color: #666666;
border: 3px solid rgb(177, 174, 174);
border-radius: 5px;

}
.Postcode{
position: absolute;
width: 165px;
height: 90px;
left: 456px;
top: 790px;
}
.Postcode input{
width: 200px;
height: 45px;
margin-top: 0.2rem;
border: 3px solid rgb(177, 174, 174);
border-radius: 5px;
}
.colour-radio {
position: absolute;
width: 353px;
height: 70px;
left: 122px;
top: 940px;
width: 200px;
height: 53px;
margin-top: 1rem;
border: 3px solid rgb(177, 174, 174);
border-radius: 4px;
}

.checkbox {
position: absolute;
width: 500px;
height: 51px;
left: 123px;
top: 1106px;
}

.submit{
position: absolute;
width: 269px;
height: 70px;
left: 122px;
top: 1100px;

}
.submit button {
background: #E0633A;
font-family: 'Roboto';
font-style: normal;
color: white;
font-weight: 500;
font-size: 22px;
margin-top: 4em;
line-height: 26px;
width: 280px;
height: 70px;
border-radius: 0.25em;
}
Loading