diff --git a/Macbook pc.jpeg b/Macbook pc.jpeg new file mode 100644 index 0000000..12add58 Binary files /dev/null and b/Macbook pc.jpeg differ diff --git a/ability icon.jpeg b/ability icon.jpeg new file mode 100644 index 0000000..786941d Binary files /dev/null and b/ability icon.jpeg differ diff --git a/danny px.jpeg b/danny px.jpeg new file mode 100644 index 0000000..6e430ed Binary files /dev/null and b/danny px.jpeg differ diff --git a/iPhone...jpeg b/iPhone...jpeg new file mode 100644 index 0000000..8454d95 Binary files /dev/null and b/iPhone...jpeg differ diff --git a/iPhone1,14.jpeg b/iPhone1,14.jpeg new file mode 100644 index 0000000..333dde6 Binary files /dev/null and b/iPhone1,14.jpeg differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..6ac5353 --- /dev/null +++ b/index.html @@ -0,0 +1,56 @@ + + + + + + + + + Persnal Portifolio + + +
+
+
+
Home
 +
Profile
 +
+
+
Notifiction
 +
Settings
 +
Help
 +
+
+ + + +
+ +

ABILITY

 +

SKILLS

 + + +
+ +
+ +
+
HI THERE!
+
I'M A WEB DESIGNER
+

I'm a Rwandan based web designer & software
Engineer & user-friendly experiences, I'm
passionate about buildind execellent software that
improves the lives of those around me.

+
+ + +
MORE ABOUT ME
+
HOME
+ + +
+ Danny

+

Responsive Personal Portifolio Website using HTML,CSS &JS

+
+
+
+ + \ No newline at end of file diff --git a/skills icon.jpeg b/skills icon.jpeg new file mode 100644 index 0000000..31d3122 Binary files /dev/null and b/skills icon.jpeg differ diff --git a/style.css b/style.css new file mode 100644 index 0000000..5731caa --- /dev/null +++ b/style.css @@ -0,0 +1,286 @@ + + + @media screen and ( min-width:320px) {.body{ + background-color: #ece2e2; + + + } +.mainpage{ + margin-left: 100px; + position: fixed; + background-color: black; + width: 250px; + height: 230px; +} + +.sidebar img{ + margin-left: 2px; + border: solid black; + width: 30px; + height: 30px; + border-radius: 30px; +} +.mainpage img{ + height: 120px; + width: 80px; +} + + .navabars{ background-color: #126cf2; + height:100px; + width:100%; + grid-template-columns:repeat(5, 1fr); + text-align: center; + display: flex; + display: grid ; + grid-template-columns: repeat(5,1fr);} + +.navabars .right{ + margin-left: 28px; + margin-top: 80px; + display: grid; + grid-template-columns: repeat(3,1fr); + +} +.navabars .left{display: grid; + margin-left: -7px; + margin-top: 80px; + grid-template-columns: repeat(2,1fr); + +} +.left a h6{ + margin-top: 3px; +} + +.left a { + margin-top: -60px; + padding-bottom: 10px; + text-align: center; + margin-left: 8px; + /* margin-top: 5px; */ + border:solid #ee7b11; + background-color:#ee7b11 ; + width:40px; + height: 5px; + color: white; + /* margin-top: 5px; */ + text-decoration: none; + border-radius: 8px; + text-align: center;} + + .right a h6{ + margin-top: 3px; + } + .right a{ + margin-top: -60px; + padding-bottom: 10px; + text-align: center; + margin-left: 5px; + /* margin-top: 5px; */ + border:solid #ee7b11; + background-color:#ee7b11 ; + width:47px; + height: 7px; + color: white; + /* margin-top: 5px; */ + text-decoration: none; + border-radius: 8px; + text-align: center;} + + .sidebar a { + position: fixed; + /* visibility: hidden; */ + padding-top: 20px; + text-align: center; + padding-left: 100px; + color: white; + text-decoration: none; + width: 20px; + height: 10px; + background-color: #ee7b11; + border-radius: 10px; + margin-left: -1px;} + + .paragraph h5 b{ + color: #ee4422ee; } + + .paragraph h5{ + margin-left: 90px; + width: 155px; + margin-top: -110px; + color: white; + } + .paragraph h6{ + border: solid #126cf2; + margin-top: -120px; + color: white; + width: 20px; + margin-left: 100px; + } + +.home{ + text-align:center; + + text-align: right; + width: 50px; + height: 30px; + color: white; + background-color: #ee7b11; + margin-top: -118px; + margin-left: 30px; + border-radius: 10px; + padding-top: 5px; +} + +} +/* img{ + margin-top: 60px; + border:solid rgb(223, 230, 211); + height: 500px; + /* padding-bottom: 30px; */ + /* margin-left: 50px; + border-radius: 15px; + width: 340px; */ + +} */ +/* .email{ + text-align:center; + background-color: #fcd9a5; + width: 380px; + padding: 10px; + margin-left: 500px; + height: 70px; + margin-bottom: 350px; + color: black; + margin-top: 250px; + border-radius: 25px; + position: fixed; +} */ + + + +/* .home{ */ + /* padding-top: 20px; */ + /* text-align:center; */ + + /* text-align: right; */ + /* width: 150px; + height: 30px; + color: white; + background-color: #ee7b11; + margin-top: -250px; + margin-left: 830px; + border-radius: 30px; + padding-top: 15px; +} + + + +} */ +/* .sidebar img{ + border-radius: 30px; + margin-bottom: -100px; */ + + /* display: grid ; + grid-template-columns: repeat(4,1fr); */ +} +/* .bottom{ */ + /* border: solid black; */ + /* margin-top: 500px; + + color: #ee7b11; +} +.bottom p{ + color: white; +} */ +/* .inform{ + + width: 200px; + height: 50px; + color: white; + background-color: #d48f09; + margin-top: 20px; + margin-left: 500px; + border-radius: 30px; + padding-top: 20px; + padding-left: 30px; +} */ +/* .paragraph h1 b{ + color: #ee4422ee; +} +. +} */ +/* .intro{ + + background-color: #126cf2; + width: 1550px; + height: 150px; */ +} +} */ +.navabars { + /* text-align: center; */ + /* display: flex; */ + /* display: grid ; + grid-template-columns: repeat(5,1fr); */ + +/* } +.right{ + + display: grid ; + grid-template-columns: repeat(3,1fr); + margin-left: 300px; + margin-top: 30px; */ + +/* } +.left{ + margin-top: 30px; + display: grid ; + grid-template-columns: repeat(2,1fr); + /* margin-left: 10px; */ +/* } +.sidebar img{ + width: 60px; + height: 60px; */ */ +/* } +.mainpage{ + background-color: black; + border: solid black; + margin-top: -700px; */ + /* background-color: #0000; */ +} +/* .sidebar{ + margin-top: 500px; + +} +.sidebar a { + size: 200px; +text-decoration: none; */ +/* } + +} +/* .right a{ + padding-bottom: 45px; + margin-left: 110px; + margin-top: 15px; + border:solid #ee7b11; + background-color:#ee7b11 ; + width: 160px; + height: 7px; + color: white; + margin-top: 5px; + text-decoration: none; + border-radius: 30px; + text-align: center; */ +} */ */ + +/* .navabars a{ + margin-top: 15px; +border:solid #ee7b11; +background-color:#ee7b11 ; +width: 130px; +height: 40px; +color: white; +margin-top: 5px; +text-decoration: none; +border-radius: 20px; +text-align: center; +} */ \ No newline at end of file