Skip to content

Instantly share code, notes, and snippets.

@ShMcK
Last active June 14, 2016 21:04
Show Gist options
  • Save ShMcK/18ff30b23bb26687a8d91f23185638e4 to your computer and use it in GitHub Desktop.
Save ShMcK/18ff30b23bb26687a8d91f23185638e4 to your computer and use it in GitHub Desktop.
Atom Stylesheet with background whitespace grid & styled html properties
// Atom Styles
// theme: one-dark
// syntax: apm install oceanic-next
atom-text-editor,
atom-workspace {
font-family: "Fira Code"; // https://github.com/tonsky/FiraCode
font-size: 14px;
line-height: 1.7;
}
// Tabs
atom-pane {
.tab-bar {
height: 32px
}
.tab-bar > .tab {
font-size: 0.75em;
}
}
// Sidebar
atom-panel.tool-panel {
font-size: 0.85em;
// no padding on first level of tree
.tree-view-scroller > ol > li > ol > li.entry.list-nested-item {
// font-size: 0.85em;
padding-left: 0;
}
.tree-view-scroller > ol > li > ol > li.file.entry.list-item {
// font-size: 0.85em;
padding-left: 0;
margin-left: 2px;
}
}
// Terminal
.terminal-view {
.xterm {
background-color: rgb(0, 10, 17);
}
.terminal {
line-height: 1.5;
letter-spacing: 0.8px;
color: rgb(123, 183, 200);
}
}
// Editor Styles
atom-text-editor::shadow {
text-rendering: optimizeLegibility;
// Target Attributes, JS
.source.html,
.source.js,
.source.jsx .source.ts,
.source.tsx {
.entity.other.attribute-name,
.this {
font-family: "Operator Mono"; // http://www.typography.com/blog/introducing-operator
font-style: italic;
}
}
// TypeScript
.source.ts,
.source.tsx {
.meta.type {
font-family: "Operator Mono";
font-style: italic;
}
}
// leading whitespace
.leading-whitespace {
color: rgba(0,0,0,0);
position: relative;
box-shadow: inset 1px 0 0 rgba(255,255,255,0.1);
}
.leading-whitespace:after {
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-bottom: 1px solid rgba(255,255,255,0.1);
}
}
@ShMcK
Copy link
Author

ShMcK commented Jun 14, 2016

Preview:

screen shot 2016-06-14 at 2 04 01 pm

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment