rayelliott
/
hugo-coder-fork
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Enable RTL layout by providing 'rtl = true' in the config (#72)

This commit is contained in:
Khosrow Moossavi 2018-09-01 08:18:10 -04:00 committed by Luiz F. A. de Prá
parent 333e6358c8
commit 42d75aefe4
10 changed files with 81 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
README.md
View File

@ -53,6 +53,9 @@ disqusShortname = "yourdiscussshortname" # Enable or disable Disqus.
hideCredits = false hideCredits = false
hideCopyright = false hideCopyright = false
# to switch bewteen LTR and RTL layout
rtl = false
# Custom CSS # Custom CSS
custom_css = [] custom_css = []

23
assets/scss/_base_rtl.scss Normal file
View File

@ -0,0 +1,23 @@
body.rtl {
direction: rtl;
pre {
direction: ltr;
}
blockquote {
border-left: none;
border-right: 2px solid $alt-bg-color;
padding-left: 0;
padding-right: 1.6rem;
}
table tr td:first-child,
table tr th:first-child {
border-right: 0;
}
table tr td:last-child,
table tr th:last-child {
border-left: 0;
}
}

6
assets/scss/_colors.scss Normal file
View File

@ -0,0 +1,6 @@
// Colors
$bg-color: #fefefe !default;
$fg-color: #323232 !default;
$alt-bg-color: #dcdcdc !default;
$alt-fg-color: #000 !default;
$link-color: #3366CC !default;

2
assets/scss/_content.scss
View File

@ -46,8 +46,6 @@
width: 20.0rem; width: 20.0rem;
text-align: right; text-align: right;
margin-right: 3.0rem; margin-right: 3.0rem;
text-align: right;
margin-right: 3.0rem;
@media only screen and (max-device-width : 768px) { @media only screen and (max-device-width : 768px) {
display: block; display: block;
text-align: left; text-align: left;

16
assets/scss/_content_rtl.scss Normal file
View File

@ -0,0 +1,16 @@
body.rtl {
.list {
ul {
li {
span {
text-align: left;
margin-left: 3.0rem;
margin-right: 0;
@media only screen and (max-device-width : 768px) {
text-align: right;
}
}
}
}
}
}

13
assets/scss/_navigation_rtl.scss Normal file
View File

@ -0,0 +1,13 @@
body.rtl {
.navigation-list {
float: left;
@media only screen and (max-device-width : 768px) {
left: 0;
right: auto;
}
}
.navigation-item {
float: right;
}
}

4
assets/scss/coder-rtl.scss Normal file
View File

@ -0,0 +1,4 @@
@import "_colors";
@import "_base_rtl";
@import "_content_rtl";
@import "_navigation_rtl";

8
assets/scss/coder.scss
View File

@ -1,10 +1,4 @@
// Colors @import "_colors";
$bg-color: #fefefe !default;
$fg-color: #323232 !default;
$alt-bg-color: #dcdcdc !default;
$alt-fg-color: #000 !default;
$link-color: #3366CC !default;
@import "_base"; @import "_base";
@import "_content"; @import "_content";
@import "_navigation"; @import "_navigation";

2
exampleSite/config.toml
View File

@ -25,6 +25,8 @@ disqusShortname = "yourdiscussshortname"
hideCredits = false hideCredits = false
hideCopyright = false hideCopyright = false
rtl = false
# Custom CSS # Custom CSS
custom_css = [] custom_css = []

14
layouts/_default/baseof.html
View File

@ -28,6 +28,18 @@
<link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}" media="screen"> <link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}" media="screen">
{{ end }} {{ end }}
{{ if .Site.Params.rtl }}
{{ if .Site.IsServer }}
{{ $cssOpts := (dict "targetPath" "css/coder-rtl.css" "enableSourceMap" true ) }}
{{ $styles := resources.Get "scss/coder-rtl.scss" | resources.ExecuteAsTemplate "style.coder-rtl.css" . | toCSS $cssOpts }}
<link rel="stylesheet" href="{{ $styles.Permalink }}" media="screen">
{{ else }}
{{ $cssOpts := (dict "targetPath" "css/coder-rtl.css" ) }}
{{ $styles := resources.Get "scss/coder-rtl.scss" | resources.ExecuteAsTemplate "style.coder-rtl.css" . | toCSS $cssOpts | minify | fingerprint }}
<link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}" media="screen">
{{ end }}
{{ end }}
{{ range .Site.Params.custom_css }} {{ range .Site.Params.custom_css }}
<link rel="stylesheet" href="{{ . | absURL }}"> <link rel="stylesheet" href="{{ . | absURL }}">
{{ end }} {{ end }}
@ -43,7 +55,7 @@
{{ .Hugo.Generator }} {{ .Hugo.Generator }}
</head> </head>
<body> <body class="{{ if .Site.Params.rtl }}rtl{{ end }}">
<main class="wrapper"> <main class="wrapper">
{{ partial "header.html" . }} {{ partial "header.html" . }}