Fixes and enhancements. [12]

[ivan-nginx]

PART 1. Android Chrome Color.

Files modified:

1. ADD: Android Chrome Color [1]. c2eb4ec
2. ADD: Android Chrome Color [2]. 0b49d9f

How it looks?

How to use?

In Next _config.yml:

# Android Chrome header panel color ($black-deep).
android_chrome_color: "#222"

---

PART 2. Add note tag modern style, flat style & refactor note basic style.

Reference for #1682.

Files modified:

1. ADD: note tag modern style [1]. fc4804c
2. ADD: note tag modern style [2]. 136c2a7
3. ADD: note tag modern style [3]. 3762c0c
4. MOD: note tag style [4]. 15447b4
5. MOD: note tag basic & modern style [5]. 1ed8bf4
6. FIX: note tag style [6]. 570874e
7. MOD: note tag js [7]. 11d0f2e
8. MOD: refactor note tag [1]. 87d6878
9. MOD: refactor note tag [2]. 38dd0da
10. MOD: refactor note tag [3]. 86cc0e9
11. MOD: refactor note tag [4]. 1365f90
12. MOD: refactor note tag [5]. 74d11d5

How it looks?

Basic note style:

Modern note style:

Live demo with modern note style here.

Flat note style:

Live demo with flat note style here.

How to use?

In Next _config.yml:

# Note tag (bs-callout).
note:
  # Note tag style values:
  #  - simple    bs-callout old alert style. Default.
  #  - modern    bs-callout new (v2-v3) alert style.
  #  - flat      flat callout style with background, like on Mozilla or StackOverflow.
  #  - disabled  disable all CSS styles import of note tag.
  style: modern
  icons: true
  border_radius: 3
  # Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).
  light_bg_offset: 0

In base.styl (source/css/_variables/base.styl) u can see many variables. And if u want to modify them, need just rewrite needed by u variable in custom.styl (source/css/_variables/custom.styl).

To use tag please write it in right way!
No need to write this in 1 line, like that:

{% note danger %}note danger, note danger, note danger{% endnote %}

or like that:

{% note danger %}note danger
note danger
note danger{% endnote %}

