Typora - typora主题样式

主题名称：github_harley.css（随便命名）

效果：Mac风格的代码块、更舒适的引用块风格。

css

harley01

/* 代码块主题 */

/* 顶部 */

.md-fences {

    /* color: #c5c8c6; */

    background-color: #21252b;

    border-radius: 5px;

    /* box-shadow: 0 10px 30px 0 rgb(0 0 0 / 40%);*/

    padding-top: 30px;

    /* font-family: monospace, 'PingFang SC', 'Microsoft YaHei'; */

}

.md-fences::before {

    background: #fc625d;

    border-radius: 50%;

    box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;

    content: ' ';

    height: 12px;

    left: 4px;

    margin-top: -20px;

    position: absolute;

    width: 12px;

}

:root {

    --side-bar-bg-color: #fafafa;

    --control-text-color: #777;

}

@include-when-export url(https://fonts.loli.net/css?family=Open+Sans:400italic,700italic,700,400&subset=latin,latin-ext);

/* open-sans-regular - latin-ext_latin */

@font-face {

    font-family: 'Open Sans';

    font-style: normal;

    font-weight: normal;

    src: local('Open Sans Regular'), local('OpenSans-Regular'), url('./github/open-sans-v17-latin-ext_latin-regular.woff2') format('woff2');

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;

  }

  /* open-sans-italic - latin-ext_latin */

  @font-face {

    font-family: 'Open Sans';

    font-style: italic;

    font-weight: normal;

    src: local('Open Sans Italic'), local('OpenSans-Italic'), url('./github/open-sans-v17-latin-ext_latin-italic.woff2') format('woff2');

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;

  }

  /* open-sans-700 - latin-ext_latin */

  @font-face {

    font-family: 'Open Sans';

    font-style: normal;

    font-weight: bold;

    src: local('Open Sans Bold'), local('OpenSans-Bold'), url('./github/open-sans-v17-latin-ext_latin-700.woff2') format('woff2');

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;

  }

  /* open-sans-700italic - latin-ext_latin */

  @font-face {

    font-family: 'Open Sans';

    font-style: italic;

    font-weight: bold;

    src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url('./github/open-sans-v17-latin-ext_latin-700italic.woff2') format('woff2');

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD, U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;

  }

html {

    font-size: 16px;

    -webkit-font-smoothing: antialiased;

}

body {

    font-family: "Open Sans","Clear Sans", "Helvetica Neue", Helvetica, Arial, 'Segoe UI Emoji', sans-serif;

    color: rgb(51, 51, 51);

    line-height: 1.6;

}

#write {

    max-width: 860px;

  	margin: 0 auto;

  	padding: 30px;

    padding-bottom: 100px;

}

@media only screen and (min-width: 1400px) {

	#write {

		max-width: 1024px;

	}

}

@media only screen and (min-width: 1800px) {

	#write {

		max-width: 1200px;

	}

}

#write > ul:first-child,

#write > ol:first-child{

    margin-top: 30px;

}

a {

    color: #4183C4;

}

h1,

h2,

h3,

h4,

h5,

h6 {

    position: relative;

    margin-top: 1rem;

    margin-bottom: 1rem;

    font-weight: bold;

    line-height: 1.4;

    cursor: text;

}

h1:hover a.anchor,

h2:hover a.anchor,

h3:hover a.anchor,

h4:hover a.anchor,

h5:hover a.anchor,

h6:hover a.anchor {

    text-decoration: none;

}

h1 tt,

h1 code {

    font-size: inherit;

}

h2 tt,

h2 code {

    font-size: inherit;

}

h3 tt,

h3 code {

    font-size: inherit;

}

h4 tt,

h4 code {

    font-size: inherit;

}

h5 tt,

h5 code {

    font-size: inherit;

}

h6 tt,

h6 code {

    font-size: inherit;

}

h1 {

    font-size: 2em;

    line-height: 1.2;

    border-bottom: 1px solid #eee;

}

h2 {

    font-size: 1.5em;

    line-height: 1.225;

    border-bottom: 1px solid #eee;

}

/*@media print {

    .typora-export h1,

    .typora-export h2 {

        border-bottom: none;

        padding-bottom: initial;

    }

    .typora-export h1::after,

    .typora-export h2::after {

        content: "";

        display: block;

        height: 100px;

        margin-top: -96px;

        border-top: 1px solid #eee;

    }

}*/

