Skip to content

Instantly share code, notes, and snippets.

@math0ne

math0ne/atom custom styles

Created July 27, 2017 07:14
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save math0ne/524839deb2fa152c1dd27437c57e05eb to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save math0ne/524839deb2fa152c1dd27437c57e05eb to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. math0ne created this gist Jul 27, 2017.
    154 changes: 154 additions & 0 deletions atom custom styles
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,154 @@
    /*
    * Your Stylesheet
    *
    * This stylesheet is loaded when Atom starts up and is reloaded automatically
    * when it is changed and saved.
    *
    * Add your own CSS or Less to fully customize Atom.
    * If you are unfamiliar with Less, you can read more about it here:
    * http://lesscss.org
    */


    /*
    * Examples
    * (To see them, uncomment and save)
    */

    atom-dock .tab-bar {
    display: none;
    }

    // style the background color of the tree view
    .tree-view {
    // background-color: whitesmoke;
    }
    .tree-view::-webkit-scrollbar {
    display: none;
    }
    // style the background and foreground colors on the atom-text-editor-element itself
    atom-text-editor {
    // color: white;
    // background-color: hsl(180, 24%, 12%);
    }

    // To style other content in the text editor's shadow DOM, use the ::shadow expression
    atom-text-editor::shadow .cursor {
    // border-color: red;
    }
    //
    // Arc/Solus Tweaks
    //

    // Fix keybindings
    kbd {
    color: #a9caf1;
    border-color: #a9caf1;
    }
    // Fix readme code blocks
    code {
    color: #a9caf1;
    }
    // Fix links with base16 ocean syntax
    .settings-view .link,
    .text-info {
    color: #a9caf1;
    }
    .settings-view .link:hover {
    color: #a9caf1;
    }
    .settings-view .alert-info {
    color: white;
    background: #a9caf1;
    border-color: #a9caf1 !important;
    }
    // fix bracket-matcher
    atom-text-editor .bracket-matcher .region,
    atom-text-editor::shadow .bracket-matcher .region,
    :host .bracket-matcher .region {
    border: 1px solid #a9caf1;
    background-color: rgba(169, 202, 241, 0.32);
    }

    // Fix button links with base16 ocean syntax
    .btn.btn-info,
    button.btn-info, button.icon.btn-info, .btn-default.btn-info, .btn.btn-info,
    .project-find .btn-group-find .btn, .find-and-replace .btn-group-find .btn,
    .update-all-button.btn.btn-primary {
    color: #a9caf1 !important;
    border-color: #a9caf1 !important;
    }
    .btn.btn-info:hover,
    .update-all-button.btn.btn-primary:hover,
    .find-and-replace .btn-group-find .btn:hover,
    button.btn-info:hover, button.icon.btn-info:hover, .btn-default.btn-info:hover, .btn.btn-info:hover {
    color: white;
    background: #a9caf1 !important;
    border-color: #a9caf1 !important;
    }
    .settings-view button.install-button.is-installing {
    color: white !important;
    border-color: #a9caf1 !important;
    background: #a9caf1;
    }
    // Fix notifications to be more Arc-like
    atom-notification.success .content {
    background-color: #F5F6F7;
    }
    atom-notification.success.icon:before {
    color: white;
    background-color: #73d216;
    }
    atom-notification.warning .content {
    background-color: #FFC8AB;
    }
    atom-notification.warning.icon:before {
    color: white;
    background-color: #F27735;
    }
    atom-notification.error .content {
    background-color: #FF655D;
    }
    atom-notification.error.icon:before {
    color: white;
    background-color: #E7150A;
    }
    atom-notification.fatal .content {
    background-color: #FF655D;
    }
    atom-notification.fatal.icon:before {
    color: white;
    background-color: #E7150A;
    }
    atom-notification.info .content {
    background-color: #a9caf1;
    }
    atom-notification.info.icon:before {
    color: white;
    background-color: #5294E2;
    }
    // Fix status bar colors
    .text-error {
    color: #E7150A;
    }
    .linter-highlight.status-success {
    color: #73d216;
    }
    // Fix checkbox color
    .settings-view input[type="checkbox"]:checked {
    background-color: #73d216;
    }
    @font-size: 12px;
    .list-group li:not(.list-nested-item), .list-tree li:not(.list-nested-item), .list-group li.list-nested-item > .list-item, .list-tree li.list-nested-item > .list-item {
    font-size: @font-size;
    }
    html, body, .tree-view, .tooltip, .tab-bar .tab, .find-and-replace .find-meta-container, atom-text-editor[mini], .btn, .status-bar, .list-tree li.list-nested-item > .list-item { font-size: @font-size; }

    .editor .selection .region {
    border-radius: 3px;
    padding: 4px;
    }
    .atom-dock-toggle-button-visible
    {
    display: none;
    }