Need to write it like u may see in note documentation link (#1160), like this:

{% note danger %}
note danger, note danger, note danger
note danger, note danger, note danger
note danger, note danger, note danger
{% endnote %}

To use note style with enabled icons option, but without icon for current note, u can use:

{% note danger no-icon %}
note without icon
{% endnote %}

---

PART 3. Add social icons_only & transition option.

Reference for #1730.

Files modified:

1. ADD: social icons only&transition option [1]. 1f893ae
2. ADD: social icons only option [2]. c96ace2
3. ADD: social icons only option [3]. 963f092
4. ADD: social icons only&transition option [4]. dbeebbf
5. FIX: b2t transition style. 9744c24

How it looks?

Social icons with labels:

Only social icons (without labels):

Live demo with social icons without labels here.

How to use?

In Next _config.yml:

social_icons:
  enable: true
  icons_only: true
  transition: true

---

PART 4. Add RTL languages support for posts & pages.

Reference for #1779.

Files modified:

1. ADD: rtl languages support [1]. e6c38d2
2. ADD: rtl languages support [2]. d26b00d
3. ADD: rtl languages support [3]. 9673657
4. MOD: add post-body class & refactor vision. 4d83973
5. REM: move rtl class to separated file. 8156f42
6. ADD: reference to post-rtl. 4a59cc3
7. Create post-rtl.styl a1a46eb

How it looks?

Live demo here.

How to use?

In your post.md:

title: اختبار اللغة العربية
date: 2017-04-20 16:15:50
tags: [test, Language]
+direction: rtl

---

PART 5. Refactor wechat, reward and copyright features & added bitcoin donate.

Reference for #687.
Thank's to @weisnc and his guide!

Files modified:

1. MOD: wechat & reward & copyright sections. 24de7b5
2. MOD: wechat. ffa6277
3. MOD: reward. 1a8c2b7
4. MOD: post copyright. 72e055e
5. ADD: reward configuration. af50d7b
6. ADD: bitcoin config. f21d268
7. ADD: bitcoin [2] & refactor default labels. 90fcaa1
8. ADD: bitcoin [3]. 5286df0
9. ADD: bitcoin [4]. f836eb1
10. ADD: bitcoin [5]. 153660f

How to use?

Uncomment what u need in Next _config.yml:

# Reward
#reward_comment: Donate comment here
#wechatpay: /images/wechatpay.jpg
#alipay: /images/alipay.jpg
#bitcoin: /images/bitcoin.png

---

PART 6. Add mobile_layout_economy option.

If this option enabled, paddings and margins of some HTML elements will have minimal dimentions. This good for view from mobile devices wich have about 400px width.

Files modified:

1. ADD: mobile layout economy option [1]. db963ed
2. ADD: mobile layout economy option [2]. 3c067d9
3. ADD: mobile layout economy option [3]. ee061f1
4. MOD: mobile layout economy option [4]. 3ea176e
5. MOD: mobile layout economy option [5]. 9238624

How to use?

In Next _config.yml:

# Reduce padding / margin indents on devices with narrow width.
mobile_layout_economy: true

---

PART 7. Add tabs tag.

Files modified:

1. ADD: tabs tag [1]. 80690d4
2. ADD: tabs tag [2]. 7dfe638
3. FIX: tabs tag [3]. a498711
4. ADD: tabs tag [4]. 3603ac2
5. ADD: tabs tag [5]. 3fa825e
6. ADD: tabs tag [6]. 227e4a3
7. FIX: tabs tag [7]. cc3a237
8. ADD: tabs tag [8]. 75e771c
9. ADD: tabs tag [9]. 5dd2c22

How it looks?

Live demo with full animation and borders & full usage parameters here.
Live demo with standart settings & full usage parameters here.

How to use?

In Next _config.yml:

# Tabs tag.
tabs:
  enable: true
  transition:
    tabs: true
    labels: true
  border_radius: 3

In *.md files:

{% tabs First unique name %}
<!-- tab -->
**This is Tab 1.**
<!-- endtab -->
<!-- tab -->
**This is Tab 2.**
<!-- endtab -->
<!-- tab -->
**This is Tab 3.**
<!-- endtab -->
{% endtabs %}

Usage description:

/**
 * tabs.js | global hexo script.
 *
 * Usage:
 *
 * {% tabs [Unique name], [index] %}
 * <!-- tab [Tab caption]@[icon] -->
 * Any content (support inline tags too).
 *  <!-- endtab -->
 * {% endtabs %}
 *
 * [Unique name]      : Unique name of tabs block tag without comma.
 *                      Will be used in #id's as prefix for each tab with their index numbers.
 *                      If there are whitespaces in name, for generate #id all whitespaces will replaced by dashes.
 *                      Only for current url of post/page must be unique!
 * [index]            : Index number of active tab.
 *                      If not defined, first tab (1) will be selected.
 *                      If index is -1, no tab will be selected. It's will be something like spoiler.
 *                      May be not defined.
 * [Tab caption]      : Caption of current tab.
 *                      If not caption specified, unique name with tab index suffix will be used as caption of tab.
 *                      If not caption specified, but specified icon, caption will empty.
 *                      May be not defined.
 * [icon]             : Font awesome icon.
 *                      May be not defined.
 */

---

PART 8. Add label tag.

Reference for #1682.

Files modified:

1. ADD: label tag [1]. 829d456
2. FIX: label tag [2]. e40341d
3. ADD: label tag [3]. 2bbac3e
4. ADD: label tag [4]. fd4cac9
5. ADD: label tag [5]. daa9d15
6. ADD: label tag [6]. fd5e162

How it looks?

Live demo here.

How to use?

In Next _config.yml:

# Label tag.
label: true

In *.md files:

Lorem {% label default@ipsum %} {% label primary@dolor sit %}.

Usage description:

/**
 * label.js | global hexo script.
 *
 * Usage:
 *
 * {% label [class] %}Content{% endlabel %}
 *
 * [class] : default | primary | success | info | warning | danger.
 *           If not defined, default class will be selected.
 */

---

PART 9. Add Gemini scheme.

Reference for #1692.

Files modified:

1. ADD: gemini scheme [1]. 243ccc9
2. ADD: gemini scheme [2]. f295388
3. ADD: gemini scheme [3]. 4fecf26
4. ADD: gemini scheme [4]. bf87213
5. ADD: gemini scheme [5]. 3d84964
6. ADD: gemini scheme [6]. 9a7ddd2
7. ADD: gemini scheme [7]. 1a43680
8. ADD: gemini scheme [8]. 5a905f4
9. FIX: gemini scheme [9]. cff689c
10. FIX: gemini scheme [10]. f193530
11. ADD: gemini scheme [11]. c6fd571
12. ADD: gemini scheme [12]. f02e056
13. ADD: gemini scheme [13]. c7e552a
14. FIX: gemini scheme [14]. d1f4eb7
15. ADD: gemini scheme [15]. 58e6a5a
16. MOD: gemini scheme [16]. 225ef05
17. MOD: gemini scheme [17]. 9e822c7

How it looks?

Live demo on test and on main domain.

How to use?

In Next _config.yml:

# ---------------------------------------------------------------
# Scheme Settings
# ---------------------------------------------------------------

# Schemes
#scheme: Muse
#scheme: Mist
#scheme: Pisces
scheme: Gemini

[FatBobGo]

@ivan-nginx
Hi Ivan, may I know how to deply such great feature to other Hexo theme? Saying Chic. Thank you.