[Code]improve file tree#27129
[Code]improve file tree#27129WangQianliang wants to merge 2 commits intoelastic:feature/codefrom WangQianliang:ql-improve-file-tree
Conversation
💔 Build Failed |
1e62be4 to
d44cf9b
Compare
💔 Build Failed |
implement design styles;optimize api call
💔 Build Failed |
|
Hey @elastic/codesearch . I know this project is super early and y'all are just building out initial version. Please do me a favor though and try to use the Sass variables from EUI in any of your Sass files. It makes the styling layer maintainable so that we can do broad color or sizing changes across the product. Doing this kind of thing after the fact is usually pretty painful. Yell if you need a primer. |
|
@snide Hey Dave, yes, this makes perfect sense. We already have this in mind as you can see from here. Basically, we are trying to import the sass variables into the typescript because we rely on At this moment, this may not be thorough in all the places in our codebase, because we just recently adopt this mindset. Along the way, this is definitely the be guideline in terms of styling. @WangQianliang Qianliang, can you try to import and apply those variables as much as you can? Thanks. |
|
Yeah, at least in the files I've seen you're actually using Sass files, so it should just be a one-liner to import the EUI sass scope. I'd be cautious with styled components. We're likely going to move to CSS modules in EUI early next year (mostly at the urging of APM, who wants to move off of styled components) which should solve a lot of the needs people want from CSS in JS, but still provide the sass layer so the styling code can still have some manner of global scoping. I can set something up if you want some background. The variables are only half the battle with EUI (If you're just using the JSON). There are mixins for accessibility, shadows, and all manner of things that get used all through EUI and then get imported and reused in Kibana. Anyways, I know this is all super early so I don't want to slow you all down. Just something to keep in mind. |
|
@snide Good to know the entire context. Thanks, Dave. Will definitely keep this in mind. |
| vertical-align: middle; | ||
| `; | ||
|
|
||
| const FolderOpenTriangle = styled.span` |
There was a problem hiding this comment.
FolderOpenTriangle seem to have a couple of shared properties with FolderClosedTriangle. You can use
const FolderOpenTriangle = styled(FolderClosedTriangle)``
to inherit and override some of them.
💔 Build Failed |
💔 Build Failed |
Summary