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 ...

随机推荐

ArkTs布局入门05——栅格布局（GridRow/GridCol）
1.概述栅格布局是一种通用的辅助定位工具,对移动设备的界面设计有较好的借鉴作用.主要优势包括: 提供可循的规律:栅格布局可以为布局提供规律性的结构,解决多尺寸多设备的动态布局问题.通过将页面划分为等 ...
【C#】【平时作业】习题-11-ADO.NET
选择题 1.下列ASP.NET语句(B)正确地创建了一个与mySQL数据库和服务器的连接. A.SqlConnection con1 = new Connection("Data Sourc ...
jenkins集群 - HTMLreport测试报告
一.安装 HTML Publisher plugin 插件插件下载地址二.配置构建后步骤三.编辑报告执行脚本四.安装 Startup Trigger 和 Groovy 插件 1.安装原因: J ...
Sublime Text 4143 激活码
1 .Windows激活方法安装地址:Download - Sublime Text 使用浏览器打开hexed.it(https://hexed.it/) 点击"打开文件",选择 ...
SpringBoot:通过多个Context限制Bean的活动范围
从Spring的包扫描说起 SpringBoot会扫描SpringBootApplication注解标注的类,他所在的包以及这个包的子包,把那里面的Bean注册到applicationContext中 ...
11.15javaweb学习
23种设计模式实战：重学Java设计模式
23种设计模式实战PDF: 链接:https://pan.baidu.com/s/1XfjkBt19G7jZQfwk5wAV3w 提取码:1234
Ubuntu 装卸Opencv
buntu中卸载opencv的方法: 1.打开ubuntu: 2.找到当初安装opencv的build目录,进入该build目录执行卸载操作: 3.通过rm命令清理/usr中所有opencv相关项即可 ...
Redis 源码简洁剖析 01 - 环境配置
fork Redis 源码在 GitHub 上找到并 fork Redis 源码 https://github.com/redis/redis,然后在本地 clone 自己 fork 出来的源码项目 ...
Linux安全加固（一）
1.Linux关键用户文件/etc/password文件 Root:x:0:0:root:/bin/bash ●用户名:代表用户账号的字符串.通常长度不超过8个字符,并且由大小写字母和/或数字组成.登 ...

Typora - typora主题样式

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

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

随机推荐

热门专题