Search code examples
htmlcssgetuikit

UIKIT HTMLeditor design not working properly


Hi Guys I followed UIKIT's sample of html editor my problem is that although its working fine but the design is not... It didnt became the same as what on their docs I followed everything but still the navbar's design of the htmleditor is ugly here is my code I dont know if its an issue on the css or javscript because I have included all the dependencies it needs based on their doc

CODE:

    <link rel="stylesheet" href="assets/~uikit/css/uikit.min.css">
<link id="data-uikit-theme" rel="stylesheet" href="assets/~uikit/css/uikit.docs.min.css">
<link href="assets/css/docs.css" rel="stylesheet">
<link rel="stylesheet" href="assets/~uikit/css/uikit.addons.min.css">
<link rel="stylesheet" href="plugins/codemirror/lib/codemirror.css">
<body>


<div style="margin-top:100px;" class="uk-container uk-container-center">
<textarea data-uk-htmleditor="{mode:'tab'}">...</textarea>
</div>
</body>

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script  src="assets/~uikit/js/uikit.min.js"></script>
<script  src="plugins/codemirror/lib/codemirror.js"></script>
<script  src="plugins/codemirror/mode/markdown/markdown.js"></script>
<script  src="plugins/codemirror/addon/mode/overlay.js"></script>
<script  src="plugins/codemirror/mode/xml/xml.js"></script>
<script  src="plugins/codemirror/mode/gfm/gfm.js"></script>
<script  src="plugins/marked/lib/marked.js"></script>

<script  src="assets/~uikit/js/addons/htmleditor.min.js"></script>

could someone please have a look at my code I cant seem to find whats missing or whats wrong


Solution

  • Same problem here, it seems that htmleditor.less is not compiled, I downloaded Uikit docs CSS and now it's working fine. I will take a look and see why it's not compiled.

    http://getuikit.com/docs/css/uikit.docs.min.css

    Cheers