Skip to content

Instantly share code, notes, and snippets.

@MChorfa
Forked from lensco/Custom.css
Created October 2, 2011 22:13
Show Gist options
  • Save MChorfa/1258040 to your computer and use it in GitHub Desktop.
Save MChorfa/1258040 to your computer and use it in GitHub Desktop.
User stylesheet to customize the WebKit Inspector (cleaning up and improving the styles panel). See http://bricss.net/post/9076968710/customize-the-webkit-inspector-chrome-dev-tools
.monospace {
font: 11px/1.3 Monaco !important;
}
/* slightly larger indentation of source code */
.outline-disclosure ol {
-webkit-padding-start: 18px !important;
}
/* margin underneath styles panel heading */
.pane.expanded:nth-child(2) > .title {
margin: 0 0 5px;
}
/* lighter and less cramped seperators in styles panel */
.styles-sidebar-separator {
background: -webkit-linear-gradient(#fff, #eee) !important;
border-top: 1px solid #e9e9e9 !important;
border-bottom: 1px solid #ccc !important;
padding: 3px 5px !important;
margin: 5px 0;
}
/* the element from which is inherited */
.styles-sidebar-separator .node-link {
text-decoration: none !important;
}
/* no more border between selectors */
.styles-section:not(.first-styles-section) {
border-top: 0 !important;
margin: 0 0 5px;
}
/* reference links to stylesheets */
.styles-section .header .subtitle a {
color: #00e !important;
text-decoration: none;
}
.styles-section .header .subtitle a:hover {
text-decoration: underline;
}
/* slightly larger indentation for properties */
.styles-section .properties {
padding-left: 20px !important;
}
/* put checkboxes on the left of properties */
.styles-section .properties .enabled-button {
position: absolute !important;
left: 7px;
margin: 2px 0 0 0 !important;
}
/* indent the closing curly brace */
.styles-section > div:last-of-type {
margin: 0 0 0 30px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment