Skip to content

Instantly share code, notes, and snippets.

@vjeux

vjeux/nuclide.diff

Created May 20, 2017 16:04
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save vjeux/e1d1b286d87dabddd7740fed1c7d213d to your computer and use it in GitHub Desktop.
Save vjeux/e1d1b286d87dabddd7740fed1c7d213d to your computer and use it in GitHub Desktop.
Download ZIP
Raw
nuclide.diff
diff --git a/modules/nuclide-commons-ui/styles/Checkbox.less b/modules/nuclide-commons-ui/styles/Checkbox.less
index 729a6d725..48ab20fc9 100644
--- a/modules/nuclide-commons-ui/styles/Checkbox.less
+++ b/modules/nuclide-commons-ui/styles/Checkbox.less
@@ -1,7 +1,8 @@
@import "ui-variables";
.nuclide-ui-checkbox-label, .nuclide-ui-toggle-label {
- margin-bottom: 0; // This is to override a default in bootstrap.
+ margin-bottom: 0;
+ // This is to override a default in bootstrap.
}
@disabled-opacity: 0.65;
diff --git a/modules/nuclide-commons-ui/styles/Table.less b/modules/nuclide-commons-ui/styles/Table.less
index 8e672829a..10da1dad9 100644
--- a/modules/nuclide-commons-ui/styles/Table.less
+++ b/modules/nuclide-commons-ui/styles/Table.less
@@ -30,8 +30,7 @@
width: 100%;
}
-.nuclide-ui-table-header-cell,
-.nuclide-ui-table-body-cell {
+.nuclide-ui-table-header-cell, .nuclide-ui-table-body-cell {
border-right: 1px solid @base-border-color;
overflow: hidden;
padding: 2px 4px;
@@ -40,14 +39,15 @@
.nuclide-ui-table-body-cell {
word-break: break-word;
- text-overflow:inherit;
+ text-overflow: inherit;
}
.nuclide-ui-table-header-cell {
-webkit-user-select: none;
position: relative;
text-overflow: ellipsis;
- vertical-align: baseline; // align sort icons with text
+ vertical-align: baseline;
+ // align sort icons with text
white-space: nowrap;
}
diff --git a/modules/nuclide-commons-ui/styles/Toolbar.less b/modules/nuclide-commons-ui/styles/Toolbar.less
index fcddc2419..8b5f0b44c 100644
--- a/modules/nuclide-commons-ui/styles/Toolbar.less
+++ b/modules/nuclide-commons-ui/styles/Toolbar.less
@@ -29,9 +29,7 @@
// * Any single children should take up the whole width (flex: 1)
// * If there are left, right, and center elements, the left and right should
// both have equal width (so that middle column is actually centered)
- &:only-child,
- &:nth-child(3),
- &:nth-last-child(3) {
+ &:only-child, &:nth-child(3), &:nth-last-child(3) {
flex: 1;
}
}
diff --git a/pkg/nuclide-console/styles/nuclide-console.less b/pkg/nuclide-console/styles/nuclide-console.less
index 45fbd034c..24bb8c033 100644
--- a/pkg/nuclide-console/styles/nuclide-console.less
+++ b/pkg/nuclide-console/styles/nuclide-console.less
@@ -6,7 +6,10 @@
@nuclide-console-record-text-color-normal: @syntax-text-color;
// Don't use @base-border-color because that's a UI color, and makes light/dark
// combinations look bad.
-@nuclide-console-record-border-color-normal: darken(@syntax-background-color, 5%);
+@nuclide-console-record-border-color-normal: darken(
+ @syntax-background-color,
+ 5%
+);
@nuclide-console-record-text-color-error: @text-color-error;
@nuclide-console-record-border-color-error: @background-color-error;
@nuclide-console-record-text-color-warning: @text-color-warning;
@@ -18,7 +21,10 @@
@nuclide-console-icon-size: 11px;
// Color variables for `level-color` classes.
-@nuclide-console-record-background-color-red: lighten(@background-color-error, 25%);
+@nuclide-console-record-background-color-red: lighten(
+ @background-color-error,
+ 25%
+);
@nuclide-console-record-text-color-red: darken(@text-color-error, 40%);
@nuclide-console-record-background-color-orange: lighten(@ui-site-color-3, 25%);
@nuclide-console-record-text-color-orange: darken(@ui-site-color-3, 40%);
@@ -48,8 +54,8 @@
.nuclide-ui-toolbar {
background-color: @pane-item-background-color;
- atom-dock &,
- atom-panel & { // TODO(matthewwithanm): Remove this selector when killing workspace views
+ atom-dock &, atom-panel & {
+ // TODO(matthewwithanm): Remove this selector when killing workspace views
background-color: @tool-panel-background-color;
}
}
@@ -62,7 +68,8 @@
min-height: 0;
}
-.nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+.nuclide-console-lazy-nested-value div,
+.nuclide-console-lazy-nested-value span {
font-size: @nuclide-console-record-font-size;
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
white-space: pre-wrap;
@@ -103,7 +110,8 @@
.nuclide-console-record {
display: flex;
- padding: @nuclide-console-record-vertical-padding @nuclide-console-record-horizontal-padding;
+ padding: @nuclide-console-record-vertical-padding
+ @nuclide-console-record-horizontal-padding;
padding-left: 2 * @nuclide-console-record-horizontal-padding;
&::before {
@@ -117,7 +125,9 @@
background-color: @nuclide-console-record-background-color-normal;
border-radius: 0;
- border-top: @nuclide-console-border-size solid @nuclide-console-record-border-color-normal;
+ border-top: @nuclide-console-border-size
+ solid
+ @nuclide-console-record-border-color-normal;
color: @nuclide-console-record-text-color-normal;
cursor: text;
border-left: (@component-padding / 2) solid transparent;
@@ -129,8 +139,7 @@
white-space: pre-wrap;
}
- pre,
- pre a {
+ pre, pre a {
color: @nuclide-console-record-text-color-normal;
}
@@ -139,11 +148,7 @@
text-align: center;
}
- &,
- pre,
- atom-text-editor,
- .icon,
- .icon::before {
+ &, pre, atom-text-editor, .icon, .icon::before {
font-size: @nuclide-console-record-font-size;
}
@@ -157,7 +162,9 @@
}
&:last-child {
- border-bottom: @nuclide-console-border-size solid @nuclide-console-record-border-color-normal;
+ border-bottom: @nuclide-console-border-size
+ solid
+ @nuclide-console-record-border-color-normal;
}
&.level-info {
@@ -171,7 +178,10 @@
background-color: @nuclide-console-record-border-color-warning;
}
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-warning;
}
@@ -185,7 +195,10 @@
background-color: @nuclide-console-record-border-color-success;
}
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-success;
}
@@ -199,62 +212,85 @@
background-color: @nuclide-console-record-border-color-error;
}
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-error;
}
.icon {
color: @nuclide-console-record-border-color-error;
}
-
}
// Console record colors for `level-color` classes.
&.level-red {
background-color: @nuclide-console-record-background-color-red;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-red;
}
}
&.level-orange {
background-color: @nuclide-console-record-background-color-orange;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-orange;
}
}
&.level-yellow {
background-color: @nuclide-console-record-background-color-yellow;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-yellow;
}
}
&.level-green {
background-color: @nuclide-console-record-background-color-green;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-green;
}
}
&.level-blue {
background-color: @nuclide-console-record-background-color-blue;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-blue;
}
}
&.level-purple {
background-color: @nuclide-console-record-background-color-purple;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-console-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-console-lazy-nested-value span {
color: @nuclide-console-record-text-color-purple;
}
}
&.level-violet {
background-color: @nuclide-console-record-background-color-violet;
- pre, pre a, .nuclide-console-lazy-nested-value div, .nuclide-ui-lazy-nested-value span {
+ pre,
+ pre a,
+ .nuclide-console-lazy-nested-value div,
+ .nuclide-ui-lazy-nested-value span {
color: @nuclide-console-record-text-color-violet;
}
}
@@ -302,7 +338,6 @@
background-color: darken(@syntax-background-color, 3%);
}
}
-
}
.nuclide-console-record-content-wrapper {
@@ -315,22 +350,21 @@
padding-bottom: 1px;
.nuclide-ui-lazy-nested-value-treelist {
-
// Inherit the line-height so that it's the same as other records. If we
// don't do this, the expandable items will be taller.
- li.list-nested-item > .list-item,
- .list-item {
+ li.list-nested-item > .list-item, .list-item {
line-height: inherit;
}
}
}
-.nuclide-console-record-source-label,
-.nuclide-console-record-timestamp {
+.nuclide-console-record-source-label, .nuclide-console-record-timestamp {
align-self: flex-start;
margin: 2px 0 0 4px;
white-space: nowrap;
- font-size: 0.8em; // This makes the label < 1 line tall in most themes.
+ font-size: 0.8em;
+
+ // This makes the label < 1 line tall in most themes.
// Ramp up the specificity and override Atom's default label padding.
span& {
diff --git a/pkg/nuclide-context-view/styles/nuclide-context-view.less b/pkg/nuclide-context-view/styles/nuclide-context-view.less
index 6daa85d49..be998a261 100644
--- a/pkg/nuclide-context-view/styles/nuclide-context-view.less
+++ b/pkg/nuclide-context-view/styles/nuclide-context-view.less
@@ -1,6 +1,7 @@
.nuclide-context-view-content {
overflow-y: auto;
- white-space: normal; // Prevent contents of sidebar from overflowing
+ white-space: normal;
+ // Prevent contents of sidebar from overflowing
height: 100%;
width: 100%;
}
diff --git a/pkg/nuclide-datatip/styles/datatip.atom-text-editor.less b/pkg/nuclide-datatip/styles/datatip.atom-text-editor.less
index 1b49f6e7f..b3fb4c97b 100644
--- a/pkg/nuclide-datatip/styles/datatip.atom-text-editor.less
+++ b/pkg/nuclide-datatip/styles/datatip.atom-text-editor.less
@@ -2,10 +2,13 @@
// Animation definitions cannot cross the shadow boundary,
// and thus need to be loaded directly into the atom-text-editor scope.
-atom-text-editor::shadow,
-atom-text-editor {
+atom-text-editor::shadow, atom-text-editor {
@keyframes RotatingBackground {
- 0% {background-position-x: 0%}
- 100% {background-position-x: 100%}
+ 0% {
+ background-position-x: 0%;
+ }
+ 100% {
+ background-position-x: 100%;
+ }
}
}
diff --git a/pkg/nuclide-datatip/styles/nuclide-datatip-marked.less b/pkg/nuclide-datatip/styles/nuclide-datatip-marked.less
index 465f3e7ff..95891ba41 100644
--- a/pkg/nuclide-datatip/styles/nuclide-datatip-marked.less
+++ b/pkg/nuclide-datatip/styles/nuclide-datatip-marked.less
@@ -31,10 +31,13 @@
.nuclide-datatip-marked-text-editor atom-text-editor {
background-color: transparent;
- min-width: 1em; // Hack to force the AtomTextEditor to properly size itself
+ min-width: 1em;
+
+ // Hack to force the AtomTextEditor to properly size itself
.editor-contents--private {
- cursor: inherit!important; // Let the enclosing datatip override the cursor.
+ cursor: inherit !important;
+ // Let the enclosing datatip override the cursor.
}
// Prevent forced scroll bar in Atom 1.9.x
diff --git a/pkg/nuclide-datatip/styles/nuclide-datatip.less b/pkg/nuclide-datatip/styles/nuclide-datatip.less
index 9ae10bcab..fd84bd9bd 100644
--- a/pkg/nuclide-datatip/styles/nuclide-datatip.less
+++ b/pkg/nuclide-datatip/styles/nuclide-datatip.less
@@ -2,11 +2,12 @@
.nuclide-datatip-overlay {
background: @app-background-color;
- box-shadow: 0px 1px 4px 0px rgba(0,0,0,1);
+ box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 1);
color: @text-color-subtle;
font-family: Menlo, Monaco, Consolas, monospace;
font-size: @font-size;
- margin-top: -2px; // Compensate for shadow
+ margin-top: -2px;
+ // Compensate for shadow
position: relative;
white-space: nowrap;
}
@@ -25,7 +26,11 @@
position: relative;
transition: background-color 0.15s ease;
&:hover {
- background-color: mix(@base-background-color, @background-color-highlight, 50%);
+ background-color: mix(
+ @base-background-color,
+ @background-color-highlight,
+ 50%
+ );
}
&:not(:last-of-type) {
@@ -64,7 +69,6 @@
}
atom-text-editor {
-
.nuclide-datatip-highlight-region > .region {
background: @background-color-highlight;
}
@@ -81,5 +85,4 @@ atom-text-editor {
);
background-size: 300% 100%;
}
-
}
diff --git a/pkg/nuclide-debugger/styles/gutter.atom-text-editor.less b/pkg/nuclide-debugger/styles/gutter.atom-text-editor.less
index 92d10d7bb..a62d963ab 100644
--- a/pkg/nuclide-debugger/styles/gutter.atom-text-editor.less
+++ b/pkg/nuclide-debugger/styles/gutter.atom-text-editor.less
@@ -2,8 +2,7 @@
@import "octicon-mixins.less";
@import "octicon-utf-codes.less";
-.nuclide-debugger-breakpoint-icon,
-.nuclide-debugger-shadow-breakpoint-icon {
+.nuclide-debugger-breakpoint-icon, .nuclide-debugger-shadow-breakpoint-icon {
// Needs to match .nuclide-diagnostics-gutter-ui-gutter-error
.octicon(primitive-dot, @size: 130%);
}
@@ -55,5 +54,5 @@
@backgroundColor 95%,
@pseudoBorderColor 95%,
@pseudoBorderColor 100%
- )
+ );
}
diff --git a/pkg/nuclide-debugger/styles/ui.less b/pkg/nuclide-debugger/styles/ui.less
index 33e7f2d66..706d08752 100644
--- a/pkg/nuclide-debugger/styles/ui.less
+++ b/pkg/nuclide-debugger/styles/ui.less
@@ -83,7 +83,7 @@ Use flexbox cross-axis stretch to fill the vertical space.
.nuclide-debugger-vfill-parent() {
display: flex;
- flex-direction:row;
+ flex-direction: row;
align-children: stretch;
align-items: stretch;
}
@@ -95,10 +95,11 @@ Use flexbox cross-axis stretch to fill the vertical space.
.nuclide-debugger-webview {
background-color: #fff;
.nuclide-debugger-vfill-parent();
- .nuclide-debugger-vfill-child(); // child relative to .inspector
+ .nuclide-debugger-vfill-child();
+
+ // child relative to .inspector
- &::shadow object,
- object {
+ &::shadow object, object {
.nuclide-debugger-vfill-child();
// The object element is generated with inline style height:100%.
height: auto !important;
@@ -152,7 +153,8 @@ Use flexbox cross-axis stretch to fill the vertical space.
flex-direction: row;
font-family: Menlo, Monaco, Consolas, monospace;
justify-content: space-between;
- min-height: 23px; // Match height of AtomInput to prevent list items from jumping around.
+ min-height: 23px;
+ // Match height of AtomInput to prevent list items from jumping around.
overflow: visible;
}
@@ -192,7 +194,7 @@ Use flexbox cross-axis stretch to fill the vertical space.
.nuclide-debugger-watch-expression-input {
// Vertically align listed watch expressions with input.
- margin-left: -@leftMargin;
+ margin-left: - @leftMargin;
}
.nuclide-debugger-watch-expression-add-new-input {
@@ -300,9 +302,9 @@ Use flexbox cross-axis stretch to fill the vertical space.
/* Thread switch datatip */
.nuclide-debugger-thread-switch-alert {
- padding: 1px 4px;
- font-weight: bold;
- color: @text-color-warning;
+ padding: 1px 4px;
+ font-weight: bold;
+ color: @text-color-warning;
}
.nuclide-debugger-thread-loading {
diff --git a/pkg/nuclide-diagnostics-ui/styles/diagnostics-table.less b/pkg/nuclide-diagnostics-ui/styles/diagnostics-table.less
index 7c5ceabd6..16c0993d2 100644
--- a/pkg/nuclide-diagnostics-ui/styles/diagnostics-table.less
+++ b/pkg/nuclide-diagnostics-ui/styles/diagnostics-table.less
@@ -15,8 +15,7 @@
border-left-width: 0;
border-right-width: 0;
- td:last-child,
- th:last-child {
+ td:last-child, th:last-child {
border-right-width: 0;
}
}
@@ -33,8 +32,7 @@
.nuclide-diagnostics-ui-table-message {
text-align: center;
- &.highlight-warning,
- &.highlight-error {
+ &.highlight-warning, &.highlight-error {
border-radius: 0;
padding: (@component-padding / 2) 0 @component-padding 0;
}
diff --git a/pkg/nuclide-diagnostics-ui/styles/gutter.atom-text-editor.less b/pkg/nuclide-diagnostics-ui/styles/gutter.atom-text-editor.less
index ba6b06b46..e7d1bd9d4 100644
--- a/pkg/nuclide-diagnostics-ui/styles/gutter.atom-text-editor.less
+++ b/pkg/nuclide-diagnostics-ui/styles/gutter.atom-text-editor.less
@@ -34,7 +34,7 @@
.nuclide-diagnostics-gutter-ui-popup {
background: @app-background-color;
- box-shadow: 0px 1px 4px 0px rgba(0,0,0,1);
+ box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 1);
position: absolute;
padding-right: 10px;
padding-left: 10px;
@@ -61,12 +61,12 @@
.nuclide-diagnostics-gutter-ui-popup-error
.nuclide-diagnostics-gutter-ui-popup-header {
- background-color: fade(@text-color-error, 20%);
+ background-color: fade(@text-color-error, 20%);
}
.nuclide-diagnostics-gutter-ui-popup-warning
.nuclide-diagnostics-gutter-ui-popup-header {
- background-color: fade(@text-color-warning, 20%);
+ background-color: fade(@text-color-warning, 20%);
}
.nuclide-diagnostics-gutter-ui-popup-message {
diff --git a/pkg/nuclide-file-tree/styles/nuclide-file-tree.less b/pkg/nuclide-file-tree/styles/nuclide-file-tree.less
index 1cbcc3936..59607703b 100644
--- a/pkg/nuclide-file-tree/styles/nuclide-file-tree.less
+++ b/pkg/nuclide-file-tree/styles/nuclide-file-tree.less
@@ -2,7 +2,8 @@
@import "syntax-variables";
.list-tree.has-collapsable-children .list-nested-item > .list-item.loading:before {
- content: "\f087"; // 'sync' icon, spinning arrows
+ content: "\f087";
+ // 'sync' icon, spinning arrows
}
/*
@@ -13,7 +14,8 @@
.tree-view {
flex-grow: 1;
flex-shrink: 0;
- min-height: min-content; // Switched from tree-view's `100%` to fill height of scroller.
+ min-height: min-content;
+ // Switched from tree-view's `100%` to fill height of scroller.
padding-left: @component-icon-padding;
padding-right: @component-padding;
position: relative;
@@ -40,8 +42,7 @@
&:indeterminate {
background-color: @text-color-warning;
}
- &:checked,
- &:active {
+ &:checked, &:active {
background-color: @background-color-success;
}
@@ -49,13 +50,10 @@
// hundreds of checkboxes simultaneously as is the case in the
// 'nuclide-file-tree' package w/Working Sets, they are too expensive to
// paint. The followings styles intentionally omit transitions.
- &,
- &:before,
- &:after {
+ &, &:before, &:after {
transition: none;
}
}
-
}
.nuclide-file-tree-filter {
@@ -68,7 +66,7 @@
left: @component-padding;
z-index: 1;
background: @overlay-background-color;
- padding: @component-padding/2 @component-padding;
+ padding: @component-padding / 2 @component-padding;
border: 1px solid @overlay-border-color;
transition: opacity 0.5s;
display: none;
@@ -116,14 +114,13 @@
opacity: 0.4;
}
-
.nuclide-file-tree-working-set-name-missing {
visibility: hidden;
}
// matches the margin in .inline-block-tight
.nuclide-file-tree-connection-title {
- margin-left: @component-padding/2;
+ margin-left: @component-padding / 2;
}
.nuclide-file-tree-open-files {
@@ -141,8 +138,7 @@
color: @text-color-highlight;
}
- .icon-primitive-dot:before,
- .icon-x:before {
+ .icon-primitive-dot:before, .icon-x:before {
font-size: 12px;
height: 12px;
width: 12px;
diff --git a/pkg/nuclide-home/styles/nuclide-home.less b/pkg/nuclide-home/styles/nuclide-home.less
index 5119912ed..c0aef6ffb 100644
--- a/pkg/nuclide-home/styles/nuclide-home.less
+++ b/pkg/nuclide-home/styles/nuclide-home.less
@@ -49,7 +49,7 @@
color: lighten(@text-color, 4%);
}
&::-webkit-details-marker {
- display: none
+ display: none;
}
&:before {
width: 20px;
@@ -70,7 +70,6 @@
margin-bottom: 0;
}
}
-
}
.nuclide-home-logo {
diff --git a/pkg/nuclide-nux/styles/nuclide-nux.less b/pkg/nuclide-nux/styles/nuclide-nux.less
index 81d11aa0d..80d90415d 100644
--- a/pkg/nuclide-nux/styles/nuclide-nux.less
+++ b/pkg/nuclide-nux/styles/nuclide-nux.less
@@ -5,16 +5,16 @@
* This source code is licensed under the license found in the LICENSE file in
* the root directory of this source tree.
*/
- @import "ui-variables";
+@import "ui-variables";
- // Unfortunately, only SOME themes have values for tooltip text/background colour variables.
- // (;´༎ຶД༎ຶ`) ༼ つ ಥ_ಥ ༽つ (ง'̀-'́)ง
- // So, we define fallback values to these variables based on the Atom UI variables.
- // This may not be ideal, but is the best solution until tooltip colours are added to `ui-variables`.
- .define-tooltip-colors-if-not-defined() {
- @tooltip-text-color: @text-color;
- @tooltip-background-color: @base-background-color;
- }
+// Unfortunately, only SOME themes have values for tooltip text/background colour variables.
+// (;´༎ຶД༎ຶ`) ༼ つ ಥ_ಥ ༽つ (ง'̀-'́)ง
+// So, we define fallback values to these variables based on the Atom UI variables.
+// This may not be ideal, but is the best solution until tooltip colours are added to `ui-variables`.
+.define-tooltip-colors-if-not-defined() {
+ @tooltip-text-color: @text-color;
+ @tooltip-background-color: @base-background-color;
+}
.define-tooltip-colors-if-not-defined();
// According to the styling in `atom/notifications`, the z-index of notifications is set to 1000.
@@ -55,7 +55,8 @@
background-color: @tooltip-background-color;
border-radius: @component-border-radius;
padding: 3px 8px 3px 8px;
- -webkit-user-select: none; /* Disable text selection, useful when double clicking */
+ -webkit-user-select: none;
+ /* Disable text selection, useful when double clicking */
margin-left: 3px;
font-size: 11px;
}
diff --git a/pkg/nuclide-quick-open/styles/quick-open.less b/pkg/nuclide-quick-open/styles/quick-open.less
index 77b5ba942..c9a54f2b4 100644
--- a/pkg/nuclide-quick-open/styles/quick-open.less
+++ b/pkg/nuclide-quick-open/styles/quick-open.less
@@ -52,7 +52,7 @@ atom-panel.modal.nuclide-quick-open {
position: relative;
// A reasonable heuristic that prevents us from having to measure:
// Top bar approx height (165px) + Modal top margin (50px) = 195px
- max-height: calc(~'100vh - 195px');
+ max-height: calc(~ '100vh - 195px');
}
.omnisearch-pane {
diff --git a/pkg/nuclide-remote-projects/styles/ssh-dialog.less b/pkg/nuclide-remote-projects/styles/ssh-dialog.less
index a45743e38..fc2ca0da8 100644
--- a/pkg/nuclide-remote-projects/styles/ssh-dialog.less
+++ b/pkg/nuclide-remote-projects/styles/ssh-dialog.less
@@ -23,8 +23,7 @@
height: 30px;
}
-.nuclide-auth-method-input,
-.nuclide-auth-method-label {
+.nuclide-auth-method-input, .nuclide-auth-method-label {
display: inline-block;
}
@@ -45,8 +44,7 @@
margin-right: 1em;
}
-.nuclide-auth-method-password,
-.nuclide-auth-method-privatekey {
+.nuclide-auth-method-password, .nuclide-auth-method-privatekey {
width: 250px;
}
diff --git a/pkg/nuclide-task-runner/styles/nuclide-task-runner-toolbar.less b/pkg/nuclide-task-runner/styles/nuclide-task-runner-toolbar.less
index b2cfc0300..8fad3814c 100644
--- a/pkg/nuclide-task-runner/styles/nuclide-task-runner-toolbar.less
+++ b/pkg/nuclide-task-runner/styles/nuclide-task-runner-toolbar.less
@@ -40,7 +40,7 @@
@ui-site-color-1 0%,
@ui-site-color-1 25%,
transparent 25%,
- transparent 100%,
+ transparent 100%
);
background-size: @nuclide-task-runner-indeterminate-bar-1-size 100%;
animation: animate-indeterminate-bar 8s linear infinite;
@@ -56,23 +56,30 @@
@nuclide-task-runner-indeterminate-bar-2-color 0%,
@nuclide-task-runner-indeterminate-bar-2-color 25%,
transparent 25%,
- transparent 100%,
+ transparent 100%
);
background-size: @nuclide-task-runner-indeterminate-bar-2-size 100%;
animation: animate-indeterminate-bar-2 8s linear infinite;
}
}
-
}
@keyframes animate-indeterminate-bar {
- 0% { background-position: 0 0; }
- 100% { background-position: @nuclide-task-runner-indeterminate-bar-1-size 0; }
+ 0% {
+ background-position: 0 0;
+ }
+ 100% {
+ background-position: @nuclide-task-runner-indeterminate-bar-1-size 0;
+ }
}
@keyframes animate-indeterminate-bar-2 {
- 0% { background-position: 0 0; }
- 100% { background-position: @nuclide-task-runner-indeterminate-bar-2-size 0; }
+ 0% {
+ background-position: 0 0;
+ }
+ 100% {
+ background-position: @nuclide-task-runner-indeterminate-bar-2-size 0;
+ }
}
.nuclide-task-runner-progress-bar-bar {
diff --git a/pkg/nuclide-ui/styles/ChangedFile.less b/pkg/nuclide-ui/styles/ChangedFile.less
index 6d69f7166..dcc413ce4 100644
--- a/pkg/nuclide-ui/styles/ChangedFile.less
+++ b/pkg/nuclide-ui/styles/ChangedFile.less
@@ -30,7 +30,7 @@
}
.nuclide-changed-file-checkbox {
- margin-right: @component-padding/2;
+ margin-right: @component-padding / 2;
}
.nuclide-changed-file-checkbox .nuclide-ui-checkbox {
diff --git a/pkg/nuclide-ui/styles/Combobox.less b/pkg/nuclide-ui/styles/Combobox.less
index 5f146c3c1..ba9d294d6 100644
--- a/pkg/nuclide-ui/styles/Combobox.less
+++ b/pkg/nuclide-ui/styles/Combobox.less
@@ -21,7 +21,6 @@
z-index: 999;
.nuclide-combobox-list-group.list-group {
-
background: @base-background-color;
border: 1px solid @overlay-border-color;
border-top: none;
diff --git a/pkg/nuclide-ui/styles/FileChanges.less b/pkg/nuclide-ui/styles/FileChanges.less
index 8ccfe1c16..c300b4df1 100644
--- a/pkg/nuclide-ui/styles/FileChanges.less
+++ b/pkg/nuclide-ui/styles/FileChanges.less
@@ -28,7 +28,6 @@
@blendAmount: 10%;
atom-text-editor {
-
.nuclide-ui-hunk-diff-insert .region {
@add-color-faded: fade(@add-color, @blendAmount);
border-left-style: solid;
diff --git a/pkg/nuclide-ui/styles/ShowMoreComponent.less b/pkg/nuclide-ui/styles/ShowMoreComponent.less
index 23dc06805..3af65f6a2 100644
--- a/pkg/nuclide-ui/styles/ShowMoreComponent.less
+++ b/pkg/nuclide-ui/styles/ShowMoreComponent.less
@@ -7,7 +7,11 @@
.nuclide-ui-show-more-gradient {
height: 2em;
width: 100%;
- background: linear-gradient(to bottom, fade(@base-background-color, 5%), @background-color-highlight);
+ background: linear-gradient(
+ to bottom,
+ fade(@base-background-color, 5%),
+ @background-color-highlight
+ );
position: absolute;
bottom: 0;
}
diff --git a/pkg/nuclide-ui/styles/_atom-hacks.less b/pkg/nuclide-ui/styles/_atom-hacks.less
index 634f349e1..d44370a19 100644
--- a/pkg/nuclide-ui/styles/_atom-hacks.less
+++ b/pkg/nuclide-ui/styles/_atom-hacks.less
@@ -1,8 +1,7 @@
// Make sure that the :after pseudoelement doesn't get the click instead of the
// element with the [data-path] attribute.
// TODO: Get this added to the theme.
-.theme-one-light-ui,
-.theme-one-dark-ui {
+.theme-one-light-ui, .theme-one-dark-ui {
.tab-bar .tab:after {
pointer-events: none;
}
diff --git a/pkg/nuclide-ui/styles/atom-text-editor.less b/pkg/nuclide-ui/styles/atom-text-editor.less
index 9f9774c12..429dc1e7b 100644
--- a/pkg/nuclide-ui/styles/atom-text-editor.less
+++ b/pkg/nuclide-ui/styles/atom-text-editor.less
@@ -4,14 +4,14 @@
atom-text-editor {
.ansi-escape-code {
- // Ideally we'd like to just set this to `display:none`. But, unfortunately, having a display:none
- // content in Atom's text editor messes with its internal size measurement logic.
- // As a result it sometimes decides that on a horizontal resize of the containing panel
- // to resize the editor contents as well. This effectively prevents any horizontal scrolling.
- // As there's no overflown content after the resize.
- //
- // So, instead of display:none we set the text font size to 1px (0 didn't work) and color to
- // transparent, which visually make it almost invisible.
+ // Ideally we'd like to just set this to `display:none`. But, unfortunately, having a display:none
+ // content in Atom's text editor messes with its internal size measurement logic.
+ // As a result it sometimes decides that on a horizontal resize of the containing panel
+ // to resize the editor contents as well. This effectively prevents any horizontal scrolling.
+ // As there's no overflown content after the resize.
+ //
+ // So, instead of display:none we set the text font size to 1px (0 didn't work) and color to
+ // transparent, which visually make it almost invisible.
font-size: 1px;
color: rgba(0, 0, 0, 0);
}
diff --git a/pkg/nuclide-ui/styles/dashed-background-mixin.less b/pkg/nuclide-ui/styles/dashed-background-mixin.less
index 280b58b5c..2b70e67d6 100644
--- a/pkg/nuclide-ui/styles/dashed-background-mixin.less
+++ b/pkg/nuclide-ui/styles/dashed-background-mixin.less
@@ -16,7 +16,8 @@
background: repeating-linear-gradient(
-45deg,
@diff-block-offset-cross-color,
- @diff-block-offset-cross-color, 5px,
+ @diff-block-offset-cross-color,
+ 5px,
transparent 5px,
transparent 10px
);
diff --git a/pkg/nuclide-ui/styles/tabs.less b/pkg/nuclide-ui/styles/tabs.less
index 1c5f75e6a..a0e8399fe 100644
--- a/pkg/nuclide-ui/styles/tabs.less
+++ b/pkg/nuclide-ui/styles/tabs.less
@@ -1,7 +1,6 @@
@import "ui-variables";
-.nuclide-tabs > .tab-bar .tab,
-.nuclide-tabs > .tab-bar .tab.active {
+.nuclide-tabs > .tab-bar .tab, .nuclide-tabs > .tab-bar .tab.active {
cursor: pointer;
transition: color 0 linear !important;
flex: inherit;
@@ -9,12 +8,10 @@
}
//disable auto-grow on hover
-.nuclide-tabs > .tab-bar .tab.active,
-.nuclide-tabs > .tab-bar .tab:hover {
+.nuclide-tabs > .tab-bar .tab.active, .nuclide-tabs > .tab-bar .tab:hover {
flex-grow: inherit;
}
-
.nuclide-tabs > .tab-bar .tab:hover .title {
color: @text-color-highlight;
}
diff --git a/pkg/nuclide-ui/styles/tree-component.less b/pkg/nuclide-ui/styles/tree-component.less
index 1e55e15ab..8e234466c 100644
--- a/pkg/nuclide-ui/styles/tree-component.less
+++ b/pkg/nuclide-ui/styles/tree-component.less
@@ -36,8 +36,11 @@
}
@keyframes spin {
- from {transform:rotate(0deg);}
- to {transform:rotate(360deg);}
+ from {
+ transform: rotate(0deg);
+ }
+ to {
+ transform: rotate(360deg);
+ }
}
-
}
diff --git a/pkg/nuclide-vcs-log/styles/nuclide-vcs-log.less b/pkg/nuclide-vcs-log/styles/nuclide-vcs-log.less
index 0780776e6..a4c19c840 100644
--- a/pkg/nuclide-vcs-log/styles/nuclide-vcs-log.less
+++ b/pkg/nuclide-vcs-log/styles/nuclide-vcs-log.less
@@ -45,7 +45,7 @@
text-decoration: underline;
}
-.nuclide-vcs-log-differential-cell-text {
+.nuclide-vcs-log-differential-cell-text {
cursor: pointer;
}
diff --git a/pkg/nuclide-workspace-view-locations/styles/nuclide-workspace-view-locations.less b/pkg/nuclide-workspace-view-locations/styles/nuclide-workspace-view-locations.less
index bebbf763c..cf2c96cef 100644
--- a/pkg/nuclide-workspace-view-locations/styles/nuclide-workspace-view-locations.less
+++ b/pkg/nuclide-workspace-view-locations/styles/nuclide-workspace-view-locations.less
@@ -5,15 +5,30 @@
@nuclide-workspace-views-toggle-button-size: 50px;
// From one-light-ui
-.ui-syntax-color() { @syntax-background-color: hsl(220,1%,98%); } .ui-syntax-color(); // fallback color
+.ui-syntax-color() {
+ @syntax-background-color: hsl(220, 1%, 98%);
+}
+.ui-syntax-color();
+// fallback color
@ui-syntax-color: @syntax-background-color;
@ui-s-h: hue(@ui-syntax-color);
-.ui-hue() when (@ui-s-h = 0) { @ui-hue: 220; } // Use blue hue when no saturation
-.ui-hue() when (@ui-s-h > 0) { @ui-hue: @ui-s-h; }
+.ui-hue() when (@ui-s-h = 0) {
+ @ui-hue: 220;
+}
+// Use blue hue when no saturation
+.ui-hue() when (@ui-s-h > 0) {
+ @ui-hue: @ui-s-h;
+}
.ui-hue();
-@accent-luma: luma(hsl(@ui-hue, 50%, 50%)); // get lightness of current hue
-@accent-color: mix(hsv(@ui-hue, 60%, 60%), hsl(@ui-hue, 100%, 68%), @accent-luma * 2); // mix hsv + hsl (favor hsl for dark, hsv for light colors)
-@accent-text-color: contrast(@accent-color, hsl(@ui-hue,100%,16%), #fff, 40%);
+@accent-luma: luma(hsl(@ui-hue, 50%, 50%));
+// get lightness of current hue
+@accent-color: mix(
+ hsv(@ui-hue, 60%, 60%),
+ hsl(@ui-hue, 100%, 68%),
+ @accent-luma * 2
+);
+// mix hsv + hsl (favor hsl for dark, hsv for light colors)
+@accent-text-color: contrast(@accent-color, hsl(@ui-hue, 100%, 16%), #fff, 40%);
.nuclide-workspace-views-panel-content {
display: flex;
@@ -30,8 +45,12 @@
// Use the resize cursor when the handle's in "resize" mode.
&.nuclide-workspace-views-panel-handle-resize {
- &.left, &.right { cursor: col-resize; }
- &.top, &.bottom { cursor: row-resize; }
+ &.left, &.right {
+ cursor: col-resize;
+ }
+ &.top, &.bottom {
+ cursor: row-resize;
+ }
}
&.nuclide-workspace-views-panel-handle-open {
@@ -42,7 +61,9 @@
.nuclide-workspace-views-panel-mask {
position: relative;
background-color: @tool-panel-background-color;
- overflow: hidden; // Mask the content.
+ overflow: hidden;
+
+ // Mask the content.
// This shouldn't technically be necessary. Apparently, there's a bug in
// Chrome whereby the 100% width (in top and bottom panels) and height (in
@@ -67,30 +88,53 @@
display: flex;
// Make sure to center the toggle buttons
- &.top, &.bottom { flex-direction: column; }
+ &.top, &.bottom {
+ flex-direction: column;
+ }
align-items: center;
// Position the panels flush with their side of the editor.
- &.top { left: 0; }
- &.right { right: 0; }
- &.bottom { bottom: 0; }
- &.left { left: 0; }
+ &.top {
+ left: 0;
+ }
+ &.right {
+ right: 0;
+ }
+ &.bottom {
+ bottom: 0;
+ }
+ &.left {
+ left: 0;
+ }
&:not(.nuclide-panel-active) {
// The panel should only take up space when it's active (i.e. it shouldn't
// take up space when you're dragging something into it).
position: absolute;
- z-index: 10; // An arbitrary number. Seems high enough. ¯\_(ツ)_/¯
+ z-index: 10;
+ // An arbitrary number. Seems high enough. ¯\_(ツ)_/¯
}
// Position the panels flush with their side of the editor.
- &.top { left: 0; }
- &.right { right: 0; }
- &.bottom { bottom: 0; }
- &.left { left: 0; }
+ &.top {
+ left: 0;
+ }
+ &.right {
+ right: 0;
+ }
+ &.bottom {
+ bottom: 0;
+ }
+ &.left {
+ left: 0;
+ }
- &.left, &.right { height: 100%; }
- &.top, &.bottom { width: 100%; }
+ &.left, &.right {
+ height: 100%;
+ }
+ &.top, &.bottom {
+ width: 100%;
+ }
}
.nuclide-workspace-views-panel {
@@ -106,21 +150,39 @@
// The contents of the panel should be "stuck" to the moving edge of the mask,
// so it looks like they're sliding in (instead of being unmasked in place).
- &.top { bottom: 0; }
- &.right { left: 0; }
- &.bottom { top: 0; }
- &.left { right: 0; }
+ &.top {
+ bottom: 0;
+ }
+ &.right {
+ left: 0;
+ }
+ &.bottom {
+ top: 0;
+ }
+ &.left {
+ right: 0;
+ }
// Use flex-direction to put the resize handle in the correct place.
- &.left { flex-direction: row-reverse; }
- &.bottom { flex-direction: column; }
- &.top { flex-direction: column-reverse; }
- &.right { flex-direction: row; }
+ &.left {
+ flex-direction: row-reverse;
+ }
+ &.bottom {
+ flex-direction: column;
+ }
+ &.top {
+ flex-direction: column-reverse;
+ }
+ &.right {
+ flex-direction: row;
+ }
}
.nuclide-workspace-views-toggle-button {
position: absolute;
- overflow: hidden; // Mask half of the circle.
+ overflow: hidden;
+
+ // Mask half of the circle.
// Must be > .scrollbar-content and inactive
// .nuclide-workspace-views-panel-wrapper
@@ -129,15 +191,27 @@
// Position the toggle button target at the edge of the panel. It's important
// that this is absolutely positioned so that it doesn't expand the area of
// its container (which would block mouse events).
- &.top { top: 100%; }
- &.right { right: 100%; }
- &.bottom { bottom: 100%; }
- &.left { left: 100%; }
+ &.top {
+ top: 100%;
+ }
+ &.right {
+ right: 100%;
+ }
+ &.bottom {
+ bottom: 100%;
+ }
+ &.left {
+ left: 100%;
+ }
width: @nuclide-workspace-views-toggle-button-size;
height: @nuclide-workspace-views-toggle-button-size;
- &.top, &.bottom { height: @nuclide-workspace-views-toggle-button-size / 2; }
- &.left, &.right { width: @nuclide-workspace-views-toggle-button-size / 2; }
+ &.top, &.bottom {
+ height: @nuclide-workspace-views-toggle-button-size / 2;
+ }
+ &.left, &.right {
+ width: @nuclide-workspace-views-toggle-button-size / 2;
+ }
.nuclide-workspace-views-toggle-button-inner {
width: @nuclide-workspace-views-toggle-button-size;
@@ -151,34 +225,59 @@
align-items: center;
cursor: pointer;
- &.top { bottom: 0; }
- &.right { left: 0; }
- &.bottom { top: 0; }
- &.left { right: 0; }
- }
+ &.top {
+ bottom: 0;
+ }
+ &.right {
+ left: 0;
+ }
+ &.bottom {
+ top: 0;
+ }
+ &.left {
+ right: 0;
+ }
+ }
// Hide the button.
&:not(.nuclide-workspace-views-toggle-button-visible) {
.nuclide-workspace-views-toggle-button-inner {
- &.top { transform: translateY(-50%); }
- &.right { transform: translateX(50%); }
- &.bottom { transform: translateY(50%); }
- &.left { transform: translateX(-50%); }
+ &.top {
+ transform: translateY(-50%);
+ }
+ &.right {
+ transform: translateX(50%);
+ }
+ &.bottom {
+ transform: translateY(50%);
+ }
+ &.left {
+ transform: translateX(-50%);
+ }
}
}
// Center the icon.
@offset: 8px;
.nuclide-workspace-views-toggle-button-inner {
- &.top .icon { transform: translateY(@offset); }
- &.right .icon { transform: translateX(-@offset); }
- &.bottom .icon { transform: translateY(-@offset); }
- &.left .icon { transform: translateX(@offset); }
+ &.top .icon {
+ transform: translateY(@offset);
+ }
+ &.right .icon {
+ transform: translateX(- @offset);
+ }
+ &.bottom .icon {
+ transform: translateY(- @offset);
+ }
+ &.left .icon {
+ transform: translateX(@offset);
+ }
}
// Animate the icon.
.icon {
- transition: opacity 0.1s ease-in 0.1s; // intro
+ transition: opacity 0.1s ease-in 0.1s;
+ // intro
opacity: 1;
&::before {
@@ -189,13 +288,15 @@
}
&:not(.nuclide-workspace-views-toggle-button-visible) .icon {
opacity: 0;
- transition: opacity 0.2s ease-out 0s; // outro
+ transition: opacity 0.2s ease-out 0s;
+ // outro
}
.nuclide-workspace-views-toggle-button-inner {
background-color: @tool-panel-background-color;
border: 1px solid @pane-item-border-color;
- transition: transform 0.2s ease-out 0s; // intro
+ transition: transform 0.2s ease-out 0s;
+ // intro
}
&:not(.nuclide-workspace-views-toggle-button-visible) {
@@ -203,7 +304,8 @@
pointer-events: none;
.nuclide-workspace-views-toggle-button-inner {
- transition: transform 0.2s ease-out 0.1s; // outro
+ transition: transform 0.2s ease-out 0.1s;
+ // outro
}
}
}
@@ -211,8 +313,7 @@
// Custom tabs --------------
atom-panel .tab-bar .tab.active {
- .theme-one-light-ui &,
- .theme-one-dark-ui & {
+ .theme-one-light-ui &, .theme-one-dark-ui & {
background-color: @tool-panel-background-color;
&::after {
border-bottom-color: @tool-panel-background-color;
@@ -233,13 +334,11 @@ atom-panel .tab-bar .tab.active {
right: 0;
z-index: 4;
- &.left,
- &.right {
+ &.left, &.right {
cursor: col-resize;
}
- &.top,
- &.bottom {
+ &.top, &.bottom {
cursor: row-resize;
}
}
diff --git a/pkg/sample-lsp-tester/styles/styles.less b/pkg/sample-lsp-tester/styles/styles.less
index ced8ccc0a..acb23e2cf 100644
--- a/pkg/sample-lsp-tester/styles/styles.less
+++ b/pkg/sample-lsp-tester/styles/styles.less
@@ -6,8 +6,8 @@
width: 100%;
background-color: @pane-item-background-color;
- atom-dock &,
- atom-panel & { // TODO(matthewwithanm): Remove this selector when killing workspace views
+ atom-dock &, atom-panel & {
+ // TODO(matthewwithanm): Remove this selector when killing workspace views
background-color: @tool-panel-background-color;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment