diff --git a/Berbera beach.jpeg b/Berbera beach.jpeg new file mode 100644 index 0000000..302acc3 Binary files /dev/null and b/Berbera beach.jpeg differ diff --git a/Borama.jpg b/Borama.jpg new file mode 100644 index 0000000..ad475e0 Binary files /dev/null and b/Borama.jpg differ diff --git a/Bulhar.jpeg b/Bulhar.jpeg new file mode 100644 index 0000000..438151c Binary files /dev/null and b/Bulhar.jpeg differ diff --git a/Daallo Mountain.jpg b/Daallo Mountain.jpg new file mode 100644 index 0000000..5e2f6d8 Binary files /dev/null and b/Daallo Mountain.jpg differ diff --git a/Gacanlibah.jpeg b/Gacanlibah.jpeg new file mode 100644 index 0000000..fbc748c Binary files /dev/null and b/Gacanlibah.jpeg differ diff --git a/Laas Geel.jpeg b/Laas Geel.jpeg new file mode 100644 index 0000000..64d6968 Binary files /dev/null and b/Laas Geel.jpeg differ diff --git a/README.md b/README.md deleted file mode 100644 index 03e4501..0000000 --- a/README.md +++ /dev/null @@ -1,7 +0,0 @@ -## Design assignment - -You are required to create a webpage for a coding bootcamp and you are tasked to create just two pages for them: -* Home page -* About page - -You can deisgn the pages however you want be creative and once you've created the design share snippets of it with us on **#today-i-did** channel. Good luck! diff --git a/Saylac.jpeg b/Saylac.jpeg new file mode 100644 index 0000000..927cb27 Binary files /dev/null and b/Saylac.jpeg differ diff --git a/about.css b/about.css new file mode 100644 index 0000000..ff0a86f --- /dev/null +++ b/about.css @@ -0,0 +1,108 @@ +*{ + background-color: whitesmoke; +} +.backgroundimage{ + width: 98vw; + height: 50vh; + position: relative; + background-image: url("berbera.jpeg"); + background-size: cover; +} +.header-1 { + Display:flex; + justify-content:center; + align-items:flex-start; + color:rgb(19, 133, 19); + font-size:88px; + margin-top: 7px; + margin-bottom: 0px; +} +.header-2{ + display:flex; + justify-content:center; + color:black; + font-size:33px; + margin-top: 0px; + margin-bottom: 8px; +} +button{ + font-size:36px; + color:white; + background-color: red; + border: radius 3px; + border-color: black; + margin-top: 8px; +} +h1{ + display: flex; + justify-content: center; + font-size: 67px; + margin-bottom:0%; +} +h2{ + display:flex; + justify-content: center; + margin-top: 0%; +} +p{ + font-size:25px; + margin-top: 2px; + margin-left: 30px; + margin-right:30px; +} +.yup{ + font-size: 40px; + display:flex; + justify-content:center; + margin-bottom: 2px; + color:darkblue +} +h5{ + font-size: 33px; + margin-bottom: 2px; + color:maroon +} +.footer { + height: 40vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + gap: 20px; + background-color: black; + + color: #737373; + } + .footer > span { + align-self: start; + margin-left: 165px; + background-color: black; + } + .footer ul { + list-style: none; + background-color: black; + } + + .lists-container { + width: 100%; + display: flex; + justify-content: space-evenly; + align-items: center; + font-size: 13px; + background-color: black; + } + + .list { + display: flex; + flex-direction: column; + justify-content: flex-start; + align-items: flex-start; + gap: 10px; + background-color: black; + } + + .list > *:hover { + cursor: pointer; + text-decoration: underline; + background-color: black; + } \ No newline at end of file diff --git a/about.html b/about.html index f6ec97e..58614c4 100644 --- a/about.html +++ b/about.html @@ -4,10 +4,82 @@ -