Intellisense inside of a CSS class in razor called BlazorStyled.
- Dominant language
- C#
- Stars
- 20.7k
- Forks
- 4.3k
- PR merge metrics
- PR metrics pending
Description
I know this feature already exists in Visual Studio to have Intellisense inside of a CSS class to suggest valid CSS class names. If you type an L, you get an Intellisense box to pop open and left is probably the most common L word.
With BlazorStyled, it's CSS that gets injected into a component's class name property:
text-align: left;
height: @ControlHeightStyle;
min-height: @ControlHeightStyle;
max-height: @ControlHeightStyle;
width: @ControlWidthStyle;
min-width: @ControlWidthStyle;
max-width: @ControlHeightStyle;
position: @Position;
top: @TopStyle;
left: @LeftStyle;
display: @Display;
justify-content: left;
gap: 0px;
z-index: @ZIndex;
visibility: @Visibility;
## Summary
This feature request would be to allow the same CSS Intellisense that works on a CSS page,
to work inside of a Blazor page or components razor markup while between (here) tags. As it is now, I frequently have to go to a CSS editor to find the class or attribute name if I can't remember it.
As an alternate, if you felt it was not in scope or something you want to implement, any guidance on
what type of Editor Extension and what it would take to implement this feature to call the same
CSS Intellisense help.
## Background and Motivation
As described above, the problem it solves is creating Intellisense suggestions for known CSS attributes
because it's almost impossible to know them all. It would save having to create a temporary CSS class just to get Intellisense or auto complete help.
## Proposed Feature
If you are between a tag, pop open the CSS Intellisense menu
... As you type, the Intellisense box would suggest matching CSS Attributes
## Alternative Designs
As mentioned above, if you pass on creating this feature, any guidance on what would be the best way to approach this? Is this a MEF component, or is there a different mechanism you'd recommend for implementing completions on a razor page?
Were there other options you considered?
N/A
How does this compare to features in other editors?
This would be the exact same feature as is used in style sheet editing, so it does exist in Visual Studio if not too coupled to the style sheet page type.
Thanks, this would save a lot of time and Dynamic CSS is the best part of Blazor component development.
Contributor guide
Research direction
Start by investigating the existing CSS IntelliSense integration in Visual Studio and the MEF/editor-extension approach mentioned in the issue. Trace how Razor or Blazor component markup is recognized between tags, then define completion behavior for CSS attributes there. Done means matching CSS IntelliSense suggestions appear while editing the requested markup.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- csharp, css
- Domain
- frontend, tooling
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100