Skip to content

first pull request - Lab 1 #4

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
StephanieCzetli wants to merge 6 commits into
base: main
Choose a base branch
from
+106 −1
Open

first pull request - Lab 1 #4

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
3997ab1
origin code
jwoods07 Dec 5, 2020
0a557a1
Added space - practice
StephanieCzetli Dec 5, 2020
07fcb7c
first commit on Filmon branch
Filmon-coder Dec 8, 2020
f14e23e
sample
StephanieCzetli Dec 10, 2020
040d2e6
Merge pull request #1 from jwoods07/Filmon-Abraham
StephanieCzetli Dec 10, 2020
1eb2431
resolved merge comflicts
StephanieCzetli Dec 10, 2020
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 HTML-CSS-Pair-Programming-Lab-1
Open in desktop
Submodule HTML-CSS-Pair-Programming-Lab-1 added at 3997ab
2 changes: 1 addition & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ You will pair program with a partner to complete this assignemnt. One partner, t
3. Display the Sidebar conent on the webpage
4. The page should have the correct coloring
5. Convert main content to a 2 column layout
6. The page should have the correct spacing
6. The page should have the correct spacing


## Mock Up
Expand Down
59 changes: 59 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>

<div class="container-header"> <!--header container-->
<header>
<h1>MyWebsite</h1>
</header>
</div>

<body>
<div class="container-main-content">
<main>
<div class="thumbnail">
<img src="https://www.ge.com/news/sites/default/files/styles/full_header/public/Reports/2020-03/GettyImages-530755444-e1496426370542.jpg?itok=67DfrtvX" alt="Golden Gate Bridge at Sunset">
</div>

<h2>This is a Lorem Ipsum Heading</h2>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Reiciendis, asperiores. Tempore ipsam, libero eveniet amet odit ex a dicta pariatur exercitationem alias, similique molestiae non sed repellendus sit aliquid nemo!</p>
<a href="">Read More</a>
</div>

<content>
<section class="sidebar">
<h3>SideBar Links</h3>
<hr>
<ul>
<li><a href="">Link 1</a></li>
<li><a href="">Link 2</a></li>
<li><a href="">Link 3</a></li>
<li><a href="">Link 4</a></li>
</ul>
</section>
</content>
<section>
<h3>Other Widgets</h3>
<hr>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Maxime aliquid excepturi sequi facilis nobis, saepe quis voluptas quisquam. Cum molestiae itaque amet dolorem. Temporibus voluptate est placeat laudantium nisi quas?</p>
<br>

<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. </p>
</section>

</main>


<section class="footer">
<footer>
<h6 class="footer-text">Copyright <span class="yoursite-orange">YourSite</span>. All Rights Reserved.</h6>
</footer>
</section>

</body>
</html>
45 changes: 45 additions & 0 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
h1{
color: orange;
background-color: black;
font-family: "Roboto";
padding: .75em .75em .75em .75em;
}

a {
color: orange;
}

body{
font-family: "Roboto";
}

img{
height: 100%;
width: 100%;
object-fit: cover;
}
.thumbnail{
height: 200px;
width: 200px;
float: left;
margin-right: 15px;
}
.sidebar{
display: inline-block;
}

.footer-text {
color: white;
text-align: center;
}

.yoursite-orange {
color: orange;
}

.footer-bar {
background-color: black;
font-family: "Roboto";
padding: .75em .75em .75em .75em;
}