Giter VIP home page Giter VIP logo

logical-properties's Introduction

๐Ÿง  Logical Properties

Identify and replace CSS ๐Ÿ’ช physical properties with ๐Ÿง  logical properties.

Logical Properties

Please leave a rating and review

https://marketplace.visualstudio.com/items?itemName=coderfin.logical-properties&ssr=false#review-details

Features

This extension contributes the following:

  • Command pallet - Replace all ๐Ÿ’ช physical properties with ๐Ÿง  logical properties.
    • Replaces all of the detected physical properties with logical properties in the current file.
      • Command pallet
  • keybindings: ctrl+shift+L/cmd+shift+L
    • Replaces all of the detected physical properties with logical properties in the current file.
    • Keybindings
  • Editor Context Menu: Replace all ๐Ÿ’ช physical properties with ๐Ÿง  logical properties.
    • Replaces all of the detected physical properties with logical properties in the current file.
    • Editor Context Menu
  • Problems
    • Shows any warning(s) if an open file contains physical properties.
    • Problems
  • Quick Fix/Light Bulb
    • Quickly change a single physical property to its equivalent logical property.
    • Quick Fix
  • Status Bar
    • Shows the number of physical properties detected in the current file.
      • Warning
    • Indicates if no physical properties were detected in the current file.
      • Logical
    • Click to replace all of the detected physical properties with logical properties in the current file.
  • Supported Languages
    • Testing has only been done on .css, .html, and .jsx files.
    • In theory the following languages are supported:
      • coffeescript
      • css
      • html
      • javascript
      • javascriptreact
      • less
      • markdown
      • php
      • plaintext
      • sass
      • scss
      • stylus
      • typescript
      • typescriptreact
      • vue
      • vue-html
      • xml
      • xsl

Gotchas

A few things to be aware of when using this extension:

  • False positives/negatives are possible.
    • For example, in an HTML file if you use an image tag with the height attribute, the extension will currently detect the height attribute as a physical property.
    • Double check your file after using the replace all feature.
  • Changing a physical property to a logical property may or may not have an effect on styles that override styles from other files and third-party files.

Known Issues

Limited testing of this extension has been done.

Release Notes

0.1.11

Fix an issue related to regex matching indices not currently supported in node.js

  • VSCode uses Electron
    • Electron uses node.js for local apis
      • node.js does not currently support regex matching indices (d flag, hasIndices)
  • Using a polyfill
  • See #2

0.1.10

Fixed which files diagnostics are shown for

  • Previously .git files were showing diagnostics
  • Files that were closed were still showing in Problems

0.1.9

Fixed activation

  • Fixes a bug where the extension would not work on the first time it was installed.

0.1.0

Initial release


TODO

  • Update additional checks and logic for logical properties that do not map to physical properties
  • Write Tests
  • Link to or document basic info about logical properties

logical-properties's People

Contributors

coderfin avatar onlyagrim avatar eswaramoorthykarthikeyan avatar

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.