Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-07-27 05:24:38 +04:00
Code Issues Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/tabler-v1' into tabler-v1

Browse Source
This commit is contained in:
chomik
2019-06-17 22:13:42 +02:00
parent 6e8e0b1ec2 65173ba1f8
commit 467d39e0d1
7 changed files with 128 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.gitignore
+2
View File
@@ -11,6 +11,8 @@ tmp/
/_site/
/.cache/
.vscode/
/_gh_pages/
/site/docs/**/dist/
/site/static/**/dist/
build/browsersync.js
+3 -4
View File
@@ -10,12 +10,11 @@ bs.init({
'/dist': 'dist',
'/libs': 'static/libs',
'/img': 'static/img',
}
},
},
files: ['tmp/**/*', 'dist/css/*.css', 'dist/js/*.js'],
watchOptions: {
ignoreInitial: true
ignoreInitial: true,
},
notify: false
notify: false,
});
build/generate-font-codepoints.js
+3 -4
View File
@@ -4,18 +4,17 @@ const fs = require('fs'),
path = require('path'),
yaml = require('yaml');
const data = fs.readFileSync(path.resolve(__dirname, '../scss/fonts/_tabler-webfont.scss'), "utf8"),
const data = fs.readFileSync(path.resolve(__dirname, '../scss/fonts/_tabler-webfont.scss'), 'utf8'),
re = /\$icon-([^\-\s]+)-([^:\s]+):\s'([^'\n]+)';/g;
let items = {};
data.replace(re, function (match, g1, g2, g3) {
if(!items[g1]) {
data.replace(re, function(match, g1, g2, g3) {
if (!items[g1]) {
items[g1] = {};
}
items[g1][g2] = g3;
});
fs.writeFileSync('pages/_data/icons.yml', yaml.stringify(items));
build/rollup.config.js
+6 -6
View File
@@ -20,13 +20,13 @@ const plugins = [
'createClass',
'inheritsLoose',
'defineProperty',
'objectSpread'
]
})
'objectSpread',
],
}),
];
const globals = {
'popper.js': 'Popper'
'popper.js': 'Popper',
};
if (BUNDLE) {
@@ -43,10 +43,10 @@ const rollupConfig = {
banner,
file: path.resolve(__dirname, `../dist/js/${fileDest}.js`),
format: ESM ? 'esm' : 'umd',
globals
globals,
},
external,
plugins
plugins,
};
if (!ESM) {
js/app/charts.js
+50 -55
View File
@@ -1,52 +1,47 @@
(function ($) {
$(document).ready(function () {
(function($) {
$(document).ready(function() {
$().peity &&
$('[data-spark]').each(function() {
const $this = $(this),
data = $this.attr('data-spark'),
color = $this.attr('data-spark-color') || 'blue',
type = $this.attr('data-spark-type') || 'line';
$().peity && $('[data-spark]').each(function () {
const $this = $(this),
data = $this.attr('data-spark'),
color = $this.attr('data-spark-color') || 'blue',
type = $this.attr('data-spark-type') || 'line';
const $div = $('<div />').html(data);
$this.append($div);
const $div = $('<div />').html(data);
$this.append($div);
let strokeColor = tabler.colors[color],
fillColor = tabler.colors[color];
let strokeColor = tabler.colors[color],
fillColor = tabler.colors[color];
if (type === 'donut' || type === 'pie') {
fillColor = [fillColor, tabler.hexToRgbA(fillColor, 0.1)];
} else if (type === 'bar') {
fillColor = [fillColor];
} else if (type === 'line') {
fillColor = tabler.hexToRgbA(fillColor, 0.1);
}
if (type === 'donut' || type === 'pie') {
fillColor = [fillColor, tabler.hexToRgbA(fillColor, .1)];
} else if (type === 'bar') {
fillColor = [fillColor];
} else if (type === 'line') {
fillColor = tabler.hexToRgbA(fillColor, .1);
}
$div.peity(type, {
width: $this.width(),
height: $this.height(),
// max: 100,
// min: 0,
stroke: strokeColor,
strokeWidth: 2,
fill: fillColor,
padding: .2,
innerRadius: (type === 'donut') ? 17 : 0
$div.peity(type, {
width: $this.width(),
height: $this.height(),
// max: 100,
// min: 0,
stroke: strokeColor,
strokeWidth: 2,
fill: fillColor,
padding: 0.2,
innerRadius: type === 'donut' ? 17 : 0,
});
});
});
});
})(jQuery);
/*
charts default configuration
*/
if (window.Apex) {
var borderColor = 'rgba(0, 0, 0, 0.09)';
var mutedColor = '#888e9a';
const borderColor = 'rgba(0, 0, 0, 0.09)';
const mutedColor = '#888e9a';
window.Apex = {
chart: {
@@ -56,11 +51,11 @@ if (window.Apex) {
show: false,
},
zoom: {
enabled: false
enabled: false,
},
animations: {
enabled: false,
}
},
},
grid: {
@@ -71,8 +66,8 @@ if (window.Apex) {
right: 0,
left: 0,
bottom: 0,
top: 0
}
top: 0,
},
},
dataLabels: {
@@ -102,7 +97,7 @@ if (window.Apex) {
fill: {
type: 'solid',
opacity: 1
opacity: 1,
},
markers: {
@@ -111,7 +106,7 @@ if (window.Apex) {
radius: 2,
hover: {
size: 4,
}
},
},
legend: {
@@ -119,11 +114,11 @@ if (window.Apex) {
fontSize: '14px',
markers: {
width: 8,
height: 8
height: 8,
},
itemMargin: {
horizontal: 0,
vertical: 8
vertical: 8,
},
},
@@ -131,7 +126,7 @@ if (window.Apex) {
margin: 0,
style: {
fontSize: '14px',
}
},
},
subtitle: {
@@ -139,7 +134,7 @@ if (window.Apex) {
},
tooltip: {
fillSeriesColor: false
fillSeriesColor: false,
},
xaxis: {
@@ -147,27 +142,27 @@ if (window.Apex) {
style: {
colors: mutedColor,
fontSize: '12px',
}
},
},
tooltip: {
enabled: false
enabled: false,
},
axisBorder: {
color: borderColor,
height: 0
height: 0,
},
axisTicks: {
show: true,
height: 4,
color: borderColor
}
color: borderColor,
},
},
yaxis: {
show: false,
labels: {
show: false
}
}
show: false,
},
},
};
}
js/tabler.js
+34 -34
View File
@@ -1,21 +1,21 @@
const tabler = {
colorVariation: function (color, variation) {
colorVariation: function(color, variation) {
const colorValue = this.colors[color];
if (colorValue) {
switch (variation) {
case 'light':
return this.mixColors(colorValue, '#ffffff', 70);
case 'lighten':
return this.mixColors(colorValue, '#ffffff', 30);
case 'lightest':
return this.mixColors(colorValue, '#ffffff', 10);
case 'dark':
return this.mixColors(colorValue, '#000000', 80);
case 'darken':
return this.mixColors(colorValue, '#000000', 40);
case 'darkest':
return this.mixColors(colorValue, '#000000', 20);
case 'light':
return this.mixColors(colorValue, '#ffffff', 70);
case 'lighten':
return this.mixColors(colorValue, '#ffffff', 30);
case 'lightest':
return this.mixColors(colorValue, '#ffffff', 10);
case 'dark':
return this.mixColors(colorValue, '#000000', 80);
case 'darken':
return this.mixColors(colorValue, '#000000', 40);
case 'darkest':
return this.mixColors(colorValue, '#000000', 20);
}
return colorValue;
@@ -24,7 +24,7 @@ const tabler = {
throw new Error('Wrong color: ' + color);
},
hexToRgbA: function (hex, opacity) {
hexToRgbA: function(hex, opacity) {
let c;
opacity = opacity || 1;
@@ -40,7 +40,7 @@ const tabler = {
throw new Error('Bad Hex');
},
mixColors: function (color_1, color_2, weight) {
mixColors: function(color_1, color_2, weight) {
color_1 = color_1.substr(1);
color_2 = color_2.substr(1);
@@ -52,7 +52,7 @@ const tabler = {
return parseInt(h, 16);
}
weight = (typeof(weight) !== 'undefined') ? weight : 50;
weight = typeof weight !== 'undefined' ? weight : 50;
let color = '#';
@@ -72,10 +72,14 @@ const tabler = {
return color;
},
toggleFullscreen: function (elem) {
toggleFullscreen: function(elem) {
elem = elem || document.documentElement;
if (!document.fullscreenElement && !document.mozFullScreenElement &&
!document.webkitFullscreenElement && !document.msFullscreenElement) {
if (
!document.fullscreenElement &&
!document.mozFullScreenElement &&
!document.webkitFullscreenElement &&
!document.msFullscreenElement
) {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.msRequestFullscreen) {
@@ -96,14 +100,13 @@ const tabler = {
document.webkitExitFullscreen();
}
}
}
},
};
$(document).ready(function () {
$(document).ready(function() {
const $body = $('body');
$body.on('click', '[data-toggle="sidebar"]', function (e) {
$body.on('click', '[data-toggle="sidebar"]', function(e) {
$body.toggleClass('sidebar-opened');
e.preventDefault();
@@ -113,37 +116,34 @@ $(document).ready(function () {
$('[data-toggle="tooltip"]').tooltip();
$('[data-toggle="popover"]').popover();
/*
Autosize plugin
*/
if(window.autosize) {
if (window.autosize) {
(function() {
var $elem = $('[data-toggle="autosize"]');
const $elem = $('[data-toggle="autosize"]');
if ($elem) {
$elem.each(function() {
autosize($(this));
});
}
})();
}
/*
Imask plugin
*/
if(window.IMask) {
if (window.IMask) {
(function() {
var $elem = $('[data-mask]');
const $elem = $('[data-mask]');
if ($elem) {
$elem.each(function() {
IMask($(this).get(0), {
mask: $(this).attr('data-mask'),
lazy: $(this).attr('data-mask-visible') === 'true'
})
lazy: $(this).attr('data-mask-visible') === 'true',
});
});
}
})();
@@ -152,8 +152,8 @@ $(document).ready(function () {
/**
* Seelectize plugin
*/
if(jQuery && jQuery().selectize) {
var $elem = $('[data-selectize]');
if (jQuery && jQuery().selectize) {
const $elem = $('[data-selectize]');
if ($elem) {
$elem.selectize();
package.json
+30 -3
View File
@@ -4,22 +4,23 @@
"description": "Premium and Open Source dashboard template with responsive and high quality UI.",
"scripts": {
"start": "npm-run-all --parallel browsersync watch html-watch",
"build": "npm-run-all lint html-build css-compile js-compile",
"build": "npm-run-all html-build css js",
"bundlesize": "bundlesize",
"browsersync": "node build/browsersync.js",
"html-watch": "JEKYLL_ENV=development bundle exec jekyll build --watch",
"html-build": "JEKYLL_ENV=production bundle exec jekyll build",
"lint": "npm-run-all --parallel js-lint css-lint",
"css": "npm-run-all css-compile css-prefix css-minify",
"css-compile": "node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/tabler.scss dist/css/tabler.css",
"css-prefix": "postcss --config build/postcss.config.js --replace \"dist/css/*.css\" \"!dist/css/*.min.css\"",
"css-minify": "cleancss --level 1 --format breakWith=lf --source-map --source-map-inline-sources --output dist/css/tabler.min.css dist/css/tabler.css",
"css-copy": "cross-env-shell shx mkdir -p site/static/dist/ && cross-env-shell shx cp -r dist/css/ site/static/dist/",
"css-lint": "stylelint \"scss/**/*.scss\" --cache --cache-location .cache/.stylelintcache",
"css-main": "npm-run-all css-compile css-prefix",
"css-main-build": "npm-run-all css-lint css-compile css-prefix css-minify",
"watch": "npm-run-all --parallel watch-*",
"watch-css": "nodemon --watch scss/ --ext scss --exec \"npm run css-main\"",
"watch-js": "nodemon --watch js/ --ext js --exec \"npm run js-compile-standalone\"",
"js": "npm-run-all js-compile js-minify",
"js-lint": "eslint --cache --cache-location .cache/.eslintcache js build/",
"js-compile": "npm-run-all --parallel js-compile-* --sequential js-minify",
"js-compile-standalone": "rollup --environment BUNDLE:false --config build/rollup.config.js --sourcemap",
@@ -81,5 +82,31 @@
"bootstrap": "twbs/bootstrap#41fcd13",
"imask": "5.1.5",
"selectize": "0.12.6"
}
},
"bundlesize": [
{
"path": "./dist/css/tabler.css",
"maxSize": "50 kB"
},
{
"path": "./dist/css/tabler.min.css",
"maxSize": "45 kB"
},
{
"path": "./dist/js/tabler.js",
"maxSize": "2 kB"
},
{
"path": "./dist/js/tabler.min.js",
"maxSize": "1.5 kB"
},
{
"path": "./dist/js/tabler.bundle.js",
"maxSize": "1.5 kB"
},
{
"path": "./dist/js/tabler.bundle.min.js",
"maxSize": "1.1 kB"
}
]
}