Extract social and news as separate includes. Overall slight improvements.
This commit is contained in:
Maruan Al-Shedivat
parent
e3dfbf67c7
commit
8a3e818873
@ -16,4 +16,5 @@
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/KaTeX/{{ site.katex_version }}/katex.min.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="{{ site.baseurl }}/css/academicons.css">
|
||||
</head>
|
||||
|
||||
3
_includes/news.html
Normal file
3
_includes/news.html
Normal file
@ -0,0 +1,3 @@
|
||||
<div class="news">
|
||||
<h2>news</h2>
|
||||
</div>
|
||||
13
_includes/social.html
Normal file
13
_includes/social.html
Normal file
@ -0,0 +1,13 @@
|
||||
<div class="social">
|
||||
<span class="contacticon center">
|
||||
<a href="mailto:you@example.com"><i class="fa fa-envelope-square"></i></a>
|
||||
<a href="https://scholar.google.com" target="_blank" title="Google Scholar"><i class="ai ai-google-scholar-square"></i></a>
|
||||
<a href="https://github.com" target="_blank" title="GitHub"><i class="fa fa-github-square"></i></a>
|
||||
<a href="https://www.linkedin.com" target="_blank" title="LinkedIn"><i class="fa fa-linkedin-square"></i></a>
|
||||
<a href="https://twitter.com" target="_blank" title="Twitter"><i class="fa fa-twitter-square"></i></a>
|
||||
</span>
|
||||
|
||||
<div class="col three caption">
|
||||
You can even add a little note about which of these is the best way to reach you.
|
||||
</div>
|
||||
</div>
|
||||
@ -8,8 +8,16 @@ layout: default
|
||||
<h5 class="post-description">{{ page.description }}</h5>
|
||||
</header>
|
||||
|
||||
<article class="post-content">
|
||||
<article class="post-content clearfix">
|
||||
{{ content }}
|
||||
</article>
|
||||
|
||||
{% if page.news %}
|
||||
{% include news.html %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.social %}
|
||||
{% include social.html %}
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
|
||||
@ -2,27 +2,13 @@
|
||||
layout: page
|
||||
permalink: /
|
||||
title: your name
|
||||
description: Affiliations. Address. Contacts. Moto. Etc.
|
||||
description: <a href="">Affiliations</a>. Address. Contacts. Moto. Etc.
|
||||
news: true
|
||||
social: true
|
||||
---
|
||||
|
||||
<img class="col one right" src="/img/prof_pic.jpg">
|
||||
|
||||
<br/>
|
||||
Write your biography here. Tell the world about yourself. Link to your favorite <a href="http://reddit.com" target="blank">subreddit</a>. You can put a picture in, too. The code is already in, just name your picture "prof_pic.jpg" and put it in the img folder.
|
||||
Write your biography here. Tell the world about yourself. Link to your favorite [subreddit](http://reddit.com). You can put a picture in, too. The code is already in, just name your picture "prof_pic.jpg" and put it in the img folder.
|
||||
|
||||
Link to your social media connections, too. This theme is set up to use <a href="http://fortawesome.github.io/Font-Awesome/" target="blank">Font Awesome icons</a>, like the ones below. Add your Facebook, Twitter, LinkedIn, or just disable all of them.
|
||||
|
||||
|
||||
<br/>
|
||||
<hr/>
|
||||
<br/>
|
||||
<span class="contacticon center">
|
||||
<a href="mailto:you@example.com"><i class="fa fa-envelope-square"></i></a>
|
||||
<a href="https://github.com" target="_blank"><i class="fa fa-github-square"></i></a>
|
||||
<a href="https://www.linkedin.com" target="_blank"><i class="fa fa-linkedin-square"></i></a>
|
||||
<a href="https://twitter.com" target="_blank"><i class="fa fa-twitter-square"></i></a>
|
||||
</span>
|
||||
|
||||
<div class="col three caption">
|
||||
You can even add a little note about which of these is the best way to reach you.
|
||||
</div>
|
||||
Link to your social media connections, too. This theme is set up to use [Font Awesome icons](http://fortawesome.github.io/Font-Awesome/){:target="\_blank"} and [Academicons](https://jpswalsh.github.io/academicons/){:target="\_blank"}, like the ones below. Add your Facebook, Twitter, LinkedIn, Google Scholar, or just disable all of them.
|
||||
|
||||
@ -145,6 +145,11 @@ article a {
|
||||
}
|
||||
}
|
||||
|
||||
.social a {
|
||||
color: $text-color;
|
||||
|
||||
&:hover { color: $theme-color; }
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
|
||||
@ -70,6 +70,24 @@ display: line;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* News block **********************************************************
|
||||
*/
|
||||
.news {
|
||||
border-top: 1px solid $grey-color-light;
|
||||
margin-top: 50px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Social block **********************************************************
|
||||
*/
|
||||
.social {
|
||||
border-top: 1px solid $grey-color-light;
|
||||
margin-top: 50px;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
/**
|
||||
* Site footer **********************************************************
|
||||
*/
|
||||
@ -88,6 +106,7 @@ width: 100%;
|
||||
a { color: #fff; }
|
||||
a:hover { color: $theme-color; }
|
||||
}
|
||||
|
||||
/**
|
||||
* Pagination **********************************************************
|
||||
*/
|
||||
@ -104,86 +123,88 @@ a {
|
||||
color: $theme-color;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Page content **********************************************************
|
||||
*/
|
||||
.page-content {
|
||||
padding: 100px 0; /* VERTICAL PADDING FOR TITLE ON EVERY PAGE */
|
||||
padding: 100px 0; /* VERTICAL PADDING FOR TITLE ON EVERY PAGE */
|
||||
}
|
||||
.page-heading {
|
||||
font-size: 20px;
|
||||
font-size: 20px;
|
||||
}
|
||||
.post-list {
|
||||
margin: 0px 0;
|
||||
list-style: none;
|
||||
> li {
|
||||
margin-bottom: $vertical-spacing-unit;
|
||||
}
|
||||
margin: 0px 0;
|
||||
list-style: none;
|
||||
|
||||
> li {
|
||||
margin-bottom: $vertical-spacing-unit;
|
||||
}
|
||||
}
|
||||
.contacticon {
|
||||
font-size: 60px;
|
||||
display:block;
|
||||
margin: 10px;
|
||||
display: block;
|
||||
font-size: 60px;
|
||||
margin: 10px;
|
||||
}
|
||||
.center{
|
||||
text-align: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/**
|
||||
* Posts **********************************************************
|
||||
*/
|
||||
.post-header {
|
||||
margin-bottom: $vertical-spacing-unit;
|
||||
margin-bottom: $vertical-spacing-unit;
|
||||
}
|
||||
.post-title {
|
||||
font-size: 42px;
|
||||
letter-spacing: -1px;
|
||||
line-height: 1;
|
||||
margin-bottom: 10px;
|
||||
font-size: 42px;
|
||||
letter-spacing: -1px;
|
||||
line-height: 1;
|
||||
margin-bottom: 10px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 36px;
|
||||
}
|
||||
}
|
||||
.post-content {
|
||||
h2 {
|
||||
font-size: 42px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 28px;
|
||||
}
|
||||
h2 {
|
||||
font-size: 42px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 28px;
|
||||
}
|
||||
h3 {
|
||||
font-size: 30px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 22px;
|
||||
}
|
||||
}
|
||||
h3 {
|
||||
font-size: 30px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 22px;
|
||||
}
|
||||
h4 {
|
||||
font-size: 20px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
h4 {
|
||||
font-size: 20px;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.post-meta {
|
||||
font-size: $small-font-size;
|
||||
color: $grey-color;
|
||||
margin-bottom: 0px;
|
||||
color: $grey-color;
|
||||
font-size: $small-font-size;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
.post-link {
|
||||
display: block;
|
||||
font-size: 42px;
|
||||
display: block;
|
||||
font-size: 42px;
|
||||
}
|
||||
|
||||
/** Poem formatting ********************************************/
|
||||
.poem-title {
|
||||
font-size: 24px;
|
||||
letter-spacing: -1px;
|
||||
line-height: 1;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 16px;
|
||||
}
|
||||
font-size: 24px;
|
||||
letter-spacing: -1px;
|
||||
line-height: 1;
|
||||
@include media-query($on-laptop) {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Portfolio grid **********************************************************
|
||||
*/
|
||||
@ -191,90 +212,91 @@ font-size: 16px;
|
||||
// http://nicolasgallagher.com/micro-clearfix-hack/
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
clear: both;
|
||||
}
|
||||
.project {
|
||||
width: 33.33%;
|
||||
height: 250px;
|
||||
float: left;
|
||||
vertical-align: middle;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
box-sizing: border-box;
|
||||
float: left;
|
||||
height: 250px;
|
||||
padding: 10px;
|
||||
vertical-align: middle;
|
||||
width: 33.33%;
|
||||
}
|
||||
.thumbnail{
|
||||
width: 100%;
|
||||
height: 230px;
|
||||
overflow: hidden;
|
||||
.thumbnail {
|
||||
overflow: hidden;
|
||||
height: 230px;
|
||||
width: 100%;
|
||||
}
|
||||
.thumbnail img{
|
||||
width: 500px;
|
||||
height: auto;
|
||||
position: relative;
|
||||
left: -25%;
|
||||
top: -5%;
|
||||
height: auto;
|
||||
position: relative;
|
||||
left: -25%;
|
||||
top: -5%;
|
||||
width: 500px;
|
||||
}
|
||||
.thumbnail a{
|
||||
float: left;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 230px;
|
||||
float: left;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 230px;
|
||||
}
|
||||
.thumbnail a span {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0,0,0,0.4);
|
||||
color: $grey-color-light;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
background: rgba(0,0,0,0.4);
|
||||
color: $grey-color-light;
|
||||
padding: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
.thumbnail a:hover span {
|
||||
display: block;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Portfolio pages **********************************************************
|
||||
*/
|
||||
.blankbox{
|
||||
background: $theme-color;
|
||||
background: $theme-color;
|
||||
}
|
||||
.img_row{
|
||||
height: $img_height;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
box-sizing:border-box;
|
||||
padding: $img_spacing;
|
||||
height: $img_height;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
box-sizing:border-box;
|
||||
padding: $img_spacing;
|
||||
}
|
||||
.col{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
object-fit: cover;
|
||||
box-sizing:border-box;
|
||||
padding: $img_spacing;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
object-fit: cover;
|
||||
box-sizing:border-box;
|
||||
padding: $img_spacing;
|
||||
}
|
||||
.right{
|
||||
float: right;
|
||||
float: right;
|
||||
}
|
||||
.one {
|
||||
width:33.33%;
|
||||
width:33.33%;
|
||||
}
|
||||
.two {
|
||||
width: 66.66%;
|
||||
width: 66.66%;
|
||||
}
|
||||
.three{
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.caption{
|
||||
height: 100%;
|
||||
color: $caption_color;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
font-size: $caption_font_size;
|
||||
height: 100%;
|
||||
color: $caption_color;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
font-size: $caption_font_size;
|
||||
}
|
||||
|
||||
99
css/academicons.css
Normal file
99
css/academicons.css
Normal file
@ -0,0 +1,99 @@
|
||||
/*!
|
||||
* Academicons 1.5.0 by James Walsh - https://github.com/jpswalsh
|
||||
* Fonts generated using the IcoMoon app - http://icomoon.io/app
|
||||
* Square icons designed to be used alongside Font Awesome square icons - https://fortawesome.github.io/Font-Awesome/
|
||||
* License - Font: SIL OFL 1.1, CSS: MIT License
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: 'academicons';
|
||||
src:url('fonts/academicons.eot?qbqm87');
|
||||
src:url('fonts/academicons.eot?#iefixqbqm87') format('embedded-opentype'),
|
||||
url('fonts/academicons.ttf?qbqm87') format('truetype'),
|
||||
url('fonts/academicons.woff?qbqm87') format('woff'),
|
||||
url('fonts/academicons.svg?qbqm87#academicons') format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
.ai {
|
||||
display:inline-block;
|
||||
font:normal normal normal 14px/1 Academicons;
|
||||
font-size:inherit;
|
||||
text-rendering:auto;
|
||||
-webkit-font-smoothing:antialiased;
|
||||
-moz-osx-font-smoothing:grayscale;
|
||||
}
|
||||
|
||||
.ai-google-scholar:before {
|
||||
content: "\e600";
|
||||
}
|
||||
.ai-google-scholar-square:before {
|
||||
content: "\e601";
|
||||
}
|
||||
.ai-researchgate:before {
|
||||
content: "\e612";
|
||||
}
|
||||
.ai-researchgate-square:before {
|
||||
content: "\e613";
|
||||
}
|
||||
.ai-mendeley:before {
|
||||
content: "\e604";
|
||||
}
|
||||
.ai-mendeley-square:before {
|
||||
content: "\e605";
|
||||
}
|
||||
.ai-orcid:before {
|
||||
content: "\e606";
|
||||
}
|
||||
.ai-orcid-square:before {
|
||||
content: "\e607";
|
||||
}
|
||||
.ai-impactstory:before {
|
||||
content: "\e608";
|
||||
}
|
||||
.ai-impactstory-square:before {
|
||||
content: "\e609";
|
||||
}
|
||||
.ai-academia:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
.ai-academia-square:before {
|
||||
content: "\e60b";
|
||||
}
|
||||
.ai-zotero:before {
|
||||
content: "\e60c";
|
||||
}
|
||||
.ai-zotero-square:before {
|
||||
content: "\e60d";
|
||||
}
|
||||
.ai-figshare:before {
|
||||
content: "\e60e";
|
||||
}
|
||||
.ai-figshare-square:before {
|
||||
content: "\e60f";
|
||||
}
|
||||
.ai-dryad:before {
|
||||
content: "\e610";
|
||||
}
|
||||
.ai-dryad-square:before {
|
||||
content: "\e611";
|
||||
}
|
||||
.ai-arxiv:before {
|
||||
content: "\e616";
|
||||
}
|
||||
.ai-arxiv-square:before {
|
||||
content: "\e617";
|
||||
}
|
||||
.ai-scirate:before {
|
||||
content: "\e614";
|
||||
}
|
||||
.ai-scirate-square:before {
|
||||
content: "\e615";
|
||||
}
|
||||
.ai-researchgate-old:before {
|
||||
content: "\e602";
|
||||
}
|
||||
.ai-researchgate-old-square:before {
|
||||
content: "\e603";
|
||||
}
|
||||
BIN
css/fonts/academicons.eot
Normal file
BIN
css/fonts/academicons.eot
Normal file
Binary file not shown.
54
css/fonts/academicons.svg
Normal file
54
css/fonts/academicons.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 88 KiB |
BIN
css/fonts/academicons.ttf
Normal file
BIN
css/fonts/academicons.ttf
Normal file
Binary file not shown.
BIN
css/fonts/academicons.woff
Normal file
BIN
css/fonts/academicons.woff
Normal file
Binary file not shown.
Loading…
Reference in New Issue
Block a user