Last active
January 3, 2018 12:53
-
-
Save MadcapJake/de27004e3e44bf3f7351 to your computer and use it in GitHub Desktop.
Nucleus Dark UI + Base16[Ocean] + Arc-Dark + Tweaks
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// | |
// 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; | |
} |
Adjusted the warning notification content area color to be a bit lighter.
Caught another terminal blue button and adjusted checkbox color.
I'll have a look at their css.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Close All
looks hideous but I think that's a nucleus-dark-ui bug. The github icon for the close button is also a nucleus-dark-ui bug.fatal
anderror
notifications are colored the same but let me know if you come up with something that looks good and differentiates them better. Native Atom notifications have a little bit lighter set of colors for theerror
notification.