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

Style and copy changes suggested by /r/webdev

Browse Source
This commit is contained in:
Chuck Dries
2017-08-08 14:04:44 -07:00
parent 7f5268d0f4
commit 3abaae7fc5
3 changed files with 41 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
css/style.css
View File

@@ -166,7 +166,7 @@ body {
color: white; }
#mast a {
color: white;
font-style: italic; }
font-style: inherit; }
#mast a:hover {
color: #ed1a76; }
#mast .sub {
@@ -179,8 +179,12 @@ body {
transition-duration: .2s;
color: #91EFFF; }
#spaceTakerUpper {
height: 100vh;
background: #202020; }
.small {
background: black; }
background: #202020; }
.small .hideable {
display: none;
opacity: 0; }
@@ -206,7 +210,7 @@ body {
background: white; }
.nojs #mast {
background: black; }
background: #202020; }
/*
* standalone elements
@@ -220,10 +224,10 @@ body {
.slide div .project {
width: 390px;
padding: 0 0 1em 0;
border: 1px solid #aaa;
border: 1px solid #eee;
border-radius: 5px;
overflow: hidden;
box-shadow: 1px 1px 4px #888;
box-shadow: 1px 1px 3px #ddd;
background: white; }
.slide div .project .cover {
height: 15em;
@@ -242,8 +246,8 @@ body {
.slide div .project .details .tag {
float: left;
padding: 0 .3em 0 .3em;
background: #eee;
border: 1px solid #ccc;
background: #f3f3f3;
border: 1px solid #ddd;
margin: .2em;
border-radius: 5px; }
.slide div .project .details .cat {

28
index.html
View File

@@ -17,13 +17,7 @@
<meta name="application-name" content="Chuck Dries" />
<meta name="msapplication-TileColor" content="#FFFFFF" />
<meta name="msapplication-TileImage" content="http://chuckdri.es/icons/mstile-144x144.png" />
<style>
#spaceTakerUpper {
height: 100vh;
background: black;
}
</style>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
@@ -66,11 +60,10 @@
<a name="about" style="padding-top: 130px"></a>
<h1>About Me <span style="font-size: .5em; font-weight:normal; color: #666;">Why I rock 🎶</span></h1>
<h3>A brief history of Chuck &amp; tech</h3>
<p>I'm mostly terrible at writing copy, but I think I'm a pretty good programmer. I've always been "into computers"
but I didn't really get into the technical stuff until middle school, where I had to learn about networking and
bash to run a minecraft server. Today, I do most of my "real" work in JavaScript (both on the client with VueJS
and the server with Node + Express), but I've been experimenting with Unity and keeping up with my Minecraft
habit.
<p>I'm a computer science student with experience in photography, digital and print graphic design, teaching, and leading.
I've been "into computers" my whole life, but I didn't really get into the technical stuff until middle school,
where I had to learn about networking and bash to run a minecraft server. Today, I do most of my work in JavaScript,
but in my free time I experiment with VR and game design.
</p>
<!--<h3>A brief history of Chuck &amp; tech</h3>
<p>When I was a child I was obsessed with trains and vacuum cleaners. In elementary school my grandma tried to teach me Photoshop. In seventh grade I started teaching myself HTML. Freshman year I started learning the basics of networking and BASH
@@ -203,7 +196,8 @@
</div>
</div>
<p>&copy; Chuck Dries 2017</p>
<p style="font-family: sans-serif">;)</p>
<br>
<!--ewwww-->
</div>
<script>
var last_known_scroll = getScrollY();
@@ -278,6 +272,14 @@
}
}
function openSkillTable() {
if (!t) {
st.style.display = "block";
stb.innerText = "Less about me";
t = true;
}
}
function prompt() {
}

23
sass/style.scss
View File

@@ -4,7 +4,8 @@
$width: 800px;
$grey: #ccc;
$pink: #ed1a76;
$greybg: rgba(0, 0, 0, .5);
$blue: #91EFFF;
$greybg: #202020;
.reset {
padding: 0;
margin: 0;
@@ -55,7 +56,7 @@ body {
color: white;
a {
color: white;
font-style: italic;
font-style: inherit;
}
a:hover {
color: $pink;
@@ -74,9 +75,14 @@ body {
}
}
#spaceTakerUpper {
height: 100vh;
background: $greybg;
}
//small and large classes are applied to #top
.small {
background: black;
background: $greybg;
.hideable {
display: none;
opacity: 0;
@@ -106,12 +112,13 @@ body {
}
}
//TODO: fix
.nojs {
body {
background: white;
}
#mast {
background: black;
background: $greybg;
}
}
@@ -132,10 +139,10 @@ body {
.project {
width: $width/2 - 10;
padding: 0 0 1em 0;
border: 1px solid #aaa;
border: 1px solid #eee;
border-radius: 5px;
overflow: hidden;
box-shadow: 1px 1px 4px #888;
box-shadow: 1px 1px 3px #ddd;
background: white;
.cover {
height: 15em;
@@ -159,8 +166,8 @@ body {
.tag {
float: left;
padding: 0 .3em 0 .3em;
background: #eee;
border: 1px solid #ccc;
background: #f3f3f3;
border: 1px solid #ddd;
margin: .2em;
border-radius: 5px;
}