-
-
Notifications
You must be signed in to change notification settings - Fork 21
/
Copy pathindex.njk
77 lines (71 loc) · 3.74 KB
/
index.njk
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
---
layout: layouts/home.njk
eleventyNavigation:
key: Home
order: 1
---
<header class="c-header c-header--full">
<h1 class="c-header__title">RTL Styling 101</h1>
<p class="c-header__subline">
An extensive guide on how to style for RTL in CSS
</p>
<a href="/posts/rtl-styling" class="c-button">Read The Guide</a>
<p class="c-header__github">
<a href="https://github.com/shadeed/rtl-styling">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32.58 31.77">
<path d="M16.29 0a16.29 16.29 0 00-5.15 31.75c.82.15 1.11-.36 1.11-.79v-2.77C7.7 29.18 6.74 26 6.74 26a4.36 4.36 0 00-1.81-2.39c-1.47-1 .12-1 .12-1a3.43 3.43 0 012.49 1.68 3.48 3.48 0 004.74 1.36 3.46 3.46 0 011-2.18c-3.62-.41-7.42-1.81-7.42-8a6.3 6.3 0 011.67-4.37 5.94 5.94 0 01.16-4.31s1.37-.44 4.48 1.67a15.41 15.41 0 018.16 0c3.11-2.11 4.47-1.67 4.47-1.67a5.91 5.91 0 01.2 4.28 6.3 6.3 0 011.67 4.37c0 6.26-3.81 7.63-7.44 8a3.85 3.85 0 011.11 3v4.47c0 .53.29.94 1.12.78A16.29 16.29 0 0016.29 0z" fill="#231e1b" fill-rule="evenodd"/>
</svg>
View on Github
</a>
</p>
</header>
<section class="c-section">
<div class="o-wrapper">
<h2>Things to do</h2>
<ul class="c-list">
<li class="c-list__item">Add a section about blockquotes</li>
<li class="c-list__item">Lazy load the images</li>
<li class="c-list__item">Activate the current section in the sidebar</li>
<li class="c-list__item">RTL for CSS in JS (React, Vue)</li>
<li class="c-list__item">Consider writing about HTML inputs in detail</li>
<li class="c-list__item">Consider writing about word-wrap, overflow-wrap </li>
</ul>
</div>
</section>
<section class="c-section u-bg-light">
<div class="o-wrapper">
<h2>Issues</h2>
<p class="u-push-bottom">Have you noticed any issues in the guide? Like a typo, CSS Bug.. etc? Please feel free to open an issue. I created a dedicated repo for the issues only.</p>
<p><a href="https://github.com/shadeed/rtl-styling/issues/new" target="_blank" class="c-button c-button--outline">Open an Issue</a></p>
</div>
</section>
<section class="c-section">
<div class="o-wrapper">
<h2>Contributions</h2>
<p>If you are interested in contributing to this guide, the guide is available on Github. Your pull requests or issues are highly welcomed. Thank you!</p>
<p class="c-header__github">
<a href="https://github.com/shadeed/rtl-styling">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32.58 31.77">
<path d="M16.29 0a16.29 16.29 0 00-5.15 31.75c.82.15 1.11-.36 1.11-.79v-2.77C7.7 29.18 6.74 26 6.74 26a4.36 4.36 0 00-1.81-2.39c-1.47-1 .12-1 .12-1a3.43 3.43 0 012.49 1.68 3.48 3.48 0 004.74 1.36 3.46 3.46 0 011-2.18c-3.62-.41-7.42-1.81-7.42-8a6.3 6.3 0 011.67-4.37 5.94 5.94 0 01.16-4.31s1.37-.44 4.48 1.67a15.41 15.41 0 018.16 0c3.11-2.11 4.47-1.67 4.47-1.67a5.91 5.91 0 01.2 4.28 6.3 6.3 0 011.67 4.37c0 6.26-3.81 7.63-7.44 8a3.85 3.85 0 011.11 3v4.47c0 .53.29.94 1.12.78A16.29 16.29 0 0016.29 0z" fill="#231e1b" fill-rule="evenodd"/>
</svg>
View on Github
</a>
</p>
</div>
</section>
<section class="c-section u-bg-light">
<div class="o-wrapper">
<h2>Contact me</h2>
<p>I'll be happy to hear from you. If you have a suggestion, or you want to hire me for your Front End project that requires RTL work, I'm all ears. My email is shadeed9[at]gmail[dot]com</p>
</div>
</section>
<div class="o-wrapper">
<footer class="c-footer">
<p>Made by <a href="https://twitter.com/shadeed9">Ahmad Shadeed</a></p>
<p>
<a href="https://vercel.com/?utm_source=ahmadshadeed">
<img style="width: 160px;" src="../../img/powered-by.svg" alt="Powered By Vercel">
</a>
</p>
</footer>
</div>