Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Create boilerplate InlineEditor component #833

Open
flukeout opened this issue Jul 12, 2017 · 2 comments
Open

Create boilerplate InlineEditor component #833

flukeout opened this issue Jul 12, 2017 · 2 comments

Comments

@flukeout
Copy link

flukeout commented Jul 12, 2017

Would be good to have a sample component that is easy to duplicate and adapt to new use-cases.

Nice to have

  • Make it so that we don't have to replace many instances of a variable or object name
  • Startup/load method that gets called when the editor opens and gives us access to the current value of the thing we're changing so we can instantiate the UI
  • Some easy way to create rules for what we are targeting
    • HTML attribute
    • CSS Value

Font-size Example

  • Sample rule is font-size: 12px;
  • We should be able to open the viewer if we have the cursor basically anywhere within that text
  • Editor will open on any string that contains: font-size: ____;
  • When the editor opens we should be able to parse the value and units into separately editable aspects
  • The separate values "12" and "px" will be interpreted and applied as the selected values for the editor
  • If the editor cant interpret some part of the value, it will set a default
  • Editor will have independent controls for changing these
  • Each control will update a separate part of the "12px" string

cc @humphd - is this helpful at all?

@flukeout
Copy link
Author

flukeout commented Jul 12, 2017

ASC-UI

Font size:  ===========[]=====  12px
Units:   [x] px   [ ] em   [ ] rem 

@humphd
Copy link

humphd commented Jul 12, 2017

Some samples to use as a template:

I like your font-size idea as a starting point.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants