Merge pull request #19 from xtoolkit/v3

Micon css font toolkit V3
xtoolkit · Jan 20, 2019 · 8d34a6f · 8d34a6f
2 parents 06a2d00 + 92255d9
commit 8d34a6f
Show file tree

Hide file tree

Showing 1,918 changed files with 75,605 additions and 49,284 deletions.
diff --git a/.gitignore b/.gitignore
@@ -5,3 +5,5 @@ script_out/*
 [Dd]esktop.ini
 *.DS_store
 .DS_store?
+node_modules/
+script.php
diff --git a/.templates/css/style-min.css b/.templates/css/style-min.css
diff --git a/.templates/css/style.css b/.templates/css/style.css
diff --git a/.templates/html-demo.html → .templates/html-demo.mustache b/.templates/html-demo.html → .templates/html-demo.mustache
@@ -2,10 +2,8 @@
 
 <head>
     <meta charset="utf-8">
-    <title>
-        <%= fontName %>
-    </title>
-    <link href="css/<%= fontName %>.css" rel="stylesheet">
+    <title>{{config.fontName}} - {{config.fontVersion}}</title>
+    <link href="css/{{config.fontName}}.css" rel="stylesheet">
     <style>
         * {
             padding: 0;
@@ -79,15 +77,15 @@
 </head>
 
 <body>
-    <h1><a href="http://xtoolkit.github.io/Micon/"><%= fontName %></a></h1>
+    <h1><a href="http://xtoolkit.github.io/Micon/">{{config.fontName}}</a></h1>
     <ul class="glyphs">
-        <% _.each(glyphs, function(glyph) { %>
-            <li>
-                <span class="glyph"><i class="<%= className %> <%= className %>-<%= glyph.name %>"></i></span>
-                <span class="glyph-codepoint"><%= glyph.codepoint.toString(16).toUpperCase() %></span>
-                <span class="glyph-name"><%= glyph.name %></span>
-            </li>
-            <% }); %>
+      {{#glyphs}}
+        <li>
+            <span class="glyph"><i class="{{config.fontPrefix}} {{config.fontPrefix}}-{{name}}"></i></span>
+            <span class="glyph-codepoint">{{codepoint}}</span>
+            <span class="glyph-name">{{name}}</span>
+        </li>
+      {{/glyphs}}
     </ul>
 </body>
 

diff --git a/.templates/less/_animated.less b/.templates/less/_animated.less
@@ -0,0 +1,20 @@
+// Animated Icons
+// --------------------------
+
+{{=[[ ]]=}}
+.@{[[config.fontPrefix]]-css-prefix}-spin {
+  animation: [[config.fontPrefix]]-spin 2s infinite linear;
+}
+
+.@{[[config.fontPrefix]]-css-prefix}-pulse {
+  animation: [[config.fontPrefix]]-spin 1s infinite steps(8);
+}
+
+@keyframes [[config.fontPrefix]]-spin {
+  0% {
+    transform: rotate(0deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
diff --git a/.templates/less/_bordered-pulled.less b/.templates/less/_bordered-pulled.less
@@ -0,0 +1,17 @@
+// Bordered & Pulled
+// -------------------------
+
+{{=[[ ]]=}}
+.@{[[config.fontPrefix]]-css-prefix}-border {
+  border-radius: .1em;
+  border: solid .08em @[[config.fontPrefix]]-border-color;
+  padding: .2em .25em .15em;
+}
+
+.@{[[config.fontPrefix]]-css-prefix}-pull-left { float: left; }
+.@{[[config.fontPrefix]]-css-prefix}-pull-right { float: right; }
+
+.@{[[config.fontPrefix]]-css-prefix}, .fas, .far, .fal, .fab {
+  &.@{[[config.fontPrefix]]-css-prefix}-pull-left { margin-right: .3em; }
+  &.@{[[config.fontPrefix]]-css-prefix}-pull-right { margin-left: .3em; }
+}
diff --git a/.templates/less/_core.less b/.templates/less/_core.less
@@ -0,0 +1,13 @@
+// Base Class Definition
+// -------------------------
+
+{{=[[ ]]=}}
+.@{[[config.fontPrefix]]-css-prefix} {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  display: inline-block;
+  font-style: normal;
+  font-variant: normal;
+  text-rendering: auto;
+  line-height: 1;
+}
diff --git a/.templates/less/_fixed-width.less b/.templates/less/_fixed-width.less
@@ -0,0 +1,8 @@
+// Fixed Width Icons
+// -------------------------
+
+{{=[[ ]]=}}
+.@{[[config.fontPrefix]]-css-prefix}-fw {
+  text-align: center;
+  width: (20em / 16);
+}
diff --git a/.templates/less/_icons.less b/.templates/less/_icons.less
@@ -0,0 +1,7 @@
+/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
+   readers do not read off random characters that represent icons */
+
+{{=[[ ]]=}}
+[[#glyphs]]
+.@{[[config.fontPrefix]]-css-prefix}-[[name]][[#names]]:before, .@{[[config.fontPrefix]]-css-prefix}-[[.]][[/names]]:before { content: @[[config.fontPrefix]]-var-[[name]]; }
+[[/glyphs]]
diff --git a/.templates/less/_larger.less b/.templates/less/_larger.less
@@ -0,0 +1,28 @@
+// Icon Sizes
+// -------------------------
+
+{{=[[ ]]=}}
+.larger(@factor) when (@factor > 0) {
+  .larger((@factor - 1));
+
+  .@{[[config.fontPrefix]]-css-prefix}-@{factor}x {
+    font-size: (@factor * 1em);
+  }
+}
+
+/* makes the font 33% larger relative to the icon container */
+.@{[[config.fontPrefix]]-css-prefix}-lg {
+  font-size: (4em / 3);
+  line-height: (3em / 4);
+  vertical-align: -.0667em;
+}
+
+.@{[[config.fontPrefix]]-css-prefix}-xs {
+  font-size: .75em;
+}
+
+.@{[[config.fontPrefix]]-css-prefix}-sm {
+  font-size: .875em;
+}
+
+.larger(10);
diff --git a/.templates/less/_list.less b/.templates/less/_list.less
@@ -0,0 +1,19 @@
+// List Icons
+// -------------------------
+
+{{=[[ ]]=}}
+.@{[[config.fontPrefix]]-css-prefix}-ul {
+  list-style-type: none;
+  margin-left: @[[config.fontPrefix]]-li-width * 5/4;
+  padding-left: 0;
+
+  > li { position: relative; }
+}
+
+.@{[[config.fontPrefix]]-css-prefix}-li {
+  left: -@[[config.fontPrefix]]-li-width;
+  position: absolute;
+  text-align: center;
+  width: @[[config.fontPrefix]]-li-width;
+  line-height: inherit;
+}