chuckdries/Personal-Website
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Create Tags and Badges in rudimentary form

Browse Source
This commit is contained in:
Chuck Dries 2017-03-20 02:53:10 -07:00
parent 4dd59e8a7e
commit 1746a35b2a
3 changed files with 59 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
css/style.css
View File

@ -23,6 +23,8 @@ body {
#top div { #top div {
margin: auto; margin: auto;
max-width: 800px; } max-width: 800px; }
#top h2 {
font-weight: normal; }
#mast { #mast {
margin-top: 10px; margin-top: 10px;
@ -92,12 +94,26 @@ body {
background-size: cover; background-size: cover;
margin: 0px; margin: 0px;
padding: 1em; } padding: 1em; }
.slide div .project h2 { .slide div .project .details {
margin: .5em 0 0 1em; padding: .5em 1em 0 1em; }
padding: 0; } .slide div .project .details h2 {
.slide div .project p { margin: 0;
margin: 0 0 0 1.5em; padding: 0; }
text-indent: 0; } .slide div .project .details p {
margin: 0 0 0 0;
text-indent: 0; }
.slide div .project .details .tag {
float: left;
padding: 0 .3em 0 .3em;
background: #eee;
border: 1px solid #ccc;
margin: .2em;
border-radius: .3em; }
.slide div .project .details .tag.upper {
margin-top: .5em;
float: right; }
.slide div .project .details .tag.award {
background: #FFFCB7; }
.slide div .project:hover { .slide div .project:hover {
box-shadow: 1px 1px 3px #333; } box-shadow: 1px 1px 3px #333; }
.slide table { .slide table {

12
index.html
View File

@ -122,10 +122,16 @@
<div> <div>
<div class="project"> <div class="project">
<div class="cover" id="sierra"> <div class="cover" id="sierra">
<span class="award">Hackathon winner</span>
</div> </div>
<h2>Project Name</h2> <div class="details">
<p>Project description</p> <span class="award tag upper">Hackathon winner</span>
<h2>Project Name</h2>
<p class="description">Project description</p>
<span class="tag">Tech</span>
<span class="tag">Design</span>
<span class="tag">Javascript</span>
<span class="tag">NodeJs</span>
</div>
</div> </div>
</div> </div>
<br> <br>

35
sass/style.scss
View File

@ -32,6 +32,9 @@ body {
margin: auto; margin: auto;
max-width: $width; max-width: $width;
} }
h2 {
font-weight: normal;
}
} }
#mast { #mast {
@ -127,13 +130,31 @@ body {
margin: 0px; margin: 0px;
padding: 1em; padding: 1em;
} }
h2 { .details {
margin: .5em 0 0 1em; padding: .5em 1em 0 1em;
padding: 0; h2 {
} margin: 0;
p { padding: 0;
margin: 0 0 0 1.5em; }
text-indent: 0; p {
margin: 0 0 0 0;
text-indent: 0;
}
.tag {
float: left;
padding: 0 .3em 0 .3em;
background: #eee;
border: 1px solid #ccc;
margin: .2em;
border-radius: .3em;
}
.tag.upper {
margin-top: .5em;
float: right;
}
.tag.award {
background: #FFFCB7;
}
} }
} }
.project:hover { .project:hover {