> On Feb 12, 2020, at 7:16 PM, Alex Harui <[email protected]> wrote: > > I don't understand the problem. Maybe you can create a royale-compiler issue > and put in the current index.html and show what the correct output should be.
If you look at the source here: You’ll see the following lines: <link rel="stylesheet" href="assets/css/components/inputgroup/dist.css"> <link rel="stylesheet" href="assets/css/components/button/dist.css"> <link rel="stylesheet" href="assets/css/components/icon/dist.css"> <link rel="stylesheet" href="assets/css/components/textfield/dist.css"> inputgroup depends on textfield and textfield should be loaded before inputgroup, like so: <link rel="stylesheet" href="assets/css/components/textfield/dist.css"> <link rel="stylesheet" href="assets/css/components/inputgroup/dist.css"> <link rel="stylesheet" href="assets/css/components/button/dist.css"> <link rel="stylesheet" href="assets/css/components/icon/dist.css"> inputgroup is used by ComboBox and friends which also use TextField. https://github.com/unhurdle/spectrum-royale/blob/master/Spectrum/src/com/unhurdle/spectrum/ComboBoxView.as <https://github.com/unhurdle/spectrum-royale/blob/master/Spectrum/src/com/unhurdle/spectrum/ComboBoxView.as> > Besides inject_html, shouldn't you be able to use -html-template and specify > the order in a custom index.html file? Yes, but I’d like to automatically only load the CSS actually required by the components used. > > -Alex > > On 2/12/20, 4:46 AM, "Harbs" <[email protected] > <mailto:[email protected]>> wrote: > > The problem is caused by the fact that we have no mechanism of specifying > CSS dependency order in Royale. > > The design of the CSS makes sense. Requiring a specific order for the CSS > files is a valid strategy. > > NPM (via modules) does have a way to specify CSS order. > > I think this is a general problem which we should try to solve. To me, the > only question is technically what’s the best way to do so. > > Possibly inject_html is the wrong tool (as we’ve already discussed), but > it’s the only one we have as of now. > > I’m not sure how the order of the inject_html is determined. Maybe there > should be some sorting logic which corresponds to dependency trees? > > Maybe the right answer is to have a way to declare file dependencies and > that should include order as well? > > Harbs > >> On Feb 12, 2020, at 1:54 PM, Carlos Rovira <[email protected]> wrote: >> >> Hi Harbs, >> >> if I understand the issue correctly this not seems a Royale issue to me, >> but a problem in Spectrum CSS structure design. >> In Royale, we provide CSSs to the compiler from libraries, and that >> generate just one compiled CSS file. User's project CSS takes precedence >> over framework libraries, so if a user override a style, that wins over the >> royale one. Since load an external CSS is outside the Royale sandbox, I >> think the loaded CSS should solve its problem to not have >> collision problems within them. >> >> >> El mié., 12 feb. 2020 a las 10:04, Harbs (<[email protected]>) escribió: >> >>> I’ve run into an interesting issue while working on the Spectrum >>> components.[1] >>> >>> To quickly summarize: >>> >>> I’m using inject_html to automatically add CSS links to the index.html >>> file. Doing so gives no control over the order of said dependencies. >>> >>> The CSS files are required to be loaded in the declared dependency list >>> (in the npm package). >>> >>> I think we need to resolve this issue somehow and I’m not sure of the best >>> way to go about it. >>> >>> Thoughts? >>> Harbs >>> >>> [1]https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fadobe%2Fspectrum-css%2Fissues%2F481&data=02%7C01%7Caharui%40adobe.com%7C960e746954f94d0f28b308d7afb99ac3%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637171084013748277&sdata=L%2FUfo%2Be20MK2l0spJOqI9ivV%2Bix2McyJ3TG%2BGxZumj8%3D&reserved=0 >>> >>> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fadobe%2Fspectrum-css%2Fissues%2F481&data=02%7C01%7Caharui%40adobe.com%7C960e746954f94d0f28b308d7afb99ac3%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637171084013748277&sdata=L%2FUfo%2Be20MK2l0spJOqI9ivV%2Bix2McyJ3TG%2BGxZumj8%3D&reserved=0> >>> < >>> https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fadobe%2Fspectrum-css%2Fissues%2F481&data=02%7C01%7Caharui%40adobe.com%7C960e746954f94d0f28b308d7afb99ac3%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637171084013758277&sdata=dBPpsHiIFndYWUZdvbVRE09aSpeIEZqZv52u%2FhzIZfg%3D&reserved=0 >>> >>> <https://nam04.safelinks.protection.outlook.com/?url=https%3A%2F%2Fgithub.com%2Fadobe%2Fspectrum-css%2Fissues%2F481&data=02%7C01%7Caharui%40adobe.com%7C960e746954f94d0f28b308d7afb99ac3%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637171084013758277&sdata=dBPpsHiIFndYWUZdvbVRE09aSpeIEZqZv52u%2FhzIZfg%3D&reserved=0>> >> >> >> >> -- >> Carlos Rovira >> https://nam04.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com%7C960e746954f94d0f28b308d7afb99ac3%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637171084013758277&sdata=0dBnnLldOhrfV27lzqLqyQaUyVAhG%2FPTjBb7TUStPCY%3D&reserved=0 >> >> <https://nam04.safelinks.protection.outlook.com/?url=http%3A%2F%2Fabout.me%2Fcarlosrovira&data=02%7C01%7Caharui%40adobe.com%7C960e746954f94d0f28b308d7afb99ac3%7Cfa7b1b5a7b34438794aed2c178decee1%7C0%7C0%7C637171084013758277&sdata=0dBnnLldOhrfV27lzqLqyQaUyVAhG%2FPTjBb7TUStPCY%3D&reserved=0>
