Skip to content

Commit 812a7a3

Browse files
excentrisexcentris
committed
Initial commit
1 parent 84181fa commit 812a7a3

File tree

13 files changed

+722
-4
lines changed

13 files changed

+722
-4
lines changed

‎CNAME

Whitespace-only changes.

‎Gemfile

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
source 'https://rubygems.org'
2+
gem 'github-pages'

‎README.md

Lines changed: 21 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,21 @@
1-
compass
2-
=======
3-
4-
The Jekyll theme for your personal landing page
1+
# Documentation
2+
3+
Compass is a Jekyll theme designed with something very specific in mind: to be a simple and elegant personal landing page that can be easily deployed to [GitHub Pages](https://pages.github.com/).
4+
5+
## How to use Compass
6+
7+
1. Start by [installing Bundler](http://bundler.io) `gem install bundler`
8+
2. [Fork the Compass repository](https://github.com/excentris/compass/fork)
9+
3. Then run `bundle install` to get [Jekyll](http://jekyllrb.com) and all the dependencies.
10+
4. Clone the repository you just forked: `git clone https://github.com/YOUR-USER/compass`
11+
5. Edit `_config.yml` as needed.
12+
6. Run the Jekyll server with `bundle exec jekyll serve`
13+
7. Go to `http://localhost:4000`
14+
15+
## Deploy your site to GitHub Pages
16+
17+
If you want to use Compass as your personal landing page you can deploy your site to GitHub Pages as a [User Page](https://help.github.com/articles/user-organization-and-project-pages/#user--organization-pages). To do so, when you are done modifying your clone, you should rename your repository to `username.github.io` where username is your username. When GitHub builds the page it will be made available at `https://username.github.io`.
18+
19+
If you are planning on using a custom domain to direct to your site, modify the CNAME file as described [here](https://help.github.com/articles/adding-a-cname-file-to-your-repository/).
20+
21+
Check the [GitHub Pages Basics](https://help.github.com/categories/github-pages-basics/) for more information.

‎_config.yml

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
# general configuration
2+
url: http://excentris.net
3+
baseurl: /
4+
5+
# compass configuration
6+
compass:
7+
# an avatar or logo (optional)
8+
logo: "/images/compass.png"
9+
# author will appear under the avatar (optional)
10+
author: "Compass"
11+
# tagline will appear under the title (optional)
12+
tagline: "The <a href='http://jekyllrb.com'>Jekyll</a> theme for your personal landing page"
13+
# if include_content is true, the contents of the content.html include will be
14+
# added right above the generated item list, if present
15+
include_content: true
16+
# if include_analytics is true, the content of the analytics.html include will
17+
# be added at the end of the <head> section. You can add your Google Analytics
18+
# Tracking Code to that file.
19+
include_analytics: false
20+
21+
# Dependencies
22+
markdown: kramdown
23+
highlighter: pygments
24+
25+
# Permalinks
26+
permalink: pretty
27+
relative_permalinks: true
28+
29+
# Google Analytics
30+
analytics:
31+
# Add tracking code in _includes/_google-analytics.html
32+
google: false

‎_includes/analytics.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
<!-- Here you can add your Google Analytics Tracking code. If you do so, do not
2+
forget to set the include_analytics attribute to true on the _config.yml file -->

‎_includes/content.html

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<h2>About Compass</h2>
2+
<p>Compass has been designed with something very specific in mind: to be a simple and elegant personal landing page.</p>
3+
4+
<h2>Features</h2>
5+
<ul>
6+
<li>Responsive design</li>
7+
<li>Mobile friendly</li>
8+
<li>Easy deployment to <a href="https://pages.github.com/">GitHub Pages</a></li>
9+
</ul>
10+
11+
<p>For more information, including setup and configuration instructions, bug reports or feature requests head over to <a href="https://github.com/excentris/compass">GitHub</a>.</p>
12+
13+
<hr />
14+
15+
<ul class="fa-ul main-list">
16+
<li class="main-list-item">
17+
<span class="fa fa-github fa-lg main-list-item-icon"></span>
18+
<a href="https://github.com/excentris/compass">GitHub Repository</a>
19+
</li>
20+
<li class="main-list-item">
21+
<span class="fa fa-user fa-lg main-list-item-icon"></span>
22+
<a href="http://excentris.net">The Author</a>
23+
</li>
24+
</ul>

‎_includes/head.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<head>
2+
<meta http-equiv="content-type" content="text/html; charset=utf-8">
3+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
4+
<title>{{ site.compass.author }} &#8226; {{ site.compass.tagline | strip_html }}</title>
5+
6+
<link rel="apple-touch-icon" href="{{ site.compass.logo }}"/>
7+
<link rel="shortcut icon" sizes="16x16 24x24 32x32 48x48 64x64" href="{{ site.url }}/favicon.ico" />
8+
9+
<link rel="stylesheet" href="/assets/normalize.css">
10+
<link rel="stylesheet" href="/assets/main.css">
11+
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
12+
<link href='http://fonts.googleapis.com/css?family=Vollkorn' rel='stylesheet' type='text/css'>
13+
14+
<link rel="canonical" href="{{ site.url }}{{ page.url }}">
15+
16+
<meta name="author" content="{{ site.compass.author }}">
17+
<meta name="description" content="{{ site.compass.tagline }}"/>
18+
19+
<meta property="og:title" content="{{ site.compass.tagline }}"/>
20+
<meta property="og:url" content="{{ site.url }}{{ page.url }}"/>
21+
<meta property="og:image" content="{{ site.url }}/images{{ site.compass.logo }}"/>
22+
<meta property="og:description" content="{{ site.compass.description }}"/>
23+
<meta property="og:site_name" content="{{ site.compass.tagline }}">
24+
25+
{% if site.compass.include_analytics %}
26+
{% include analytics.html %}
27+
{% endif %}
28+
</head>

‎_layouts/base.html

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<!DOCTYPE html>
2+
<html>
3+
{% include head.html %}
4+
<body>
5+
6+
{{ content }}
7+
8+
</body>
9+
</html>

‎assets/main.scss

Lines changed: 150 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,150 @@
1+
---
2+
---
3+
4+
$text-color: #46433A;
5+
$anchor-text-color: #CE534D;
6+
$background-color: #F1EED9;
7+
8+
body {
9+
font-family: 'Vollkorn', serif;
10+
color: $text-color;
11+
background-color: $background-color;
12+
}
13+
14+
header,
15+
main {
16+
padding: 0 20px;
17+
}
18+
19+
/*** wrapper div for both header and main ***/
20+
.wrapper {
21+
margin-top: 10%;
22+
}
23+
24+
/*** anchor tags ***/
25+
a:link,
26+
a:visited,
27+
a:hover,
28+
a:active {
29+
color: $anchor-text-color;
30+
text-decoration: none;
31+
}
32+
33+
a:hover {
34+
text-decoration: underline;
35+
}
36+
37+
38+
/*** main content list ***/
39+
.main-list-item {
40+
font-weight: bold;
41+
font-size: 1.2em;
42+
margin: 0.8em 0;
43+
}
44+
45+
/* override the left margin added by font awesome for the main content list,
46+
since it must be aligned with the content */
47+
.fa-ul.main-list {
48+
margin-left: 0;
49+
}
50+
51+
/* list icons */
52+
.main-list-item-icon {
53+
width: 36px;
54+
color: $text-color;
55+
}
56+
57+
/*** logo ***/
58+
.logo-container {
59+
text-align: center;
60+
}
61+
62+
.logo {
63+
width: 96px;
64+
height: 96px;
65+
display: inline-block;
66+
background-size: cover;
67+
border-radius: 50%;
68+
-moz-border-radius: 50%;
69+
border: 2px solid $background-color;
70+
box-shadow: 0 0 0 3px $text-color;
71+
}
72+
73+
/*** author ***/
74+
.author-container h1 {
75+
font-size: 2.8em;
76+
margin-top: 0;
77+
margin-bottom: 0;
78+
text-align: center;
79+
}
80+
81+
/*** tagline ***/
82+
.tagline-container p {
83+
font-size: 1.3em;
84+
text-align: center;
85+
margin-bottom: 2em;
86+
}
87+
88+
/******/
89+
hr {
90+
border: 0;
91+
height: 1px;
92+
background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), $text-color, rgba(0,0,0,0));
93+
background-image: -moz-linear-gradient(left, rgba(0,0,0,0), $text-color, rgba(0,0,0,0));
94+
background-image: -ms-linear-gradient(left, rgba(0,0,0,0), $text-color, rgba(0,0,0,0));
95+
background-image: -o-linear-gradient(left, rgba(0,0,0,0), $text-color, rgba(0,0,0,0));
96+
}
97+
98+
/*** footer ***/
99+
footer {
100+
position: fixed;
101+
bottom: 0;
102+
right: 0;
103+
height: 20px;
104+
}
105+
106+
.poweredby {
107+
font-family: "Arial Narrow", Arial;
108+
font-size: 0.6em;
109+
line-height: 0.6em;
110+
padding: 0 5px;
111+
}
112+
113+
/*** media queries ***/
114+
/* X-Small devices (phones, 480px and up) */
115+
@media (min-width: 480px) {
116+
/* wrapper stays 480px wide past 480px wide and is kept centered */
117+
.wrapper {
118+
width: 480px;
119+
margin: 10% auto 0 auto;
120+
}
121+
}
122+
123+
/* All other devices (768px and up) */
124+
@media (min-width: 768px) {
125+
/* past 768px the layout is changed and the wrapper has a fixed width of 680px
126+
to accomodate both the header column and the content column */
127+
.wrapper {
128+
width: 680px;
129+
}
130+
131+
/* the header column stays left and has a dynamic width with all contents
132+
aligned right */
133+
header {
134+
float: left;
135+
width: 46%;
136+
text-align: right;
137+
}
138+
139+
.author-container h1,
140+
.logo-container,
141+
.tagline-container p {
142+
text-align: right;
143+
}
144+
145+
main {
146+
width: 46%;
147+
margin-left: 54%;
148+
padding: 0;
149+
}
150+
}

0 commit comments

Comments
 (0)