add svgporn logo

shuang1989 · Jul 1, 2015 · f23949b · f23949b
1 parent b8c5c7a
commit f23949b
Show file tree

Hide file tree

Showing 6 changed files with 41 additions and 17 deletions.
diff --git a/assets/index.html b/assets/index.html
@@ -5,24 +5,25 @@
     <title>SVG PORN</title>
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0"/>
     <meta name="description" content="A collection of svg logos for developers. Programming languages, technologies, editors, libraries, frameworks, servers and services. angular, apache, atom, autoprefixer, aws, babel, backbone, bash, bem, bootstrap, bower, brackets, browserify, browserstack, capistrano, chai, chalk, chef, chrome, codepen, codeship, coffeescript, compass, couchdb, crossbrowsertesting, css 3, d3, digital ocean, django, docker, ember, emmet, engine yard, es6, eslint, express, firebase, firefox, flask, flow, flux, forever, git, github, gitlab, google cloud, google developers, grunt, gulp, haml, handlebars, hapi, harrow, heroku, html 5, io, ionic, jade, jasmine, javascript, jetbrains, jquery, json, jspm, karma, kraken, laravel, less, lodash, mariadb, marionette, markdown, mdn, memcached, meteor, mocha, modernizr, mongodb, mysql, nativescript, nginx, nodejitsu, nodejs, nodemon, npm, open graph, passport, phonegap, php, polymer, postgresql, puppet, python, q, rails, raphael, react, redis, require, rest, ruby, rubygems, sass, snap svg, socket.io, stackoverflow, stylus, svg, swift, travis ci, vagrant, w3c, webpack, webplatform, wercker, wordpress, yeoman"/>
-    <meta name="google-site-verification" content="ET-hv9IDuWbH4hVM3duPiEWZDgqvLaPMoPSRpQZlB44" />
     <meta property="og:title" content="SVG Logos"/>
     <meta property="og:site_name" content="Github — Gil Barbara"/>
     <meta property="og:url" content="http://gilbarbara.github.io/logos/"/>
     <meta property="og:description" content="A collection of svg logos for developers. Programming languages, technologies, editors, libraries, frameworks, servers and services."/>
     <meta property="og:image" content="http://gilbarbara.github.io/logos/og-image.png"/>
     <meta property="og:type" content="website"/>
+    <meta name="google-site-verification" content="hsF0-sA8sjC3wGoPZFBV8zHSJ4w8Suk7JYv-HSwE3B4" />
     <link href='//fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
     <!-- build:css(.tmp) main.css -->
     <link rel="stylesheet" href=".tmp/main.css">
     <!-- endbuild -->
 </head>
 <body>
 <div class="container">
-    <h1>SVG PORN</h1>
-
-    <h3>A collection of svg logos for developers. Programming languages, technologies, editors, libraries, frameworks, servers and services.</h3>
-    <h5><a href="https://github.com/gilbarbara/logos" target="_blank">Github</a></h5>
+    <div class="header">
+    	<img src="media/svg-porn.svg" class="logo"/>
+    	<h3>A collection of svg logos for developers. Programming languages, technologies, editors, libraries, frameworks, servers and services.</h3>
+	    <h5><a href="https://github.com/gilbarbara/logos" target="_blank">Github</a></h5>
+    </div>
 
     <div class="logos">
         <div>

diff --git a/assets/og-image.png → assets/media/og-image.png b/assets/og-image.png → assets/media/og-image.png
diff --git a/assets/media/svg-porn.svg b/assets/media/svg-porn.svg
diff --git a/assets/styles/base/_variables.scss b/assets/styles/base/_variables.scss
@@ -1,5 +1,5 @@
 $bg-color: #fff9f2;
-$link-color: #62cab8;
+$link-color: lighten(#f70017, 20%);
 
 $screen-xs: 480px;
 $screen-sm: 768px;

diff --git a/assets/styles/main.scss b/assets/styles/main.scss
@@ -27,36 +27,40 @@ a {
   padding-right: 1.5rem;
 }
 
-h1,
-h3,
-h5 {
+.header {
+  padding-top: 3rem;
   text-align: center;
+
+  @include md {
+    padding-top: 4rem;
+  }
+
+
 }
 
-h1 {
-  font-size: 3rem;
-  margin: 3rem 0 1.5rem;
+.logo {
+  width: 95%;
 
   @include md {
-    font-size: 4rem;
+    width: 70%;
   }
 
   @include lg {
-    font-size: 8rem;
+    width: 50%;
   }
 }
 
 h3 {
   font-size: 1.8rem;
-  margin: 0 auto 0.5rem;
+  margin: 2rem auto 0.5rem;
 
   @include md {
     font-size: 2.5rem;
+    margin-top: 4rem;
     max-width: 80%;
   }
 
   @include lg {
-    font-size: 3rem;
     max-width: 60%;
   }
 }

diff --git a/gulpfile.js b/gulpfile.js
@@ -25,6 +25,7 @@ gulp.task('bundle', function () {
         .pipe(assets.restore())
         .pipe($.useref())
         .pipe($.replace('../logos/', ''))
+        .pipe($.replace('media/', ''))
         .pipe(gulp.dest('.tmp'));
 });
 
@@ -50,7 +51,7 @@ gulp.task('serve', ['clean', 'styles'], function () {
 });
 
 gulp.task('deploy', ['styles', 'bundle'], function () {
-    return gulp.src(['logos/*.svg', '.tmp/*.html', '.tmp/main.css', 'assets/*.png', 'assets/CNAME', '*.md'])
+    return gulp.src(['logos/*.svg', '.tmp/*.html', '.tmp/main.css', 'assets/media/**/*', 'assets/CNAME', '*.md'])
         .pipe($.ghPages({
             force: true
         }));