Skip to content

My Viking CSS Garden Site #103

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
wants to merge 13 commits into
base: master
Choose a base branch
from
Open

My Viking CSS Garden Site #103

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
c273c5d
Updated the index and style sheets for the Viking Code School project 1.
Seamus88 Aug 23, 2017
c2feca1
Updated Index and Style for Viking Assignment.
Seamus88 Aug 23, 2017
5d69f8b
changed max-width to width on the header
Seamus88 Aug 23, 2017
8cce3cd
Flexbox Branch, Flexbox styling beginning
Seamus88 Aug 24, 2017
1602d92
Added FlexBox and Styling to Viking CSS page.
Seamus88 Aug 26, 2017
0c8242d
aside h2 changes
Seamus88 Aug 26, 2017
20d906b
Added name to readme file
Seamus88 Aug 26, 2017
c847ed6
Merge branch 'FlexBox' of https://github.com/Seamus88/assignment_viki…
Seamus88 Aug 26, 2017
dd430a6
Stylesheet update
Seamus88 Aug 26, 2017
39ffb3b
Merge pull request #1 from Seamus88/FlexBox
Seamus88 Aug 26, 2017
f50eec9
Merge remote-tracking branch 'refs/remotes/origin/master' into FlexBox
Seamus88 Aug 26, 2017
c9a5fd9
Small changes
Seamus88 Aug 26, 2017
5e7d3c1
Changes before creating a new branch.
Seamus88 Aug 26, 2017
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
3 changes: 3 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,9 @@ assignment_viking_css_garden

A place for your styling creativity to grow

James Cosgrove
[email protected]


**NOTE:** *This repo is copyrighted material for your private use only and not to be shared outside of Viking Code School.*

14 changes: 9 additions & 5 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@

<title>Viking CSS Garden</title>

<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="style.css" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Tangerine" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Raleway:500" rel="stylesheet">
</head>
<body>

Expand All @@ -18,6 +20,7 @@ <h2 class="tagline">A place for your styling creativity to grow</h2>


<!-- Main Content -->
<div class="main-box">
<main id="main-content">
<section class="main-content-section">
<h2 class="section-title">Growing Your Garden</h2>
Expand All @@ -42,11 +45,11 @@ <h2 class="section-title">Norse mythology</h2>

<cite class="citation">- From <a href="https://en.wikipedia.org/wiki/Norse_mythology">Norse Mythology</a></cite>
</section>
</main>
</main><!--

Sidebar

<!-- Sidebar -->
<aside id="sidebar">
--><aside id="sidebar">
<h2 class="section-title">Other Gardens</h2>

<nav class="sidebar-nav">
Expand Down Expand Up @@ -75,6 +78,7 @@ <h2 class="section-title">Other Gardens</h2>
</ul>
</nav>
</aside>
</div>
<footer></footer>
</body>
</html>

94 changes: 90 additions & 4 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,96 @@
/* ----------------------------------- *
* Your Styles Here
* ----------------------------------- */
body {
background: linear-gradient(to bottom, beige, white);
}
#main-header {
display: inline-flex;
flex-direction: row;
flex-wrap: wrap;
width: 100%;
height: auto;
font-family: tangerine, cursive;
font-size: 2.75em;
background: linear-gradient(to bottom, #B78E3D, beige)
}
.site-title {
order: 1;
flex-grow: 2;
margin: auto;
padding: 20px 0 0 0;
text-align: center;
}
.tagline {
order: 2;
flex-grow: 1;
margin: auto;
text-align: center;
padding: 20px 40px 0 0;
}
.main-box {
diplay: flex;
padding: 0;
margin: auto;
list-style: none;

display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;

-webkit-flex-flow: row wrap;
justify-content: center;
max-width: 1200px;
}
#sidebar {
order: 2;
margin: 0;
text-align: center;
}
section h2 {
margin: 50px 0 0 0;
font-family: raleway, serif;
font-size: 1.75em;

}
aside h2 {
display: inline-block;
margin: 0;
font-family: tangerine, serif;
font-size: 2.25em;
padding: 30px 0 0 0;
}
li {
font-family: raleway, serif;
display: inline-block;
text-decoration: none;
order: 3;
background: linear-gradient(to top, #B78E3D, beige);
margin: 0 0 100px 0;
width: 150px;
height: 25px;
border-bottom: 2px solid #926A1B;

}
li:hover {
background: linear-gradient(to top, #926A1B, beige)
}
li:visited {
background: linear-gradient(to top, #926A1B, beige)
}

#section-title {
order: 2;
}
li a {
text-decoration: none;
font-family: Raleway, serif;
color: black;
}


#main-content {
order: 1;
max-width: 900px;
text-align: center;
font-family: raleway, serif;
line-height: 1.5em;
}