Code Monkey home page Code Monkey logo

typora-haru-theme's Introduction

layout title category homepage download built-in author thumbnail typora-root-url typora-copy-images-to
theme
Haru
theme
false
锦恢
haru.png
../../
../../media/theme/haru

Designed and tested on Windows11 & Ubuntu18.04. Not fully tested, but should work for MacOS.

Some bugs have been fixed. Thanks for hongyun-robot and LILKOTYO!

Haru

Introduction

Haru is a light style theme for Typora. I hope it can bring you inspiration, elegance and peaceful mind.

Dark Side (HaruDark) is currently supported:


Screenshot

Basic

Example

Typora Menu

Exit Dialog


Feature

Round corner design

Almost every element or container in haru is designed as round corner, including img, iframe, word count labe and even some input widget embedded in Typora.

Table without border

Table in haru doesn't have border and cell will be highlighted on any hover.

Title + Blockquote?

I combine title and blockquote to make extra information:

> # In Haru, you can use `>` + `#` to create Tips block

> ## `>` + `##` = warning block

> ### `>` + `###` = error block

> #### `>` + `####` = remind block

rendered result:


Install

  1. Download haru.zip from Typora Gallery or my github release
  2. Typora Menu -> Themes -> Open Theme Folder
  3. Unzip haru.zip into the folder
  4. Restart Typora
  5. Select the Haru theme from the Themes menu in Typora
  6. Enjoy a nice day ☕

Last but not least

  • Actually, many ideas in haru.css are copied from my own website 汇尘轩 directly, which contains an online markdown render.
  • The open source html2pdf tools almost drive me mad 💢 , so I decide to go back to Typora and transfer the style I designed for my website to Typora, in order to enjoy the peace and inspiration which I have designed for myself 😄
  • Some ideas are inspired by typora themes listed below:

Yeah, mint is an excellent theme; see-yue is quite inspirational; autumnus is peaceful, I quite like the style of its title.

Contract

If you are interested in my design or something else, welcome to my website or github homepage. If you has some feedback, you can create Issues or email me [email protected]

typora-haru-theme's People

Contributors

corona09 avatar lstm-kirigaya avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

typora-haru-theme's Issues

Comment

What a wonderful theme!
Any idea of making a series of 'haru-like' theme? (eg. blue, grey or some other colors instead of purple)
Looking forward to see that 👀👍

License Permission

Hi there, your theme is very beautiful, I love it so much. I'm working on a Markdown plugin for OneNote, which will support loading Typora themes. And I want to embed your theme as one of the default choices, with a little modifications on the style and keeping all the name/link/author information. Before doing that, I have to ask about the license permission. How do you feel about it?

Feedback

This is a lovely theme.

Thanks so much for creating it.

I wish I was this talented with css and design :-)

行距

你好,这个主题是不是不能调普通文本的行距?

标题层级小方块遮挡编辑中的文字

主题很棒,尤其要称赞一句,作者选用的字体(GlowSansSC-Normal-Book.woff2,似乎中文名是“未来莹黑”?),很好地考虑到了引号的问题。

很多主题其实并未考虑到中文引号的问题,如果是外国友人开发的那自然无可厚非,但是很多汉语环境下的作者却还是选用了一些很难分辨左右引号的字体,使得使用者要么自己去动手改css,要么就转投其他。

我很高兴作者选用的字体美观、简洁又适合输入。

——如果中文引号的左右都很难分清,实在难以说是一种舒适的输入体验。

但可能也是作者过于关注标题渲染后的效果,在编辑过程时,形如 【H3】 的标题层级小方块会遮挡标题,如下图所示:

mrm27N0907144949

虽然不影响使用,但还是提一句建议:

  • 当输入光标移动到标题时,进入编辑状态时,层级列表块向左退去,光标移开,编辑状态结束时,又展示渲染完成的样子;
  • 或,当输入光标移动到标题时,层级列表块消去,光标移开又恢复正常。

当然,具体怎么处理由作者决定。

感谢你的付出。🎉🎉🎉

另:标题层级小块能帮助我确定当前标题层级,能不能告诉我该怎么修改css才能让这个小块应用到所有标题上,而不是现在的h1, h2, h3?

tab异常

image

tab键会呈现出异常的符号~

Lag

Theme is laggy on macOS Ventura, Typora 1.4.8. Lag does not occur with any other default or installed theme.

Long space after an apostrophe

billede
When I make an apostrophe the theme puts a long space after it.

(I'm not sure if the issue is replicable on other devices, but that's how the theme displays it on mine.)

feedback bug

在打开大纲导航栏时,滑动鼠标滚轮浏览页面,总会出现页面回滚的bug

请问该主题以何种协议授权?

您好!感谢您的设计,Haru是我现在最常用的主题之一。我对其做了一些小修改,并导出了一些准备以非商业目的公开的PDF文件(我的笔记),但我没有在页面中找到license信息。想请问这个主题是以什么协议授权的,允许哪些场景的使用?感谢您!

tab异常

作者大大的主题很好看,但是在使用过程中发现Tab输入总是显示异常,请问有什么解决办法吗
image

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.