Git Product home page Git Product logo

swivelgames / apex-adapt-dark-ui Goto Github PK

View Code? Open in Web Editor NEW
1.0 2.0 0.0 53.41 MB

A dark UI theme based on Apex' gorgeous white apex-ui theme, ported to a fork of Atom's One Dark for the added ability adapt to most syntax themes.

Home Page: https://atom.io/themes/apex-adapt-dark-ui

License: MIT License

CSS 94.93% CoffeeScript 5.07%
atom theme atom-theme atom-themes dark adapt syntax

apex-adapt-dark-ui's Introduction

Apex Adapt Dark UI theme

See the Slim Variant here

A dark UI theme based on Apex' gorgeous white apex-ui theme, ported to a fork of Atom's One Dark for the added ability adapt to most syntax themes.

If you haven't already, go see the original theme by Apex here!

Apex Adapt Dark UI

The font used in the screenshot is Hack.

Install

Install this theme using Settings > Install. Select the "Themes" toggle and search for "apex-adapt-dark-ui". From there, go to Settings > Themes section and selecting "Apex Adapt Dark" from the UI Themes drop-down menu.

For the atom package page, visit: https://atom.io/themes/apex-adapt-dark-ui

Settings

In the theme settings you can:

  • Change the Font Size to scale the whole UI up or down.
  • Choose between 3 Tab Sizing modes.
  • Hide the dock buttons.

To make changes, go to Settings > Themes > Apex Adapt Dark UI > Settings or the cog icon next to the theme picker.

Customize

It's also possible to resize only certain areas by adding the following to your styles.less (Use DevTools to find the right selectors):

.theme-apex-adapt-dark-ui {
  .tab-bar { font-size: 18px; }
  .tree-view { font-size: 14px; }
  .status-bar { font-size: 12px; }
}

FAQ

Why do the colors change when I switch Syntax themes? This UI theme uses the same background color as the chosen syntax theme. If that syntax theme has a light background color, it only uses its hue, but otherwise stays dark. This lets you use dark-light combos.

apex-adapt-dark-ui's People

Contributors

alexhicks avatar anaisbetts avatar benogle avatar brucevang avatar fredwu avatar izuzak avatar jessegrosjean avatar kevinsawicki avatar lee-dohm avatar matthewwithanm avatar maxbrunsfeld avatar mcolyer avatar mnquintana avatar platy11 avatar postcasio avatar shama avatar simurai avatar steverandy avatar swivelgames avatar taylorlapeyre avatar thedaniel avatar thomasjo avatar tsangkenneth avatar vmarkovtsev avatar

Stargazers

 avatar

Watchers

 avatar  avatar

apex-adapt-dark-ui's Issues

Deprecated selector in `apex-adapt-dark-ui\index.less`

In apex-adapt-dark-ui\index.less:

Starting from Atom v1.13.0, the contents of atom-text-editor elements are no longer encapsulated within a shadow DOM boundary. This means you should stop using :host and ::shadow pseudo-selectors, and prepend all your syntax selectors with syntax--. To prevent breakage with existing style sheets, Atom will automatically upgrade the following selectors:

  • atom-text-editor[mini] .placeholder-text, atom-text-editor[mini]::shadow .placeholder-text => atom-text-editor[mini] .placeholder-text, atom-text-editor[mini].editor .placeholder-text

  • atom-text-editor[mini] .selection .region, atom-text-editor[mini]::shadow .selection .region => atom-text-editor[mini] .selection .region, atom-text-editor[mini].editor .selection .region

  • atom-text-editor[mini] .cursor, atom-text-editor[mini]::shadow .cursor => atom-text-editor[mini] .cursor, atom-text-editor[mini].editor .cursor

Automatic translation of selectors will be removed in a few release cycles to minimize startup time. Please, make sure to upgrade the above selectors as soon as possible.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.