tryghost / casper Goto Github PK
View Code? Open in Web Editor NEWThe default theme for Ghost
Home Page: https://demo.ghost.io
License: MIT License
The default theme for Ghost
Home Page: https://demo.ghost.io
License: MIT License
As per TryGhost/Ghost#381
{{paginate}}
=> {{pagination}}
{{dateFormat}}
=> {{date}}
Needs to be done on Casper else master is broke :)
Should add microdata properties on the elements to make it friendly for the search engines.
This is a follow up on TryGhost/Ghost#1577 to make Casper ready for sub directory support.
Assets like CSS/JS should use the asset
helper to generate correct paths.
From @aboutte:
Really long post title does not display correctly
Smaller font size?
Client OS: Mac OS X 10.8.4
Server OS: CentOS 6
Node Version: 0.10.16
Ghost Build Number: 0.2.1
Latest Commit: e765af4
Browser: Chrome 28.0.1500.95
I think this is pretty much done, but needs double checking after #112 - make sure that the title, description, and any other data used to render the frontend is definitely what is expected
Right now Casper doesn't seem to have any tags that let social media sites such as Facebook or Twitter easily parse the content for their previews; thus sharing Ghost articles requires manual work to provide as much information as possible at a glance. (See this forum post for a user reporting problems with Facebook sharing and pre-filled information)
Implementation of these tags would improve sharing and encourage theme developers to include them as well.
Information on various tags:
Open Graph Protocol (Facebook)
Twitter Cards
On file post.hbs the title
variable passed to http://twitter.com/share must be URL-encoded otherwise a #
character will truncate the string.
For example try to create a post with title "Foo #bar".
I thought it might be helpful if I add in a "tag.hbs" file and a "package.json".
I've just styled the tag archive page to look much like the single post page.
I've also set the version number to 0.2.0 but I'm not sure if that's correct?
Will submit a pull request shortly.
This line has role="pagination" for
https://github.com/TryGhost/Casper/blob/master/index.hbs#L37
Output is incorrect, gives error in W3C validation of homepage.
You can change it to role="navigation"
http://www.w3.org/WAI/GL/wiki/Using_HTML5_nav_element#Example:The_.3Cnav.3E_element
My blog has two pages. When I navigate to the second page I see an error in the console that the request to http://local.tryghost.org/page/2/assets/js/index.js returned "400 not found".
<a class="blog-logo" href="{{@blog.url}}">
doesn't include the subdomain, if the blog is hosted on a subdomain
Should this be href='/'
? I notice in index.hbs
that the URLs are absolute from /
Same behaviour appears in the footer
Live example: http://blog.echoplex.us/2014/01/25/firefox-applications-are-easy/
Originally raised as TryGhost/Ghost#3668 by @dbalders
If you have a really long tag, the whole header is messed up and bleeds in with the rss feed making it un-clickable.
Casper currently has quite a few bits and pieces in it which don't work, these should be removed so that deployed blogs don't look weird or act broken.
Please hide (comment out) the following, and anything else you can find
@TryGhost You could add {{date format="YYYY"}} to the bottom of the default.hbs theme file. This will keep the year up to date.
The currently used version of fitvids can break layouts in Chrome 33.
On line 5:
<meta http-equiv="Content-Type" content="text/html" charset="UTF-8" />
should be:
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
This was originally raised on Ghost.
In 0efa582 @JohnONolan added a new feature to Casper, where images break out and become wider than the text.
However, that only seems to be happening on refresh, or second load, it never happens the first time. I have reproduced this on Firefox, so it doesn't seem to be part of the same issue as the big-font rendering issue which happens in Chrome/Safari?
For an example, visit hannah.wf and click on 'Spring Reflections'. Here it is in gif form:
It breaks out after I hit Cmd + R
.
Casper does not make any use of author.website - it probably could/should
When you are on tags template and dont have a {{blog.logo}} you can
t go back to home page, because the {{blog.title}} doesn`t have a link on it.
I have to think about which items on the page might be links. They might be more noticeable on better monitors, but it makes for bad UX for everyone else.
First of all, I wanted to say that I absolutely love Ghost, it is swesome! I also really like Casper theme, but it uses Droid Serif font, which does not support all the letters in my language (e.g, ā, ē, ī). I replaced it with Noto Serif, which is very similar, but I wanted to address this issue, because Casper is the default theme.
Currently the typography on posts could use some love.
Some helpful posts to better the typography overall beyond just the above:
Grids from typography
Between the lines
Fluid Type
After setting user location, it is ugly in small size screen such as iphone. You can just resize your browser to test. I think the location shoud be in the middle of the line which will be better. See the image!
Then I dig into the css code, at line 687 of the assets/css/screen.css
, I found the code below:
.author-meta li {
float: left;
margin-left: 10px; /* space to the left of the bullet */
}
After I detele float: left
, everything is ok. I wonder anyone has the same feeling.
Replace all instances of created_at with published_at
I downloaded the repo directly and made some changes on the post.hbs. After the compressed zip file is uploaded, the rendered page shows an error for the asset path of CSS/JS files:
=>
<link rel="stylesheet" type="text/css" href="<link rel=" stylesheet"="">
Ghost v0.3.2
screen.css
321 line. not correct hierarchy:
table.plain {
tbody > tr:nth-child(odd) > td,
tbody > tr:nth-child(odd) > th {
background: transparent;
}
}
and 414 line. Invalid value:
break-word
Any id's such as #ghost need to be removed or scoped to the part of the page they apply to
Related to #11
I actually meant to raise a naming issue about this - potentially better as "blog" rather than "settings" ? as in blog.title or blog.logo or blog.globalthingrelatingtotheblog
Rename "settings" to "blog". We may have other types of setting exposed to the frontend soon.
It would be nice if large images could break outside the width of the post content, but small images stayed centered, and all images went full-bleed on smaller screens. BUT CAN IT BE DONE?
Droid Serif doesn't support cyrillic, may be need to replace this font?
From an email;
There is just one thing though, if I uploaded a picture for the Cover with a lot of white color, the blog title and description can't be read. I advice it is best if both the title and description have tiny shadows on them.
Originally reported by @andyboutte here: TryGhost/Ghost#3514
With a long Website the link and link icon fall on separate lines
The link icon stays on the line with the Location but the URL falls to the next line
The link and the link icon should stay together
Client OS: Mac OS X 10.9.4
Server OS: Mac OS X 10.9.4
Node Version: v0.10.21
Ghost Build Number: 0.5.0 rc1
Latest Commit:
Ghost Database: SQLite3
Browser: Chrome 36.0.1985.125
Casper was never intended to have the concept of featured posts, but the first post on the homepage should always be displayed in full.
At the moment we have 2 different templates (partials) for displaying a post, the list one you see on the homepage, and the the "feature" one which you see when you click through to a post
As per http://john.onolan.org/, it was intended that the first post on the home page would be displayed in full.
Originally, I interpreted this as a post marked as a feature. But this is incorrect. Rather, it should just be the very first post in the list.
Casper is currently using the Google Font API in order to retrieve fonts. Due to the fact that these fonts are hosted on Google's servers, this presents a privacy risk to all viewers of blogs that use this theme and could cause additional downtime.
The fonts in question, Open Sans and Noto Serif, are both under the Apache License version 2.0 meaning that it would be acceptable to include them with Casper.
Use the pagination helper from TryGhost/Ghost#196 along with the additional work to wire it up in TryGhost/Ghost#197 to output working pagination on the homepage, and subsequent pages of posts.
Not sure if this is an issue but when running Casper 1.0.0 and you're in a post there is a link to 'Home' but there is also an emoji to the left of this. I did take a screenshot but can't seem to attach it from my iPhone.
I just got this comment on my blog using Ghost 0.3.3-azure.
"Your blog's theme is not dark-background-friendly at all. Apparently the text is defined as gray, but the background is not defined. My default background is gray so it looks... not great!"
This seems to cause some issue on Firefox where you can set the preferred background color to e.g. dark. Probably other browsers have the same features too.
Someone on twitter has reported that the styles of embedded gists look a little wonky.
You can include this tag in a post to test it out for yourself.
<script src="https://gist.github.com/jgable/6598091.js"></script>
Found by @AJ-Acevedo
The Ghost text in the header with the class blog-logo
looks different on a post page than it does on a static page.
The header of static pages look like this:
The header of post page looks like this:
Mac OS X 10.9.1
node 0.10.24
ruby 2.0.0p353
Sass 3.2.12
Dev Mode
DB: SQLite
The height of blog cover is smaller on page 2, etc. compared to the homepage.
Screenshot of blog cover on homepage (in the latest Firefox):
Screenshot of blog cover on page 2:
You can see a "live" version of this bug on my blog here. Please note that I tweaked the capser theme so that the blog cover height is 38% instead of 60%, but I checked and this does not affect the bug in any way.
Upon further investigation, I have found that on blog homepage, the html source contains:
<body class="home-template">
But on page 2, page 3, etc., the html source contains this instead:
<body class="archive-template">
If you look in "content/themes/casper/assets/css/screen.css", search for "archive-template" yields the following:
.archive-template .site-head {
height: auto;
padding-bottom: 5rem;
}
Note that the height is "auto". If you look at the main theme section, however, you will see:
.site-head {
position: relative;
display: table;
width: 100%;
height: 60%;
... ...
}
And you see the height is "60%" here. This explains why the blog cover is much less in height on page 2. Is this "by design"? Or is the "archive-template" incorrectly used on page 2, etc.?
Thank you for looking into this.
Line 18,
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.