arch/gmemstr.github.io
1
0
Fork 0
mirror of https://github.com/gmemstr/gmemstr.github.io.git synced 2024-09-20 04:31:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Revert "Optimized images & CSS."

Browse source 
This reverts commit e4657c37cb.
This commit is contained in:
gmemstr 2016-06-24 20:25:52 -07:00
parent e4657c37cb
commit 2c1897fd06
6 changed files with 315 additions and 77 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
css/reset.css
View file

@ -1,3 +1,8 @@
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
@ -10,12 +15,34 @@ table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section{display:block;}
body{line-height:1;}
ol, ul{list-style:none;}
blockquote, q{quotes:none;}
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after{content:'';content:none;}
table{border-collapse:collapse;border-spacing:0;}
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}

339
css/skeleton.css vendored
View file

@ -1,73 +1,284 @@
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700);*{margin:0;padding:0;}
body{font-size:1.5em;line-height:1.6;font-family:'Roboto', sans-serif;font-weight:400;background-color:#f9f9f9;margin-bottom:4%;}
header{font-weight:400;background-color:#9C27B0;color:#f9f9f9;padding-left:20%;box-shadow:0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);}
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,500,700);
* {
margin: 0;
padding: 0;
}
body {
font-size: 1.5em;
/* currently ems cause chrome bug misinterpreting rems on body element */
line-height: 1.6;
font-family: 'Roboto', sans-serif;
font-weight: 400;
background-color: #f9f9f9;
margin-bottom: 4%;
}
header {
font-weight: 400;
background-color: #9C27B0;
color: #f9f9f9;
padding-left: 20%;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.main-content {}
.project-img{border-radius:2px;}
.project{border-radius:2px;margin-top:10px;background:#fff;box-shadow:0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);transition:all 0.3s cubic-bezier(.25, .8, .25, 1);}
.project-content{display:inline-block;margin:0.5rem;position:relative;width:90%;}
.project:hover{box-shadow:0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);}
.project-content a:link, .project-content a:visited{font-weight:500;color:#607D8B;text-decoration:none;text-transform:uppercase;font-size:18px;}
.project-blue{color:#f9f9f9;background-color:#039be5;}
.project-red{color:#f9f9f9;background-color:#f44336;}
.project-gray{color:#f9f9f9;background-color:#546e7a;}
.project-side a:link, .project-side a:visited{color:#f9f9f9;}
.u-full-width{width:100%;box-sizing:border-box;}
.u-max-full-width{max-width:100%;box-sizing:border-box;}
.u-pull-right{float:right;}
.u-pull-left{float:left;}
h1{font-size:112px;line-height:1.2;letter-spacing:-.1rem;}
h2{font-size:56px;line-height:1.25;letter-spacing:-.1rem;}
h3{font-size:45px;line-height:1.3;letter-spacing:-.1rem;}
h4{font-size:34px;line-height:1.35;letter-spacing:-.08rem;}
h5{font-size:24px;line-height:1.5;letter-spacing:-.05rem;}
h6{font-size:1.5rem;line-height:1.6;letter-spacing:0;}
@media (min-width:550px){h1{font-size:112px;}
h2{font-size:56px;}
h3{font-size:45px;}
h4{font-size:34px;}
h5{font-size:24px;}
h6{font-size:1.5rem;}
.project-img {
border-radius: 2px;
}
.container{position:relative;width:100%;max-width:960px;margin:0 auto;padding:0 20px;box-sizing:border-box;}
.column, .columns{width:100%;float:left;box-sizing:border-box;}
@media (min-width:400px){.container{width:85%;padding:0;}
.project {
border-radius: 2px;
margin-top: 10px;
background: #fff;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}
@media (min-width:550px){.container{width:80%;}
.column, .columns{margin-left:4%;}
.column:first-child, .columns:first-child{margin-left:0;}
.one.column, .one.columns{width:4.66666666667%;}
.two.columns{width:13.3333333333%;}
.three.columns{width:22%;}
.four.columns{width:30.6666666667%;}
.five.columns{width:39.3333333333%;}
.six.columns{width:48%;}
.seven.columns{width:56.6666666667%;}
.eight.columns{width:65.3333333333%;}
.nine.columns{width:74.0%;}
.ten.columns{width:82.6666666667%;}
.eleven.columns{width:91.3333333333%;}
.twelve.columns{width:100%;margin-left:0;}
.one-third.column{width:30.6666666667%;}
.two-thirds.column{width:65.3333333333%;}
.one-half.column{width:48%;}
.offset-by-one.column, .offset-by-one.columns{margin-left:8.66666666667%;}
.offset-by-two.column, .offset-by-two.columns{margin-left:17.3333333333%;}
.offset-by-three.column, .offset-by-three.columns{margin-left:26%;}
.offset-by-four.column, .offset-by-four.columns{margin-left:34.6666666667%;}
.offset-by-five.column, .offset-by-five.columns{margin-left:43.3333333333%;}
.offset-by-six.column, .offset-by-six.columns{margin-left:52%;}
.offset-by-seven.column, .offset-by-seven.columns{margin-left:60.6666666667%;}
.offset-by-eight.column, .offset-by-eight.columns{margin-left:69.3333333333%;}
.offset-by-nine.column, .offset-by-nine.columns{margin-left:78.0%;}
.offset-by-ten.column, .offset-by-ten.columns{margin-left:86.6666666667%;}
.offset-by-eleven.column, .offset-by-eleven.columns{margin-left:95.3333333333%;}
.offset-by-one-third.column, .offset-by-one-third.columns{margin-left:34.6666666667%;}
.offset-by-two-thirds.column, .offset-by-two-thirds.columns{margin-left:69.3333333333%;}
.offset-by-one-half.column, .offset-by-one-half.columns{margin-left:52%;}
.project-content {
display: inline-block;
margin: 0.5rem;
position: relative;
width: 90%;
}
.container:after, .row:after, .u-cf{content:"";display:table;clear:both;}
.project:hover {
box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}
.project-content a:link, .project-content a:visited {
font-weight: 500;
color: #607D8B;
text-decoration: none;
text-transform: uppercase;
font-size: 18px;
}
.project-blue {
color: #f9f9f9;
background-color:#039be5;
}
.project-red {
color: #f9f9f9;
background-color: #f44336;
}
.project-gray {
color: #f9f9f9;
background-color: #546e7a;
}
.project-side a:link, .project-side a:visited {
color: #f9f9f9;
}
/* Skeleton stuff
------------------------------------ */
.u-full-width {
width: 100%;
box-sizing: border-box;
}
.u-max-full-width {
max-width: 100%;
box-sizing: border-box;
}
.u-pull-right {
float: right;
}
.u-pull-left {
float: left;
}
h1 {
font-size: 112px;
line-height: 1.2;
letter-spacing: -.1rem;
}
h2 {
font-size: 56px;
line-height: 1.25;
letter-spacing: -.1rem;
}
h3 {
font-size: 45px;
line-height: 1.3;
letter-spacing: -.1rem;
}
h4 {
font-size: 34px;
line-height: 1.35;
letter-spacing: -.08rem;
}
h5 {
font-size: 24px;
line-height: 1.5;
letter-spacing: -.05rem;
}
h6 {
font-size: 1.5rem;
line-height: 1.6;
letter-spacing: 0;
}
@media (min-width: 550px) {
h1 {
font-size: 112px;
}
h2 {
font-size: 56px;
}
h3 {
font-size: 45px;
}
h4 {
font-size: 34px;
}
h5 {
font-size: 24px;
}
h6 {
font-size: 1.5rem;
}
}
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
position: relative;
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.column, .columns {
width: 100%;
float: left;
box-sizing: border-box;
}
/* For devices larger than 400px */
@media (min-width: 400px) {
.container {
width: 85%;
padding: 0;
}
}
/* For devices larger than 550px */
@media (min-width: 550px) {
.container {
width: 80%;
}
.column, .columns {
margin-left: 4%;
}
.column:first-child, .columns:first-child {
margin-left: 0;
}
.one.column, .one.columns {
width: 4.66666666667%;
}
.two.columns {
width: 13.3333333333%;
}
.three.columns {
width: 22%;
}
.four.columns {
width: 30.6666666667%;
}
.five.columns {
width: 39.3333333333%;
}
.six.columns {
width: 48%;
}
.seven.columns {
width: 56.6666666667%;
}
.eight.columns {
width: 65.3333333333%;
}
.nine.columns {
width: 74.0%;
}
.ten.columns {
width: 82.6666666667%;
}
.eleven.columns {
width: 91.3333333333%;
}
.twelve.columns {
width: 100%;
margin-left: 0;
}
.one-third.column {
width: 30.6666666667%;
}
.two-thirds.column {
width: 65.3333333333%;
}
.one-half.column {
width: 48%;
}
/* Offsets */
.offset-by-one.column, .offset-by-one.columns {
margin-left: 8.66666666667%;
}
.offset-by-two.column, .offset-by-two.columns {
margin-left: 17.3333333333%;
}
.offset-by-three.column, .offset-by-three.columns {
margin-left: 26%;
}
.offset-by-four.column, .offset-by-four.columns {
margin-left: 34.6666666667%;
}
.offset-by-five.column, .offset-by-five.columns {
margin-left: 43.3333333333%;
}
.offset-by-six.column, .offset-by-six.columns {
margin-left: 52%;
}
.offset-by-seven.column, .offset-by-seven.columns {
margin-left: 60.6666666667%;
}
.offset-by-eight.column, .offset-by-eight.columns {
margin-left: 69.3333333333%;
}
.offset-by-nine.column, .offset-by-nine.columns {
margin-left: 78.0%;
}
.offset-by-ten.column, .offset-by-ten.columns {
margin-left: 86.6666666667%;
}
.offset-by-eleven.column, .offset-by-eleven.columns {
margin-left: 95.3333333333%;
}
.offset-by-one-third.column, .offset-by-one-third.columns {
margin-left: 34.6666666667%;
}
.offset-by-two-thirds.column, .offset-by-two-thirds.columns {
margin-left: 69.3333333333%;
}
.offset-by-one-half.column, .offset-by-one-half.columns {
margin-left: 52%;
}
}
.container:after, .row:after, .u-cf {
content: "";
display: table;
clear: both;
}
/* Larger than mobile */
@media (min-width: 400px) {}
/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}
/* Larger than tablet */
@media (min-width: 750px) {}
/* Larger than desktop */
@media (min-width: 1000px) {}
/* Larger than Desktop HD */
@media (min-width: 1200px) {}

BIN
images/moat.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 49 KiB

BIN
images/nodemc.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 407 KiB

BIN
images/simmertech.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 189 KiB

After

Width:  |  Height:  |  Size: 822 KiB

BIN
images/spigot.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 42 KiB

After

Width:  |  Height:  |  Size: 154 KiB