Jane Doe just sent you a new message.
Download ready-to-use compiled code for Halfmoon v1.1.0, which includes the following:
Once you have downloaded the files, all you have to do is include the following files in your project:
<!-- Halfmoon CSS --> <link href="path/to/halfmoon-variables.min.css" rel="stylesheet" /> <!-- Or, Use the following (no variables, supports IE11): <link href="path/to/halfmoon.min.css" rel="stylesheet" /> --> <!-- Halfmoon JS --> <script src="path/to/halfmoon.min.js"></script>
Pleast note, the JS file should be placed at the end of the <body> tag. Otherwise, some things may not work as expected. For example, using the onclick="..." event to call one of Halfmoon's built-in methods will not work unless the JS file is placed at the end of the <body> tag.
As for the CSS file, it can be placed inside the <head> tag, which is the usual convention in most projects.
You can also include the required files using a CDN:
<!-- Halfmoon CSS --> <link href="https://firstname.lastname@example.org/css/halfmoon-variables.min.css" rel="stylesheet" /> <!-- Or, Use the following (no variables, supports IE11): <link href="https://email@example.com/css/halfmoon.min.css" rel="stylesheet" /> --> <!-- Halfmoon JS --> <script src="https://firstname.lastname@example.org/js/halfmoon.min.js"></script>
npm install halfmoon
After installation, the required CSS and JS file can be imported in the following way:
// Include CSS file require("halfmoon/css/halfmoon-variables.min.css"); /* Or, Include the following (no variables, supports IE11): require("halfmoon/css/halfmoon.min.css"); */ // Import JS library const halfmoon = require("halfmoon");
Please note that manual initialization is required for some components, that is, after the DOM is loaded, the following method needs to be called:
// Call this method after the DOM has been loaded halfmoon.onDOMContentLoaded();
In this way, Halfmoon can be used with frameworks that use the virtual DOM, such as React and Vue. For instance, in the case of Vue, the halfmoon.onDOMContentLoaded() method would be called inside the mounted() hook of your component.
Once you have downloaded Halfmoon, you can check out the customize section of the docs, which is a guide for understanding customization with CSS variables.
If you are not interested in that, you can check out the page building section of the docs, which breaks down the basics of building pages. Otherwise, you can jump right into the starter template generator section, which lets you generate boilerplates for your project.