-
Notifications
You must be signed in to change notification settings - Fork 12
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.
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
C15A - portfolio #8
base: master
Are you sure you want to change the base?
Conversation
<nav> | ||
<a href="#" class="navbar"> | ||
Nathalia Cervantes </a> | ||
|
||
<ul class="nav-list"> | ||
<li class="nav-item"><a href="index.html">Index</a></li> | ||
<li class="nav-item"><a href="about.html">About</a></li> | ||
<li class="nav-item"><a href="portfolio.html">Portfolio</a></li> | ||
<li class="nav-item"><a href="blog.html">Blog</a></li> | ||
</ul> | ||
</nav> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
great use of the nav tag
<!-- Main content area --> | ||
<div id="main"> | ||
<div class = "img" > | ||
<img src="images/photo.jpeg "/> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
when you use an image tag you want to add an alt attribute that describes the picture. This for accessibility purposes or if your image does not appear the alt text will show in its place. Learn more about it here.
<article class="about"> | ||
<h2 id="projects">About</h2> | ||
<p>Detail-oriented and driven entry-level software engineering professional with organized nature, customer-focused | ||
mindset and good critical thinking skills. Fluent in JavaScript and Ruby programming languages used | ||
to develop Web Applications. Proud team player focused on achieving project objectives with speed and | ||
accuracy.</p> | ||
|
||
<h2 id="hobbies">Hobbies</h2> | ||
|
||
<ul> | ||
<li>I love watch new shows on Netflix</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
</ul> | ||
|
||
<h2 id="fun-facts">Fun Facts</h2> | ||
<p>I have travel in 3 different continents</p> | ||
<ul> | ||
<li>Dive</li> | ||
<li>Camping</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
<li>I climb a vulcan</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
</ul> | ||
</article> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Love this section about you!
<nav> | ||
<a href="#" class="navbar"> | ||
Nathalia Cervantes </a> | ||
|
||
<ul class="nav-list"> | ||
<li class="nav-item"><a href="index.html">Index</a></li> | ||
<li class="nav-item"><a href="about.html">About</a></li> | ||
<li class="nav-item"><a href="portfolio.html">Portfolio</a></li> | ||
<li class="nav-item"><a href="blog.html">Blog</a></li> | ||
</ul> | ||
</nav> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
<ul> | ||
<li>I love watch new shows on Netflix</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
</ul> | ||
|
||
<h2 id="fun-facts">Fun Facts</h2> | ||
<p>I have travel in 3 different continents</p> | ||
<ul> | ||
<li>Dive</li> | ||
<li>Camping</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
<li>I climb a vulcan</li> | ||
<li>I love traveling</li> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this is repeated info from your about page. If you just want placeholder text you can use an example like this
<footer> | ||
© 2021 Nathalia Cervantes, All Rights Reserved. | ||
</footer> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Look at the JQuery resource I commented above to also make your footer reusable.
<img src="images/photo.jpeg "/> | ||
</div> | ||
<article class="projects"> | ||
<h2 id="projects">Projects</h2> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This is the same title as the one on line 36. Was that intended?
<li>Write code that interacts with the api routes</li> | ||
</ul> | ||
<p>Skills: Python, Flask</p> | ||
<p>Link:<a href="https://github.com/cervantesnathalia/solar-system-api">Solar System</a></p> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would add some type of styling to your project name to make the link stand out to users.
<p>I have travel in 3 different continents</p> | ||
<ul> | ||
<li>Dive</li> | ||
<li>Camping</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
<li>I climb a vulcan</li> | ||
<li>I love traveling</li> | ||
<li>I'm into</li> | ||
</ul> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
since you already using this in your about page, I would suggest adding some fun facts about working on your projects or learning to code.
height: 30%; | ||
text-align: center; | ||
margin: auto; | ||
float: center; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would look into using flex or grid for aligning your elements. It is more responsive than float. https://css-tricks.com/snippets/css/a-guide-to-flexbox/
margin: 0 auto; | ||
} | ||
|
||
.img{ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I would also look into the top property to move your image so that is not being cut off by the nav bar https://www.w3schools.com/cssref/pr_pos_top.asp
Overall good job on your portfolio ! I like the background image contrast with the black background. I added comments on styling, making your header/footer reusable and text to add instead of repeating information. |
No description provided.