h3 {

    font-size: 1.2em;

    line-height: 1.43;

}

h4 {

    font-size: 1.1em;

}

h5 {

    font-size: 1em;

}

h6 {

   font-size: 1em;

    color: #777;

}

p,

blockquote,

ul,

ol,

dl,

table{

    margin: 0.8em 0;

}

li>ol,

li>ul {

    margin: 0 0;

}

hr {

    height: 2px;

    padding: 0;

    margin: 16px 0;

    background-color: #e7e7e7;

    border: 0 none;

    overflow: hidden;

    box-sizing: content-box;

}

li p.first {

    display: inline-block;

}

ul,

ol {

    padding-left: 30px;

}

ul:first-child,

ol:first-child {

    margin-top: 0;

}

ul:last-child,

ol:last-child {

    margin-bottom: 0;

}

blockquote {

	border-left: 4px solid #62ca38!important;

	background: #f8f8f8!important;

	padding: 10px!important;

}

blockquote {

    border-left: 4px solid #dfe2e5;

    padding: 0 15px;

    color: #777777;

}

blockquote blockquote {

    padding-right: 0;

}

table {

    padding: 0;

    word-break: initial;

}

table tr {

    border: 1px solid #dfe2e5;

    margin: 0;

    padding: 0;

}

table tr:nth-child(2n),

thead {

    background-color: #f8f8f8;

}

table th {

    font-weight: bold;

    border: 1px solid #dfe2e5;

    border-bottom: 0;

    margin: 0;

    padding: 6px 13px;

}

table td {

    border: 1px solid #dfe2e5;

    margin: 0;

    padding: 6px 13px;

}

table th:first-child,

table td:first-child {

    margin-top: 0;

}

table th:last-child,

table td:last-child {

    margin-bottom: 0;

}

.CodeMirror-lines {

    padding-left: 4px;

}

.code-tooltip {

    box-shadow: 0 1px 1px 0 rgba(0,28,36,.3);

    border-top: 1px solid #eef2f2;

}

.md-fences,

code,

tt {

    border: 1px solid #e7eaed;

    background-color: #f8f8f8;

    border-radius: 3px;

    padding: 0;

    padding: 2px 4px 0px 4px;

    font-size: 0.9em;

}

code {

    background-color: #f3f4f4;

    padding: 0 2px 0 2px;

}

.md-fences {

    margin-bottom: 15px;

    margin-top: 15px;

    padding-top: 26px;

    padding-bottom: 6px;

}

.md-task-list-item > input {

  margin-left: -1.3em;

}

@media print {

    html {

        font-size: 13px;

    }

    table,

    pre {

        page-break-inside: avoid;

    }

    pre {

        word-wrap: break-word;

    }

}

.md-fences {

	background-color: #f8f8f8;

}

#write pre.md-meta-block {

	padding: 1rem;

    font-size: 85%;

    line-height: 1.45;

    background-color: #f7f7f7;

    border: 0;

    border-radius: 3px;

    color: #777777;

    margin-top: 0 !important;

}

.mathjax-block>.code-tooltip {

	bottom: .375rem;

}

.md-mathjax-midline {

    background: #fafafa;

}

#write>h3.md-focus:before{

	left: -1.5625rem;

	top: .375rem;

}

#write>h4.md-focus:before{

	left: -1.5625rem;

	top: .285714286rem;

}

#write>h5.md-focus:before{

	left: -1.5625rem;

	top: .285714286rem;

}

#write>h6.md-focus:before{

	left: -1.5625rem;

	top: .285714286rem;

}

.md-image>.md-meta {

    /*border: 1px solid #ddd;*/

    border-radius: 3px;

    padding: 2px 0px 0px 4px;

    font-size: 0.9em;

    color: inherit;

}

.md-tag {

    color: #a7a7a7;

    opacity: 1;

}

.md-toc {

    margin-top:20px;

    padding-bottom:20px;

}

.sidebar-tabs {

    border-bottom: none;

}

#typora-quick-open {

    border: 1px solid #ddd;

    background-color: #f8f8f8;

}

#typora-quick-open-item {

    background-color: #FAFAFA;

    border-color: #FEFEFE #e5e5e5 #e5e5e5 #eee;

    border-style: solid;

    border-width: 1px;

}

