mirror of
https://github.com/pulsar-edit/pulsar.git
synced 2024-10-26 11:08:40 +03:00
Move Bootstrap to a separate package
This commit is contained in:
parent
57c17fb2a4
commit
95d9b9946a
@ -6,26 +6,19 @@
|
||||
@import "./variables/ui-variables";
|
||||
@import "ui-variables";
|
||||
|
||||
// Octicons
|
||||
@import "octicon-utf-codes";
|
||||
@import "octicon-mixins";
|
||||
|
||||
@import "workspace-view";
|
||||
@import "bootstrap-overrides";
|
||||
@import "badges";
|
||||
@import "buttons";
|
||||
@import "icons";
|
||||
@import "links";
|
||||
@import "panes";
|
||||
@import "panels";
|
||||
@import "sections";
|
||||
@import "lists";
|
||||
@import "popover-list";
|
||||
@import "messages";
|
||||
@import "markdown";
|
||||
@import "text-editor-light";
|
||||
@import "select-list";
|
||||
@import "syntax";
|
||||
@import "text";
|
||||
@import "utilities";
|
||||
@import "octicons";
|
||||
|
||||
// Normalize + scaffolding
|
||||
@import "normalize";
|
||||
@import "scaffolding";
|
||||
|
||||
// Core components
|
||||
@import "cursors";
|
||||
@import "panels";
|
||||
@import "panes";
|
||||
@import "syntax";
|
||||
@import "text-editor-light";
|
||||
@import "workspace-view";
|
||||
|
@ -1,65 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
.badge {
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
vertical-align: middle;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
border-radius: 1em;
|
||||
|
||||
&:empty {
|
||||
display: none; // Hide when un-used
|
||||
}
|
||||
|
||||
|
||||
// Color ----------------------
|
||||
|
||||
.badge-color( @fg: @text-color-selected;
|
||||
@bg: @background-color-selected; ) {
|
||||
color: @fg;
|
||||
background-color: @bg;
|
||||
}
|
||||
.badge-color();
|
||||
&.badge-info { .badge-color(white, @background-color-info); }
|
||||
&.badge-success { .badge-color(white, @background-color-success); }
|
||||
&.badge-warning { .badge-color(white, @background-color-warning); }
|
||||
&.badge-error { .badge-color(white, @background-color-error); }
|
||||
|
||||
|
||||
// Size ----------------------
|
||||
|
||||
.badge-size( @size: @font-size; ) {
|
||||
@padding: round(@size/4);
|
||||
font-size: @size;
|
||||
min-width: @size + @padding*2;
|
||||
padding: @padding round(@padding*1.5);
|
||||
}
|
||||
.badge-size(); // default
|
||||
|
||||
// Fixed size
|
||||
&.badge-large { .badge-size(18px); }
|
||||
&.badge-medium { .badge-size(14px); }
|
||||
&.badge-small { .badge-size(10px); }
|
||||
|
||||
// Flexible size
|
||||
// The size changes depending on the parent element
|
||||
// Best used for larger sizes, since em's can cause rounding errors
|
||||
&.badge-flexible {
|
||||
@size: .8em;
|
||||
@padding: @size/2;
|
||||
font-size: @size;
|
||||
min-width: @size + @padding*2;
|
||||
padding: @padding @padding*1.5;
|
||||
}
|
||||
|
||||
|
||||
// Icon ----------------------
|
||||
|
||||
&.icon {
|
||||
font-size: round(@component-icon-size*0.8);
|
||||
padding: @component-icon-padding @component-icon-padding*2;
|
||||
}
|
||||
|
||||
}
|
41
static/bootstrap-overrides.less
vendored
41
static/bootstrap-overrides.less
vendored
@ -1,41 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
.nav {
|
||||
> li > a {
|
||||
border-radius: @component-border-radius;
|
||||
}
|
||||
> li > a:hover {
|
||||
background-color: @background-color-highlight;
|
||||
}
|
||||
|
||||
&.nav-pills > li.active > a {
|
||||
background-color: @background-color-selected;
|
||||
}
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: inherit; // inherit from themes
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: inherit; // inherit from html
|
||||
font-size: inherit; // inherit from html
|
||||
}
|
||||
|
||||
// Latest Bootstrap specifies the font properties again instead of inheriting
|
||||
.tooltip {
|
||||
font-family: @font-family;
|
||||
font-size: @font-size;
|
||||
}
|
||||
|
||||
// disable some <kbd> styling, will be styled in themes
|
||||
kbd {
|
||||
color: inherit;
|
||||
background-color: none;
|
||||
box-shadow: none;
|
||||
}
|
38
static/bootstrap.less
vendored
38
static/bootstrap.less
vendored
@ -1,31 +1,17 @@
|
||||
// Core variables and mixins
|
||||
@import "../node_modules/bootstrap/less/variables.less";
|
||||
@import "../node_modules/bootstrap/less/mixins.less";
|
||||
/* Most of the Bootstrap styles are now in a seperate package */
|
||||
/* TODO: Remove this file if nothing burned down */
|
||||
|
||||
// Reset
|
||||
@import "../node_modules/bootstrap/less/normalize.less";
|
||||
// Below the removed styles
|
||||
|
||||
// Core variables and mixins
|
||||
// @import "../node_modules/bootstrap/less/variables.less";
|
||||
// @import "../node_modules/bootstrap/less/mixins.less";
|
||||
|
||||
// Core CSS
|
||||
@import "../node_modules/bootstrap/less/scaffolding.less";
|
||||
@import "../node_modules/bootstrap/less/type.less";
|
||||
@import "../node_modules/bootstrap/less/code.less";
|
||||
@import "../node_modules/bootstrap/less/grid.less";
|
||||
@import "../node_modules/bootstrap/less/tables.less";
|
||||
@import "../node_modules/bootstrap/less/forms.less";
|
||||
@import "../node_modules/bootstrap/less/buttons.less";
|
||||
// @import "../node_modules/bootstrap/less/grid.less";
|
||||
|
||||
// Components
|
||||
@import "../node_modules/bootstrap/less/button-groups.less";
|
||||
@import "../node_modules/bootstrap/less/input-groups.less";
|
||||
@import "../node_modules/bootstrap/less/navs.less";
|
||||
@import "../node_modules/bootstrap/less/labels.less";
|
||||
@import "../node_modules/bootstrap/less/alerts.less";
|
||||
@import "../node_modules/bootstrap/less/list-group.less";
|
||||
@import "../node_modules/bootstrap/less/thumbnails.less";
|
||||
@import "../node_modules/bootstrap/less/close.less";
|
||||
|
||||
// Components w/ JavaScript
|
||||
@import "../node_modules/bootstrap/less/tooltip.less";
|
||||
|
||||
// Utility classes
|
||||
@import "../node_modules/bootstrap/less/utilities.less";
|
||||
// @import "../node_modules/bootstrap/less/input-groups.less";
|
||||
// @import "../node_modules/bootstrap/less/labels.less";
|
||||
// @import "../node_modules/bootstrap/less/thumbnails.less";
|
||||
// @import "../node_modules/bootstrap/less/close.less";
|
||||
|
@ -1,99 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
.btn {
|
||||
color: @text-color;
|
||||
border-radius: @component-border-radius;
|
||||
border: none;
|
||||
text-shadow: none;
|
||||
|
||||
height: @component-line-height + 2px;
|
||||
line-height: @component-line-height;
|
||||
|
||||
padding: 0 @component-padding;
|
||||
font-size: @font-size;
|
||||
z-index: 0;
|
||||
|
||||
background-color: @button-background-color;
|
||||
&:hover {
|
||||
background-color: @button-background-color-hover;
|
||||
}
|
||||
&.selected,
|
||||
&.selected:hover {
|
||||
// we want the selected button to behave like the :hover button; it's on top of the other buttons.
|
||||
z-index: 1;
|
||||
background-color: @button-background-color-selected;
|
||||
}
|
||||
}
|
||||
|
||||
.btn.btn-xs,
|
||||
.btn-group-xs > .btn {
|
||||
padding: @component-padding/4 @component-padding/2;
|
||||
font-size: @font-size - 2px;
|
||||
height: auto;
|
||||
line-height: 1.3em;
|
||||
&.icon:before {
|
||||
font-size: @font-size - 2px;
|
||||
}
|
||||
}
|
||||
.btn.btn-sm,
|
||||
.btn-group-sm > .btn {
|
||||
padding: @component-padding/4 @component-padding/2;
|
||||
height: auto;
|
||||
line-height: 1.3em;
|
||||
&.icon:before {
|
||||
font-size: @font-size + 1px;
|
||||
}
|
||||
}
|
||||
.btn.btn-lg,
|
||||
.btn-group-lg > .btn {
|
||||
font-size: @font-size + 2px;
|
||||
padding: @component-padding - 2px @component-padding + 2px;
|
||||
height: auto;
|
||||
line-height: 1.3em;
|
||||
&.icon:before {
|
||||
font-size: @font-size + 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-group > .btn {
|
||||
border-left: 1px solid @button-border-color;
|
||||
border-right: 1px solid @button-border-color;
|
||||
}
|
||||
.btn-group > .btn:first-child {
|
||||
border-left: none;
|
||||
border-top-left-radius: @component-border-radius;
|
||||
border-bottom-left-radius: @component-border-radius;
|
||||
}
|
||||
.btn-group > .btn:last-child,
|
||||
.btn-group > .btn.selected:last-child,
|
||||
.btn-group > .dropdown-toggle {
|
||||
border-right: none;
|
||||
border-top-right-radius: @component-border-radius;
|
||||
border-bottom-right-radius: @component-border-radius;
|
||||
}
|
||||
|
||||
// Icon buttons
|
||||
.btn.icon {
|
||||
&:before {
|
||||
width: initial;
|
||||
height: initial;
|
||||
margin-right: .3125em;
|
||||
}
|
||||
&:empty:before {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-toolbar {
|
||||
> .btn-group + .btn-group, > .btn-group + .btn, > .btn + .btn {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
margin-left: 0;
|
||||
}
|
||||
> * {
|
||||
margin-right: @component-padding / 2;
|
||||
}
|
||||
> *:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
@ -1,14 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
.icon::before {
|
||||
margin-right: @component-icon-padding;
|
||||
}
|
||||
|
||||
a.icon,
|
||||
button.icon {
|
||||
text-decoration: none;
|
||||
color: @text-color;
|
||||
&:hover{
|
||||
color: @text-color-highlight;
|
||||
}
|
||||
}
|
@ -1,10 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
a {
|
||||
cursor: pointer;
|
||||
color: @text-color-highlight;
|
||||
&:hover {
|
||||
color: @text-color-highlight;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
@ -1,102 +0,0 @@
|
||||
@import "ui-variables";
|
||||
@import "octicon-mixins";
|
||||
|
||||
// This is a bootstrap override
|
||||
.list-group,
|
||||
.list-group .list-group-item {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: static;
|
||||
}
|
||||
|
||||
.list-group,
|
||||
.list-tree {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
cursor: default;
|
||||
|
||||
li:not(.list-nested-item),
|
||||
li.list-nested-item > .list-item {
|
||||
line-height: @component-line-height;
|
||||
text-wrap: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
// The background highlight uses ::before rather than the item background so
|
||||
// it can span the entire width of the parent container rather than the size
|
||||
// of the list item.
|
||||
.selected::before {
|
||||
content: '';
|
||||
background-color: @background-color-selected;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: @component-line-height;
|
||||
}
|
||||
|
||||
// Make sure the background highlight is below the content.
|
||||
.selected > * {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.icon::before {
|
||||
margin-right: @component-icon-padding;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
.no-icon {
|
||||
padding-left: @component-icon-padding + @component-icon-size;
|
||||
}
|
||||
}
|
||||
|
||||
// Handle indentation of the tree. Assume disclosure arrows.
|
||||
.list-tree {
|
||||
.list-nested-item > .list-tree > li,
|
||||
.list-nested-item > .list-group > li {
|
||||
padding-left: @component-icon-size + @component-icon-padding;
|
||||
}
|
||||
|
||||
&.has-collapsable-children {
|
||||
@disclosure-arrow-padding: @disclosure-arrow-size + @component-icon-padding;
|
||||
li.list-item {
|
||||
margin-left: @disclosure-arrow-padding;
|
||||
}
|
||||
|
||||
.list-nested-item.collapsed > .list-group,
|
||||
.list-nested-item.collapsed > .list-tree {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Nested items always get disclosure arrows
|
||||
.list-nested-item > .list-item {
|
||||
.octicon(chevron-down, @disclosure-arrow-size);
|
||||
&::before{
|
||||
position: relative;
|
||||
top: -1px;
|
||||
margin-right: @component-icon-padding;
|
||||
}
|
||||
}
|
||||
.list-nested-item.collapsed > .list-item {
|
||||
.octicon(chevron-right, @disclosure-arrow-size);
|
||||
&::before{
|
||||
left: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.list-nested-item > .list-tree > li,
|
||||
.list-nested-item > .list-group > li {
|
||||
padding-left: @disclosure-arrow-padding;
|
||||
}
|
||||
|
||||
// You want a subtree to be flat -- no collapsable children
|
||||
.has-flat-children,
|
||||
&.has-flat-children {
|
||||
li.list-item {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -1,17 +0,0 @@
|
||||
.source.gfm {
|
||||
.markup.heading {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.comment.quote {
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
@ -1,41 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
.info-messages,
|
||||
.error-messages {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.error-messages {
|
||||
color: @text-color-error;
|
||||
}
|
||||
|
||||
ul.background-message {
|
||||
font-size: @font-size * 3;
|
||||
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
&.centered {
|
||||
display: -webkit-flex;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
|
||||
-webkit-align-items: center;
|
||||
text-align: center;
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
274
static/normalize.less
vendored
Normal file
274
static/normalize.less
vendored
Normal file
@ -0,0 +1,274 @@
|
||||
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
|
||||
// Modified to Chrome only.
|
||||
|
||||
//
|
||||
// Remove default margin.
|
||||
//
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
// HTML5 display definitions
|
||||
// ==========================================================================
|
||||
|
||||
//
|
||||
// 1. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
|
||||
//
|
||||
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
vertical-align: baseline; // 1
|
||||
}
|
||||
|
||||
//
|
||||
// Prevent modern browsers from displaying `audio` without controls.
|
||||
//
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Links
|
||||
// ==========================================================================
|
||||
|
||||
//
|
||||
// Improve readability of focused elements when they are also in an
|
||||
// active/hover state.
|
||||
//
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
// Text-level semantics
|
||||
// ==========================================================================
|
||||
|
||||
//
|
||||
// Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||
//
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
//
|
||||
// Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
//
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
//
|
||||
// Address styling not present in Safari and Chrome.
|
||||
//
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
//
|
||||
// Address variable `h1` font-size and margin within `section` and `article`
|
||||
// contexts in Firefox 4+, Safari, and Chrome.
|
||||
//
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
//
|
||||
// Address inconsistent and variable font size in all browsers.
|
||||
//
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
//
|
||||
// Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
//
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
// Grouping content
|
||||
// ==========================================================================
|
||||
|
||||
//
|
||||
// Address differences between Firefox and other browsers.
|
||||
//
|
||||
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
//
|
||||
// Contain overflow in all browsers.
|
||||
//
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
//
|
||||
// Address odd `em`-unit font size rendering in all browsers.
|
||||
//
|
||||
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
// Forms
|
||||
// ==========================================================================
|
||||
|
||||
//
|
||||
// Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||
// styling of `select`, unless a `border` property is set.
|
||||
//
|
||||
|
||||
//
|
||||
// 1. Correct color not being inherited.
|
||||
// Known issue: affects color of disabled elements.
|
||||
// 2. Correct font properties not being inherited.
|
||||
// 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
//
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit; // 1
|
||||
font: inherit; // 2
|
||||
margin: 0; // 3
|
||||
}
|
||||
|
||||
//
|
||||
// Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
// All other form control elements do not inherit `text-transform` values.
|
||||
//
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
//
|
||||
// 1. Improve usability and consistency of cursor style between image-type
|
||||
// `input` and others.
|
||||
//
|
||||
|
||||
button,
|
||||
input[type="reset"],
|
||||
input[type="submit"] {
|
||||
cursor: pointer; // 1
|
||||
}
|
||||
|
||||
//
|
||||
// Re-set default cursor for disabled elements.
|
||||
//
|
||||
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
//
|
||||
// Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||
// `font-size` values of the `input`, it causes the cursor style of the
|
||||
// decrement button to change from `default` to `text`.
|
||||
//
|
||||
|
||||
input[type="number"]::-webkit-inner-spin-button,
|
||||
input[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
//
|
||||
// 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||
// 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
|
||||
//
|
||||
|
||||
input[type="search"] {
|
||||
-webkit-appearance: textfield; // 1
|
||||
box-sizing: content-box; //2
|
||||
}
|
||||
|
||||
//
|
||||
// Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||
// Safari (but not Chrome) clips the cancel button when the search input has
|
||||
// padding (and `textfield` appearance).
|
||||
//
|
||||
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
//
|
||||
// Define consistent border, margin, and padding.
|
||||
//
|
||||
|
||||
fieldset {
|
||||
border: 1px solid;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
//
|
||||
// 1. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
//
|
||||
|
||||
legend {
|
||||
padding: 0; // 1
|
||||
}
|
||||
|
||||
//
|
||||
// Don't inherit the `font-weight` (applied by a rule above).
|
||||
// NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||
//
|
||||
|
||||
optgroup {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
// Tables
|
||||
// ==========================================================================
|
||||
|
||||
//
|
||||
// Remove most spacing between table cells.
|
||||
//
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
@ -1,12 +0,0 @@
|
||||
.select-list.popover-list {
|
||||
width: 200px;
|
||||
min-width: 200px;
|
||||
margin-left: 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.select-list.popover-list ol.list-group {
|
||||
position: relative;
|
||||
overflow-y: scroll;
|
||||
max-height: 200px;
|
||||
}
|
34
static/scaffolding.less
Normal file
34
static/scaffolding.less
Normal file
@ -0,0 +1,34 @@
|
||||
@import "ui-variables";
|
||||
@import "octicon-mixins";
|
||||
|
||||
//
|
||||
// Octicon font
|
||||
// --------------------------------------------------
|
||||
|
||||
@font-face { .octicon-font(); }
|
||||
|
||||
|
||||
//
|
||||
// Scaffolding
|
||||
// --------------------------------------------------
|
||||
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: border-box; // Reset the box-sizing
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: @font-family;
|
||||
font-size: @font-size;
|
||||
line-height: 1.428571429; // 20/14
|
||||
color: @text-color;
|
||||
background-color: @app-background-color;
|
||||
}
|
@ -1,35 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
section, .section {
|
||||
position: relative;
|
||||
margin-top: 0;
|
||||
&:last-child { margin-bottom: 0; }
|
||||
|
||||
&.bordered {
|
||||
margin: 0;
|
||||
padding: @component-padding*2 0;
|
||||
border-top: 1px solid @background-color-highlight;
|
||||
border-bottom: 1px solid @tool-panel-border-color;
|
||||
}
|
||||
|
||||
.section-heading:first-child {
|
||||
margin-top: 0;
|
||||
font-weight: bold;
|
||||
color: @text-color-highlight;
|
||||
}
|
||||
}
|
||||
|
||||
div > section:first-child,
|
||||
form > section:first-child,
|
||||
div > .section:first-child,
|
||||
form > .section:first-child {
|
||||
border-top: none;
|
||||
padding-top: 0;
|
||||
}
|
||||
div > section:last-child,
|
||||
form > section:last-child,
|
||||
div > .section:last-child,
|
||||
form > .section:last-child {
|
||||
border-bottom: none;
|
||||
padding-bottom: 0;
|
||||
}
|
@ -1,40 +0,0 @@
|
||||
@import "ui-variables";
|
||||
@import "octicon-mixins";
|
||||
|
||||
.select-list {
|
||||
.loading {
|
||||
.loading-message {
|
||||
.octicon(hourglass);
|
||||
|
||||
&:before {
|
||||
font-size: 1.1em;
|
||||
width: 1.1em;
|
||||
height: 1.1em;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.badge {
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
ol.list-group {
|
||||
position: relative;
|
||||
overflow-y: auto;
|
||||
max-height: 312px;
|
||||
margin: @component-padding 0 0 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
display: block;
|
||||
|
||||
.primary-line,
|
||||
.secondary-line {
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -1,39 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
.text-bits (@type) {
|
||||
@text-color-name: "text-color-@{type}";
|
||||
@bg-color-name: "background-color-@{type}";
|
||||
|
||||
@text-color: @@text-color-name;
|
||||
@bg-color: @@bg-color-name;
|
||||
|
||||
code {
|
||||
color: @text-color;
|
||||
background: fadeout(@bg-color, 80%);
|
||||
}
|
||||
|
||||
a, a code {
|
||||
text-decoration: underline;
|
||||
color: darken(@text-color, 10%);
|
||||
|
||||
&:hover {
|
||||
color: darken(@text-color, 15%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.text-info {
|
||||
.text-bits(info);
|
||||
}
|
||||
|
||||
.text-success {
|
||||
.text-bits(success);
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
.text-bits(warning);
|
||||
}
|
||||
|
||||
.text-error {
|
||||
.text-bits(error);
|
||||
}
|
@ -1,66 +0,0 @@
|
||||
@import "ui-variables";
|
||||
|
||||
:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.pull-center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.padded {
|
||||
padding: @component-padding;
|
||||
}
|
||||
|
||||
// Blocks
|
||||
|
||||
// Must be div.block so as not to affect syntax highlighting.
|
||||
ul.block,
|
||||
div.block {
|
||||
margin-bottom: @component-padding;
|
||||
}
|
||||
div > ul.block:last-child,
|
||||
div > div.block:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Inline Blocks
|
||||
|
||||
.inline-block,
|
||||
.inline-block-tight {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.inline-block {
|
||||
margin-right: @component-padding;
|
||||
}
|
||||
.inline-block-tight {
|
||||
margin-right: @component-padding/2;
|
||||
}
|
||||
div > .inline-block:last-child,
|
||||
div > .inline-block-tight:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.inline-block .inline-block {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
// Use left margin when it's in a float: right element.
|
||||
// Sets the margin correctly when inline blocks are hidden and shown.
|
||||
.pull-right {
|
||||
.inline-block {
|
||||
margin-right: 0;
|
||||
margin-left: @component-padding;
|
||||
}
|
||||
.inline-block-tight {
|
||||
margin-right: 0;
|
||||
margin-left: @component-padding/2;
|
||||
}
|
||||
|
||||
> .inline-block:first-child,
|
||||
> .inline-block-tight:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
@ -17,7 +17,7 @@
|
||||
@background-color-success: #17ca65;
|
||||
@background-color-warning: #ff4800;
|
||||
@background-color-error: #c00;
|
||||
@background-color-highlight: rgba(255, 255, 255, 0.10);
|
||||
@background-color-highlight: hsla(0,0%,0%,.1);
|
||||
@background-color-selected: @background-color-highlight;
|
||||
|
||||
@app-background-color: #fff;
|
||||
|
@ -1,19 +1,4 @@
|
||||
@import "ui-variables";
|
||||
@import "octicon-mixins";
|
||||
|
||||
@font-face { .octicon-font(); }
|
||||
|
||||
html {
|
||||
font-family: @font-family;
|
||||
font-size: @font-size;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
atom-workspace {
|
||||
display: flex;
|
||||
@ -28,7 +13,7 @@ atom-workspace {
|
||||
atom-workspace-axis {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
||||
atom-workspace-axis.horizontal {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
|
Loading…
Reference in New Issue
Block a user