The livestyle from sergeche

Diff for unsaved files always uses CSS syntax

Every unsaved file is diff’ed against CSS syntax

Resolve when() condition in mixing

Should honour when() condition when resolving mixins

Recover from errors

While editing, sometimes document becomes invalid (for example, Invalid CSS structure error). When this happens, it’s impossible to use live update because invalid document is cached and cannot be diff’ed

Support for html

The live style should also support for <HTML>

Include imports

In many cases, LESS resolver might be useless since properties might contain variable that don’t exist in current stylesheet. Need to find a way to include imports into a scope

Optimize nesting resolver

For deeply nested sections resolving is performed multiple times, e.g. intermediate selectors resolved multiple times but it’s not required.

Implement nested mixins

Mixins can contain sections

Lost selection range after patching

When receiving updates from DevTools, the incoming selection property is [0, 0]

Resolve mixins

When accessing properties() method of tree, a list of mixin properties of current rule must be returned too, but marked as mixin and excluded from patching

Invalid patching of `red` value

Changing background: red to background: blue in browser results background: red + NaN in editor

Broken browser-to-editor messaging for user files

Console says

No "blob:..." resource in styles cache

File switching leads to high CPU usage

When multiple windows opened, changing file association in Chrome leads to very high CPU usage

More tests for safe patching

Recent tests showed that safe patching wasn’t working at all. Need to write unit tests for this feature

Format @media rules

Add support for formatting and code style detection of @media rules.

Do not unquote string in expressions

When expression is evaluated, explicit strings are unquoted automatically:

.example{
  @s: "/";
  background-image: "@{s}a.png";
}

is transformed into

.example{
  background-image: /a.png;
}

.mixin(1)                   {x: 11}
.mixin(2)                   {y: 22}
.mixin(@x) when (default()) {z: @x}

div {
  .mixin(3);
}

div.special {
  .mixin(1);
}

Check more CSS rule types

Rule types to test:

@font-face
@page
@keyframe

Support vendor-prefixed features

Add proper, Emmet-based support of vendor-prefixed properties and values

Mixin locking

The following code:

.lock-mixin(@a) {
 .inner-locked-mixin(@x: @a) when (@a = 1) {
    a: @a;
    x: @x;
  }
}
.call-lock-mixin {
  .lock-mixin(1);
  .call-inner-lock-mixin {
    .inner-locked-mixin();
  }
}

...should generate

.call-lock-mixin .call-inner-lock-mixin {
  a: 1;
  x: 1;
}

.mixin-arguments (@width: 0px, ...) {
    border: @arguments;
    width: @width;
}

.arguments {
    .mixin-arguments(1px, solid, black);
}

...should produce

.arguments {
  border: 1px solid #000000;
  width: 1px;
}

Incoming changes are not working empty files

If file in editor is empty, all incoming changes are omitted

And if it contains comments, it enters into infinite loop

sergeche / livestyle Goto Github PK

livestyle's People

Contributors

Watchers

livestyle's Issues

Recommend Projects

Recommend Topics

Recommend Org