Maruan
GitHub
commit
e7822d4a89
2
LICENSE
2
LICENSE
@ -1,6 +1,6 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2017 Maruan Al-Shedivat.
|
||||
Copyright (c) 2018 Maruan Al-Shedivat.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
||||
this software and associated documentation files (the "Software"), to deal in
|
||||
|
||||
@ -39,13 +39,17 @@ By default, the script uses the `master` branch for the source code and deploys
|
||||
The optional flag `--user` tells it to deploy to `master` and use `source` for the source code instead.
|
||||
Using `master` for deployment is a convention for [user and organization pages](https://help.github.com/articles/user-organization-and-project-pages/).
|
||||
|
||||
**Note:** when deploying your user or organization page, make the `_config.yml` has `url` and `baseurl` fields as follows.
|
||||
**Note:** when deploying your user or organization page, make sure the `_config.yml` has `url` and `baseurl` fields as follows.
|
||||
|
||||
```
|
||||
url: # should be empty
|
||||
baseurl: # should be empty
|
||||
```
|
||||
|
||||
### Usage
|
||||
|
||||
Note that `_pages/about.md` is built to index.html in the published site. There is therefore no need to have a separate index page for the project. If an index page does exist in the root directory then this will prevent `_pages/about.md` from being added to the built site.
|
||||
|
||||
## Features
|
||||
|
||||
#### Ergonomic Publications
|
||||
@ -100,4 +104,4 @@ Style improvements and bug fixes are especially welcome.
|
||||
|
||||
## License
|
||||
|
||||
MIT
|
||||
The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
||||
@ -18,15 +18,15 @@ To give your project a background in the portfolio page, just add the img tag to
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.
|
||||
</div>
|
||||
<div class="img_row">
|
||||
<img class="col three" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
<img class="col three left" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
This image can also have a caption. It's like magic.
|
||||
@ -36,8 +36,8 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
<img class="col two left" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
You can also have artistically styled 2/3 + 1/3 images, like these.
|
||||
@ -50,6 +50,6 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
The code is simple. Just add a col class to your image, and another class specifying the width: one, two, or three columns wide. Here's the code for the last row of images above:
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="/img/6.jpg"/>
|
||||
<img class="col one" src="/img/11.jpg"/>
|
||||
<img class="col two left" src="/img/6.jpg"/>
|
||||
<img class="col one left" src="/img/11.jpg"/>
|
||||
</div>
|
||||
|
||||
@ -18,15 +18,15 @@ To give your project a background in the portfolio page, just add the img tag to
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.
|
||||
</div>
|
||||
<div class="img_row">
|
||||
<img class="col three" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
<img class="col three left" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
This image can also have a caption. It's like magic.
|
||||
@ -36,20 +36,20 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
<img class="col two left" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
You can also have artistically styled 2/3 + 1/3 images, like these.
|
||||
</div>
|
||||
|
||||
|
||||
<br/><br/><br/>
|
||||
<br/><br/>
|
||||
|
||||
|
||||
The code is simple. Just add a col class to your image, and another class specifying the width: one, two, or three columns wide. Here's the code for the last row of images above:
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="/img/6.jpg"/>
|
||||
<img class="col one" src="/img/11.jpg"/>
|
||||
</div>
|
||||
<img class="col two left" src="/img/6.jpg"/>
|
||||
<img class="col one left" src="/img/11.jpg"/>
|
||||
</div>
|
||||
@ -19,15 +19,15 @@ To give your project a background in the portfolio page, just add the img tag to
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.
|
||||
</div>
|
||||
<div class="img_row">
|
||||
<img class="col three" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
<img class="col three left" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
This image can also have a caption. It's like magic.
|
||||
@ -37,20 +37,21 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
<img class="col two left" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
You can also have artistically styled 2/3 + 1/3 images, like these.
|
||||
</div>
|
||||
|
||||
|
||||
<br/><br/><br/>
|
||||
<br/><br/>
|
||||
|
||||
|
||||
The code is simple. Just add a col class to your image, and another class specifying the width: one, two, or three columns wide. Here's the code for the last row of images above:
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="/img/6.jpg"/>
|
||||
<img class="col one" src="/img/11.jpg"/>
|
||||
<img class="col two left" src="/img/6.jpg"/>
|
||||
<img class="col one left" src="/img/11.jpg"/>
|
||||
</div>
|
||||
|
||||
|
||||
@ -18,15 +18,15 @@ To give your project a background in the portfolio page, just add the img tag to
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.
|
||||
</div>
|
||||
<div class="img_row">
|
||||
<img class="col three" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
<img class="col three left" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
This image can also have a caption. It's like magic.
|
||||
@ -36,20 +36,21 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
<img class="col two left" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
You can also have artistically styled 2/3 + 1/3 images, like these.
|
||||
</div>
|
||||
|
||||
|
||||
<br/><br/><br/>
|
||||
<br/><br/>
|
||||
|
||||
|
||||
The code is simple. Just add a col class to your image, and another class specifying the width: one, two, or three columns wide. Here's the code for the last row of images above:
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="/img/6.jpg"/>
|
||||
<img class="col one" src="/img/11.jpg"/>
|
||||
<img class="col two left" src="/img/6.jpg"/>
|
||||
<img class="col one left" src="/img/11.jpg"/>
|
||||
</div>
|
||||
|
||||
|
||||
@ -18,15 +18,15 @@ To give your project a background in the portfolio page, just add the img tag to
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.
|
||||
</div>
|
||||
<div class="img_row">
|
||||
<img class="col three" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
<img class="col three left" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
This image can also have a caption. It's like magic.
|
||||
@ -36,20 +36,21 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
<img class="col two left" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
You can also have artistically styled 2/3 + 1/3 images, like these.
|
||||
</div>
|
||||
|
||||
|
||||
<br/><br/><br/>
|
||||
<br/><br/>
|
||||
|
||||
|
||||
The code is simple. Just add a col class to your image, and another class specifying the width: one, two, or three columns wide. Here's the code for the last row of images above:
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="/img/6.jpg"/>
|
||||
<img class="col one" src="/img/11.jpg"/>
|
||||
<img class="col two left" src="/img/6.jpg"/>
|
||||
<img class="col one left" src="/img/11.jpg"/>
|
||||
</div>
|
||||
|
||||
|
||||
@ -18,15 +18,15 @@ To give your project a background in the portfolio page, just add the img tag to
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/1.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/2.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/3.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
Caption photos easily. On the left, a road goes through a tunnel. Middle, leaves artistically fall in a hipster photoshoot. Right, in another hipster photoshoot, a lumberjack grasps a handful of pine needles.
|
||||
</div>
|
||||
<div class="img_row">
|
||||
<img class="col three" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
<img class="col three left" src="{{ site.baseurl }}/assets/img/5.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
This image can also have a caption. It's like magic.
|
||||
@ -36,17 +36,20 @@ You can also put regular text between your rows of images. Say you wanted to wri
|
||||
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
<img class="col two left" src="{{ site.baseurl }}/assets/img/6.jpg" alt="" title="example image"/>
|
||||
<img class="col one left" src="{{ site.baseurl }}/assets/img/11.jpg" alt="" title="example image"/>
|
||||
</div>
|
||||
<div class="col three caption">
|
||||
You can also have artistically styled 2/3 + 1/3 images, like these.
|
||||
</div>
|
||||
|
||||
|
||||
<br/><br/>
|
||||
|
||||
|
||||
The code is simple. Just add a col class to your image, and another class specifying the width: one, two, or three columns wide. Here's the code for the last row of images above:
|
||||
|
||||
<div class="img_row">
|
||||
<img class="col two" src="/img/6.jpg"/>
|
||||
<img class="col one" src="/img/11.jpg"/>
|
||||
<img class="col two left" src="/img/6.jpg"/>
|
||||
<img class="col one left" src="/img/11.jpg"/>
|
||||
</div>
|
||||
|
||||
@ -19,7 +19,6 @@ figcaption {
|
||||
.col {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
object-fit: cover;
|
||||
box-sizing:border-box;
|
||||
padding: $img-spacing;
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
.profile {
|
||||
float: right !important;
|
||||
img {
|
||||
box-shadow: 0 0 5px $grey-color;
|
||||
width: 100%;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user