/** focus mode */

.on-focus-mode blockquote {

    border-left-color: rgba(85, 85, 85, 0.12);

}

header, .context-menu, .megamenu-content, footer{

    font-family: "Segoe UI", "Arial", sans-serif;

}

.file-node-content:hover .file-node-icon,

.file-node-content:hover .file-node-open-state{

    visibility: visible;

}

.mac-seamless-mode #typora-sidebar {

    background-color: #fafafa;

    background-color: var(--side-bar-bg-color);

}

.md-lang {

    color: #b4654d;

}

/*.html-for-mac {

    --item-hover-bg-color: #E6F0FE;

}*/

#md-notification .btn {

    border: 0;

}

.dropdown-menu .divider {

    border-color: #e5e5e5;

    opacity: 0.4;

}

.ty-preferences .window-content {

    background-color: #fafafa;

}

.ty-preferences .nav-group-item.active {

    color: white;

    background: #999;

}

.menu-item-container a.menu-style-btn {

    background-color: #f5f8fa;

    background-image: linear-gradient( 180deg , hsla(0, 0%, 100%, 0.8), hsla(0, 0%, 100%, 0));

}

harley02

 /* 代码块主题 */

/* 代码块Mac风格 */

.md-fences {

    /* color: #c5c8c6; */

    background-color: #21252b;

    border-radius: 5px;

    /* box-shadow: 0 10px 30px 0 rgb(0 0 0 / 40%);*/

    padding-top: 30px;

    /* font-family: monospace, 'PingFang SC', 'Microsoft YaHei'; */

}

.md-fences::before {

    background: #fc625d;

    border-radius: 50%;

    box-shadow: 20px 0 #fdbc40, 40px 0 #35cd4b;

    content: ' ';

    height: 12px;

    left: 4px;

    margin-top: -20px;

    position: absolute;

    width: 12px;

}

mark {

    background: none;

    color: red;

    font-weight: bold;

}

.md-fences {

    margin-bottom: 15px;

    margin-top: 15px;

    padding-top: 26px;

    padding-bottom: 6px;

}

/* 引用块风格 */

blockquote {

	border-left: 4px solid #62ca38!important;

	background: #f8f8f8!important;

	padding: 10px!important;

}

blockquote {

    border-left: 4px solid #dfe2e5;

    padding: 0 15px;

    color: #777777;

}

blockquote blockquote {

    padding-right: 0;

}

/* 行内代码块风格 */

code {

	display: inline;

    padding: 4px!important;

    background-color: #f6f6f6!important;

    border-radius: 4px!important;

    border: 1px solid #ddd;

    overflow-x: auto;

    font-size: 14px!important;

    /* font-family: "Menlo,Monaco,Consolas,'Courier New', monospace"; */

    color: #e83e8c!important;

    word-break: break-word;

}

#write pre.md-meta-block {

	padding: 1rem;

    font-size: 85%;

    line-height: 1.45;

    background-color: #f7f7f7;

    border: 0;

    border-radius: 3px;

    color: #777777;

    margin-top: 0 !important;

}

Typora - typora主题样式的更多相关文章

