Lexicon build / release

[Marco Endres, modificado 7 Anos atrás.]

Hey guys

I would like to extend the Lexicon. When i build it and open it i get some errors in the firebug console. All icons and images are missing.
I get these 2 errors:

- NS_ERROR_DOM_BAD_URI: Access to restricted URI denied
- ReferenceError: hljs is not defined

When i try to switch the site, it only opens the folder and not the index.html inside.

My second question is, how do i use the gulp release. Should i first style the Lexicon and then make a release of it and copy the generated files into my theme?

Thank you

[Patrick Yeo, modificado 7 Anos atrás.]

Hey Marco,

Marco Endres:

I would like to extend the Lexicon. When i build it and open it i get some errors in the firebug console. All icons and images are missing.
I get these 2 errors:

- NS_ERROR_DOM_BAD_URI: Access to restricted URI denied
- ReferenceError: hljs is not defined

When i try to switch the site, it only opens the folder and not the index.html inside.

About trying to switch the site, you need to install a local web server that will serve up index.html for you. See https://www.maketecheasier.com/setup-local-web-server-all-platforms/, then you need to set up symbolic links to point to the Lexicon build directory http://www.howtogeek.com/howto/16226/complete-guide-to-symbolic-links-symlinks-on-windows-or-linux/.

Marco Endres:

My second question is, how do i use the gulp release. Should i first style the Lexicon and then make a release of it and copy the generated files into my theme?

You can overwrite Lexicon variables in your theme by adding _aui_variables.scss to the _diffs folder in your theme, just make sure to copy the contents of _aui_variables.scss over from styled. The contents is listed below:

// Icon paths

$FontAwesomePath: "aui/lexicon/fonts/alloy-font-awesome/font";
$font-awesome-path: "aui/lexicon/fonts/alloy-font-awesome/font";
$icon-font-path: "aui/lexicon/fonts/";

If you want to apply some custom css components or other components from a third party bootstrap theme you can add _aui_custom.scss to the _diffs folder in your theme and place whatever css there. You can also put it in _custom.scss if you like.

Things have changed a bit since the readme was written (we need to update it), the release task is only used to update the official version of Lexicon in Liferay Portal. You won’t need to use it to deploy a customized version of Lexicon. Hope this helps.

Patrick

[Marco Endres, modificado 7 Anos atrás.]

Hello Patrick

Thank you for your nice response. It helped me a lot
Would it be possible to automatic generate a Lexicon of the own theme with the changes that is also available on the Liferay portal via url as example?

The idea behind this is that backend-developpers can checkout the theme deploy it and if they need to know which styleClasses they have to use to style a button, they can open the generated Lexicon with the changes.

Marco

[Patrick Yeo, modificado 7 Anos atrás.]

No problem, glad it helped. I don't think I'm fully understanding what you're wanting to accomplish. Do you want to create a site like http://liferay.github.io/lexicon/ where developers can see your theme or something else?

[Marco Endres, modificado 7 Anos atrás.]

yes exactly

[Patrick Yeo, modificado 7 Anos atrás.]

Unfortunately there is no task that will deploy a local version of Lexicon's static pages to GitHub Pages for you. The quickest way to accomplish that is:

1) fork Lexicon
2) make sure origin points to your github repo or use whatever that is instead of origin
3) build the pages (gulp build)
4) git add build && git commit -m "Deploy gh-pages"
5) git push origin :gh-pages (this deletes the gh-pages branch of the remote repo named origin)
6) git subtree push --prefix build origin gh-pages
7) The site should display when you navigate to http://yourusername.github.io/lexicon