Skip to content

Instantly share code, notes, and snippets.

@MadcapJake
Last active January 3, 2018 12:53
Show Gist options
  • Save MadcapJake/de27004e3e44bf3f7351 to your computer and use it in GitHub Desktop.
Save MadcapJake/de27004e3e44bf3f7351 to your computer and use it in GitHub Desktop.
Nucleus Dark UI + Base16[Ocean] + Arc-Dark + Tweaks
//
// 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;
}
@MadcapJake
Copy link
Author

screenshot from 2015-09-15 10-39-33
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 and error 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 the error notification.

@MadcapJake
Copy link
Author

Adjusted the warning notification content area color to be a bit lighter.

@MadcapJake
Copy link
Author

Caught another terminal blue button and adjusted checkbox color.

@dmaglio
Copy link

dmaglio commented Sep 16, 2015

good less but the text into console log is unreadable...

schermata da 2015-09-16 16-07-00

@MadcapJake
Copy link
Author

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