修改Markdown神器[Typora]的主题样式
修改Markdown神器[Typora]的主题样式 Typora是一款专注写作的工具,基于markdown标记语言来完成写作.出于以下原因决定替换主题样式: 1.自带的样式比较low,想替换一款高大上 ...
typora 基本使用和漂亮的主题样式
以下是使用博客园的markdown的效果: typora 基本使用和漂亮的主题样式一.typora 基本使用 ps:文字排版,使用markdown nice 可以一键复制到公众号.知乎:https: ...
Android 标签的主题样式
Android平台定义的主题样式: android:theme="@android:style/Theme.Dialog" 将一个Activity显示为对话框模式 •andro ...
odoo12主题样式模块
odoo12主题样式模块图标形式显示菜单目录的结构 odoo12图标形式显示菜单:https://apps.odoo.com/apps/themes/12.0/backend_theme_v12/ ...
08、通过自定义依赖属性，用 StateTrigger 修改全局主题样式
在 Win 10 的 UWP 中,需要在 xaml 中,通过使用 StateTrigger 修改全局的文本大小.Background.画刷等依赖属性等主题样式.下面只针对字体大小进行描述,其它依赖属性 ...
sencha touch 扩展篇之使用sass自定义主题样式（下）通过css修改官方组件样式以及自定义图标
上一讲我们讲解了如何使用官方的api来修改主题样式,这讲我们继续讲解sass的样式修改, 编译官方自带的主题包在生成的项目以及官方sdk的目录下,自带了一些主题sass包,我们也可以通过修改sas ...
sencha touch 扩展篇之使用sass自定义主题样式（上）使用官方的api修改主题样式
大家知道,sencha touch是通过我们写的js代码来动态渲染单页面生成一个个div+css的html页面来模拟app应用,那么既然是div+css结构的,我们就可以通过修改css样式来自定义我们 ...
eclipse主题样式
Eclipse Color Themeshttp://eclipsecolorthemes.org/ Get it Download from Eclipse Marketplace Install ...
Android Material Design系列之主题样式介绍说明
今天这篇文章应该算是Material Design系列的补充篇,因为这篇文章本来应该放到前面讲的,因为讲的是主题嘛,对于一些状态和颜色的介绍,因为我们一新建一个项目时,系统自带了三个属性的颜色,现在就 ...
IntelliJ IDEA更换主题样式分享
原文地址:https://blog.csdn.net/liu865033503/article/details/79481785 .自定义主题样式网址:http://www.riaway.com/in ...

随机推荐

深入理解 HTTP 协议：从基础到实践全解析
在当今数字化时代,HTTP 协议如同互联网世界的"语言",支撑着无数网页浏览.数据传输和在线交互.无论你是初涉编程的新手,还是经验丰富的开发者,深入掌握 HTTP 协议都至关重要. ...
docker创建Tomcat
安装docker 查找tomcat docker search tomcat 下载镜像 docker pull tomcat 查看下载的镜像 docker images 运行Tomcat docker ...
Flutter 滑动组件互相嵌套问题
滑动组件互相嵌套问题如果listview/singlechildscrollview 嵌套gridview,将两个组件的shrinkwrap设置为true,并且gridview无法滚动 physic ...
Android7 以上https抓包（无需root）- virtualXposed + justTrustMe
参考资料: https://www.cnblogs.com/boycelee/p/13418371.html 1. virtualXposed下载地址 https://github.com/andro ...
MYSQL支持的数据类型-数值类型
一.数值类型分类 MYSQL支持所有标准SQL中的数值类型,其中包括严格数值类型(INTEGER.SMALLINT.DECIMAL和NUMERIC),以及近似数值数据类型(FLOAT.REAL和DOU ...
Markdown转Beamer
技术背景在早期我写过一些文章介绍用RMarkdown写Beamer,还有相应的TinyTex配置.后来Xie Yihui大神发文离开了RMarkdown核心团队,想来中文社区的支持力度和活跃度可能会 ...
Qt编写地图综合应用6-百度在线地图
一.前言百度在线地图的应用老早就做过,后面经过不断的完善才到今天的这个程序,除了基本的可以载入地图并设置一些相关的属性以外,还增加了各种js函数直接异步加载数据比如动态添加点.矩形.圆形.行政区划等 ...
Qt开源作品36-程序守护进程
一.前言没有任何人敢保证自己写的程序没有任何BUG,尤其是在商业项目中,程序量越大,复杂度越高,出错的概率越大,尤其是现场环境千差万别,和当初本地电脑测试环境很可能不一样,有很多特殊情况没有考虑到, ...
史上最通俗Netty入门长文：基本介绍、环境搭建、动手实战
原作者江成军,原题"还在被Java NIO虐?该试试Netty了",收录时有修订和改动. 1.阅读对象本文适合对Netty一无所知的Java NIO网络编程新手阅读,为了做到这一 ...
网络编程懒人入门(十三)：一泡尿的时间，快速搞懂TCP和UDP的区别
本文引用了作者Fundebug的"一文搞懂TCP与UDP的区别"一文的内容,感谢无私分享. 1.引言网络协议是每个搞网络通信应用开发(比如IM.推送.网关等等)的程序员都必须要掌 ...

Typora - typora主题样式

主题名称：github_harley.css（随便命名）

Typora - typora主题样式的更多相关文章

随机推荐

热门专题