Layout change from left to right and better language support

Hey all,

Ghost is honestly increadible, but I’m having hard time writing in Hebrew and changing the layout from left to right (for example, moving the entire logo and header tabs fro, left to right).

I’ve seen some hold topics mentioning the same kind of issue, and there are many countries in the middle list that could use this platform to create great things, but it’s lacking these features.

Happy to hear what you think and discuss.

Thank you!

If you are using the Casper theme you can use the following CSS code for RTL layout. Copy and paste it into the Code Injection Site Header area.

<style>
body {
  text-align: right;
  direction: rtl;
}

.site-nav-logo {
  margin-right: 0;
  margin-left: 32px;
}

.site-nav-left {
  margin-right: 0;
  margin-left: 10px;
}

.site-nav-left .nav li:last-of-type {
  padding-right: 0;
  padding-left: 20px;
}

.nav-post-title.dash {
  left: auto;
  right: -25px;
}

.site-nav-main .site-nav-left-wrapper:after {
  right: auto;
  left: 0;
}

.author-header-content {
  margin: 5px 30px 0 0;
}

.author-card .author-info {
  margin: 0 20px 0 0;
}

.subscribe-overlay button {
  margin: 0 15px 0 0;
}

.subscribe-form button {
  margin: 0 10px 0 0 ;
}

@media (min-width: 795px) {
  .post-card-large .post-card-content-link,
  .post-card-large .post-card-meta {
    padding: 0 40px 0 0;
  }
}

.post-card-byline-content {
  margin: 2px 6px 0 0;
}

.static-avatar {
  margin: 0 -6px 0 0;
}

.post-full-byline-content .author-list {
  padding: 0 0 0 12px;
}

.author-list {
  margin: 0 4px 0 0;
}

.post-full-content blockquote {
  border-left: 0;
  border-right: 3px solid #3eb0ef;
}

.site-footer-nav a {
  margin-left: 0;
  margin-right: 20px;
}

.site-footer-nav a:before {
  left: auto;
  right: -11px;
}
</style>

For the Ghost admin, you can check out my recent topic about it Ghost Tips & Tricks #2 / Ghost Admin Right to Left (RTL) Support