More image changes

* Margins for social icons
This commit is contained in:
Nishanth Shanmugham
2015-09-05 13:24:22 -05:00
parent edca32ef49
commit d36d3aa373
3 changed files with 40 additions and 20 deletions

View File

@@ -1,6 +1,6 @@
// Font imports // Font imports
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700); @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400);
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,400italic,700,700italic); @import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,400italic,700,700italic);
@import url(http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css); @import url(http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
@import url(http://fonts.googleapis.com/css?family=Raleway:200,700); @import url(http://fonts.googleapis.com/css?family=Raleway:200,700);
@@ -101,7 +101,7 @@ body {
@media (min-width: 550px) { @media (min-width: 550px) {
body { body {
.justify-content(center); // vertically center all sections .justify-content(center); // vertically center all sections
} }
} }
@@ -114,8 +114,8 @@ body {
// * Sections the cornerstone of page elements // * Sections the cornerstone of page elements
// * Container contains section contents // * Container contains section contents
// //
// Both classes are flex elements // Both classes are flex elements
.section { .section {
.flex-display(); .flex-display();
@@ -196,10 +196,15 @@ body {
text-align: center; text-align: center;
.flex-display(inline-flex); .flex-display(inline-flex);
} }
ul a { ul a {
margin-right: 12px; margin-left: 6px;
margin-right: 6px;
&:first-child {
margin-left: 0;
}
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
@@ -262,10 +267,15 @@ body {
.content { .content {
a { a {
margin-left: 6px;
margin-right: 6px; margin-right: 6px;
color: @milk; color: @milk;
.transition(~'color @{transition-speed-1} @{in-sine}'); .transition(~'color @{transition-speed-1} @{in-sine}');
&:first-child {
margin-left: 0;
}
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
@@ -294,8 +304,9 @@ body {
} }
.content { .content {
a { a {
margin-right: 4px; margin-left: 2px;
margin-right: 2px;
color: @gray; color: @gray;
&:hover { &:hover {
@@ -320,9 +331,9 @@ body {
.section.main { .section.main {
.container { .container {
.align-items(center); .align-items(center);
.justify-content(flex-start); .justify-content(flex-start);
} }
.content { .content {
color: @black; color: @black;
font-size: @base-font-size; font-size: @base-font-size;
@@ -378,7 +389,7 @@ body {
.section.main { .section.main {
.container.f04 { .container.f04 {
.justify-content(center); .justify-content(center);
.content { .content {
.flex-display(); .flex-display();
.flex-direction(column); .flex-direction(column);
@@ -402,7 +413,7 @@ body {
.section.main { .section.main {
.container.f04 { .container.f04 {
.justify-content(flex-start); .justify-content(flex-start);
.content { .content {
.align-items(flex-start); .align-items(flex-start);
@@ -463,7 +474,7 @@ body {
@media (min-width: 550px) { @media (min-width: 550px) {
@vspacing: 60px; @vspacing: 60px;
.container { .container {
margin: 0 @vspacing/2; margin: 0 @vspacing/2;
} }
@@ -471,7 +482,7 @@ body {
.section.header { .section.header {
padding-top: @vspacing; padding-top: @vspacing;
padding-bottom: @vspacing; padding-bottom: @vspacing;
} }
.section.icons { .section.icons {
padding-top: @vspacing; padding-top: @vspacing;

View File

@@ -154,7 +154,7 @@ blockquote p:last-child {
// Images and tables // Images and tables
img { img {
margin: 0 0 1rem; margin: 1rem 0;
max-width: 100%; max-width: 100%;
} }

View File

@@ -1,4 +1,4 @@
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700); @import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400);
@import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,400italic,700,700italic); @import url(http://fonts.googleapis.com/css?family=Ubuntu+Mono:400,400italic,700,700italic);
@import url(http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css); @import url(http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);
@import url(http://fonts.googleapis.com/css?family=Raleway:200,700); @import url(http://fonts.googleapis.com/css?family=Raleway:200,700);
@@ -202,7 +202,11 @@ body {
display: inline-flex; display: inline-flex;
} }
.section.header nav ul a { .section.header nav ul a {
margin-right: 12px; margin-left: 6px;
margin-right: 6px;
}
.section.header nav ul a:first-child {
margin-left: 0;
} }
.section.header nav ul a:last-child { .section.header nav ul a:last-child {
margin-right: 0; margin-right: 0;
@@ -263,6 +267,7 @@ body {
justify-content: center; justify-content: center;
} }
.section.icons .content a { .section.icons .content a {
margin-left: 6px;
margin-right: 6px; margin-right: 6px;
color: #fefefe; color: #fefefe;
-webkit-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72); -webkit-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
@@ -270,6 +275,9 @@ body {
-ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72); -ms-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
-o-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72); -o-transition: color 0.1s cubic-bezier(0.47, 0, 0.75, 0.72);
} }
.section.icons .content a:first-child {
margin-left: 0;
}
.section.icons .content a:last-child { .section.icons .content a:last-child {
margin-right: 0; margin-right: 0;
} }
@@ -293,7 +301,8 @@ body {
justify-content: flex-start; justify-content: flex-start;
} }
.section.icons .content a { .section.icons .content a {
margin-right: 4px; margin-left: 2px;
margin-right: 2px;
color: #b7b7b7; color: #b7b7b7;
} }
.section.icons .content a:hover { .section.icons .content a:hover {
@@ -601,7 +610,7 @@ img {
} }
} }
.section.main .content .markdown img { .section.main .content .markdown img {
margin: 0 0 1rem; margin: 1rem 0;
max-width: 100%; max-width: 100%;
} }
.section.main .content .markdown table { .section.main .content .markdown table {