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.

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

tigers L.MORA personal site #122

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
1 change: 1 addition & 0 deletions js-adagrams
Submodule js-adagrams added at a9e984
43 changes: 41 additions & 2 deletions pages/about.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,48 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel = "stylesheet" href = "styles/styles.css">
<title>Document</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap" rel="stylesheet">
</head>
<body>

<body class="color">
Comment on lines +10 to +13

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These should be indented over one more time

<ul>
<li>
<a class= "decoration" href = "portfolio.html">PORTFOLIO</a>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Based on W3 styling guide, it's better practice to not leave space before and after the =.

Suggested change
<a class= "decoration" href = "portfolio.html">PORTFOLIO</a>
<a class="decoration" href="portfolio.html">PORTFOLIO</a>

</li>
<li>
<a class= "decoration" href = "index.html">INDEX</a>
</li>
<li>
<a class= "decoration" href = "about.html">ABOUT</a>
</li>

</ul>
</nav>
</header>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You've got a closing header and nav tag, but not an opening one. It's a good idea to run your HTML through a validator to catch these mistakes.

<div class="grid-container">
<div>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's use section rather than div as much as we can

<img class="photos" src="img/IMG_4335.jpg">
<p></p>
<h1></h1>
</div>
<div>
<img class="photos" src="img/ca.jpg">
<p></p>
</div>
<div><img class="photos" src="img/pl.jpg">
<p><MI AMOR><p></div>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What's happening here? p needs a closing tag.

</div>
<header>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be above its matching closing tag

<h1></h1>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Even if this is a placeholder waiting for content, add some text to it.


<main class= flex-container2>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Attribute value should always have quotes around it

  <main class= "flex-container2">

LILYS PAGE
</main>
<footer>

</footer>
</body>
</html>
Binary file added pages/img/IMG_4335.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added pages/img/ca.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added pages/img/github.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added pages/img/pl.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added pages/img/plane.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
29 changes: 27 additions & 2 deletions pages/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,34 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel = "stylesheet" href = "styles/styles.css">
<title>Document</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap" rel="stylesheet">
</head>
<body>

<body class="color">
<nav>
<ul>
<li>
<a class= "decoration" href = "portfolio.html">PORTFOLIO</a>
</li>
<li>
<a class= "decoration" href = "index.html">INDEX</a>
</li>
<li>
<a class= "decoration" href = "about.html">ABOUT</a>
</li>
</ul>
</nav>
<center><h1>LILIAN ASHLEY MORA</h1></center>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

center is going out of style and should be replaced with the css styling rule text-align: center

<div class="flex-container">

<div>FOODIE</div>

<div>TRAVEL</div>
<div>MUSIC</div>
Comment on lines +30 to +33

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

div is used to divide elements, not display text. So let's put FOODIE and such inside a heading or paragraph tag inside the div. Or even better, replace div with section


</div>
</body>
</html>
30 changes: 28 additions & 2 deletions pages/portfolio.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,35 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel = "stylesheet" href = "styles/styles.css">
<title>Document</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap" rel="stylesheet">
</head>
<body>

<body class="color">
<nav>
<ul>
<li>
<a class= "decoration" href = "portfolio.html">PORTFOLIO</a>
</li>
<li>
<a class= "decoration" href = "index.html">INDEX</a>
</li>
<li>
<a class= "decoration" href = "about.html">ABOUT</a>
</li>
</ul>
</nav>
<div class="flex-container2">
<img class="photos" src="img/github.gif">
</div>
<div class="flex-container2">
<Ol>

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

tags are always lowercase: <ol>

<li> <a class= "decoration2" href="https://github.com/lilianashley/viewing-party">VIEWING PARTY</a></li>
<li> <a class= "decoration2" href="https://github.com/lilianashley/task-list-api">TASK LIST API </a></li>
<li><a class= "decoration2" href="https://github.com/lilianashley/personal-portfolio-site">PERSONAL PORTFOLIO SITE</a></li>
</Ol>
</div>
</body>
</html>
44 changes: 44 additions & 0 deletions pages/styles/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@

.photos{
height: 470px;
width: 470px;
}
.grid-container {
display: grid;
grid-template-columns: auto auto auto;
}
Comment on lines +6 to +9

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good job using css grid! 👍


.color{
background-color: black;
color: white;
font-family: 'Shadows Into Light', cursive;
font-size: 33px;
}
.font{
font-stretch: ultra-expanded
}
.decoration{
text-decoration: none;
color: white;
}
.decoration2{
text-decoration: none;
color: white;
font-weight: bold;
}
.flex-container {

display: flex;
justify-content: space-between;

}
.flex-container2 {

display: flex;
justify-content: center
}
Comment on lines +29 to +39

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Glad you used some flexbox styling! 👍


.gifphotos{
height: 250px;
width: 250px;
}
Empty file added task-list-api
Empty file.
1 change: 1 addition & 0 deletions task-list-front-end
Submodule task-list-front-end added at 97a0f1