CRUD chart theme

public/dist/scripts/app-all.js

@@ -2498,7 +2498,7 @@ if(target){target=document.getElementById(target);}
 button.addEventListener("click",function(){var clone=document.createElement(element.tagName);if(element.name){clone.name=element.name;}
 clone.innerHTML=template;clone.className=element.className;var input=clone.querySelector("input, select, textarea");view.render(clone);if(target){target.appendChild(clone);}else{button.parentNode.insertBefore(clone,button);}
 if(input){input.focus();}
-Array.prototype.slice.call(clone.querySelectorAll("[data-remove]")).map(function(obj){obj.addEventListener("click",function(){clone.parentNode.removeChild(clone);obj.scrollIntoView({behavior:"smooth"});});});Array.prototype.slice.call(clone.querySelectorAll("[data-up]")).map(function(obj){obj.addEventListener("click",function(){if(clone.previousElementSibling){clone.parentNode.insertBefore(clone,clone.previousElementSibling);obj.scrollIntoView({behavior:"smooth"});}});});Array.prototype.slice.call(clone.querySelectorAll("[data-down]")).map(function(obj){obj.addEventListener("click",function(){if(clone.nextElementSibling){clone.parentNode.insertBefore(clone.nextElementSibling,clone);obj.scrollIntoView({behavior:"smooth"});}});});});element.parentNode.insertBefore(button,element.nextSibling);element.parentNode.removeChild(element);button.form.addEventListener('reset',function(event){target.innerHTML='';if(first){button.click();}});if(first){button.click();}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-add",repeat:false,controller:function(element,view,container,document){for(var i=0;i<element.children.length;i++){let button=document.createElement("button");let template=element.children[i].cloneNode(true);let as=element.getAttribute('data-ls-as');let counter=0;button.type="button";button.innerText="Add";button.classList.add("reverse");button.classList.add("margin-end-small");button.addEventListener('click',function(){container.addNamespace(as,'new-'+counter++);console.log(container.namespaces,container.get(as),as);container.set(as,null,true,true);let child=template.cloneNode(true);view.render(child);element.appendChild(child);element.style.visibility='visible';let inputs=child.querySelectorAll('input,textarea');for(let index=0;index<inputs.length;++index){if(inputs[index].type!=='hidden'){inputs[index].focus();break;}}});element.after(button);}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-chart",controller:function(element,container,date,document){let wrapper=document.createElement("div");let child=document.createElement("canvas");let sources=element.getAttribute('data-forms-chart');let width=element.getAttribute('data-width')||500;let height=element.getAttribute('data-height')||175;let colors=(element.getAttribute('data-colors')||'blue,green,orange,red').split(',');let themes={'blue':'#29b5d9','green':'#4eb55b','orange':'#fba233','red':'#dc3232',};let range={'24h':'H:i','7d':'d F Y','30d':'d F Y','90d':'d F Y'}
+Array.prototype.slice.call(clone.querySelectorAll("[data-remove]")).map(function(obj){obj.addEventListener("click",function(){clone.parentNode.removeChild(clone);obj.scrollIntoView({behavior:"smooth"});});});Array.prototype.slice.call(clone.querySelectorAll("[data-up]")).map(function(obj){obj.addEventListener("click",function(){if(clone.previousElementSibling){clone.parentNode.insertBefore(clone,clone.previousElementSibling);obj.scrollIntoView({behavior:"smooth"});}});});Array.prototype.slice.call(clone.querySelectorAll("[data-down]")).map(function(obj){obj.addEventListener("click",function(){if(clone.nextElementSibling){clone.parentNode.insertBefore(clone.nextElementSibling,clone);obj.scrollIntoView({behavior:"smooth"});}});});});element.parentNode.insertBefore(button,element.nextSibling);element.parentNode.removeChild(element);button.form.addEventListener('reset',function(event){target.innerHTML='';if(first){button.click();}});if(first){button.click();}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-add",repeat:false,controller:function(element,view,container,document){for(var i=0;i<element.children.length;i++){let button=document.createElement("button");let template=element.children[i].cloneNode(true);let as=element.getAttribute('data-ls-as');let counter=0;button.type="button";button.innerText="Add";button.classList.add("reverse");button.classList.add("margin-end-small");button.addEventListener('click',function(){container.addNamespace(as,'new-'+counter++);console.log(container.namespaces,container.get(as),as);container.set(as,null,true,true);let child=template.cloneNode(true);view.render(child);element.appendChild(child);element.style.visibility='visible';let inputs=child.querySelectorAll('input,textarea');for(let index=0;index<inputs.length;++index){if(inputs[index].type!=='hidden'){inputs[index].focus();break;}}});element.after(button);}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-chart",controller:function(element,container,date,document){let wrapper=document.createElement("div");let child=document.createElement("canvas");let sources=element.getAttribute('data-forms-chart');let width=element.getAttribute('data-width')||500;let height=element.getAttribute('data-height')||175;let colors=(element.getAttribute('data-colors')||'blue,green,orange,red').split(',');let themes={'blue':'#29b5d9','green':'#4eb55b','orange':'#fba233','red':'#dc3232','create':'#00b680','read':'#009cde','update':'#696fd7','delete':'#da5d95',};let range={'24h':'H:i','7d':'d F Y','30d':'d F Y','90d':'d F Y'}
 element.parentNode.insertBefore(wrapper,element.nextSibling);wrapper.classList.add('content');child.width=width;child.height=height;sources=sources.split(',');wrapper.appendChild(child);let chart=null;let check=function(){let config={type:"line",data:{labels:[],datasets:[]},options:{responsive:true,title:{display:false,text:"Stats"},legend:{display:false},tooltips:{mode:"index",intersect:false,caretPadding:0},hover:{mode:"nearest",intersect:true},scales:{xAxes:[{display:false}],yAxes:[{display:false}]}}};for(let i=0;i<sources.length;i++){let label=sources[i].substring(0,sources[i].indexOf('='));let path=sources[i].substring(sources[i].indexOf('=')+1);let usage=container.get('usage');let data=usage[path];let value=JSON.parse(element.value);config.data.labels[i]=label;config.data.datasets[i]={};config.data.datasets[i].label=label;config.data.datasets[i].borderColor=themes[colors[i]];config.data.datasets[i].backgroundColor=themes[colors[i]]+'36';config.data.datasets[i].borderWidth=2;config.data.datasets[i].data=[0,0,0,0,0,0,0];config.data.datasets[i].fill=true;if(!data){return;}
 let dateFormat=(value.range&&range[value.range])?range[value.range]:'d F Y';for(let x=0;x<data.length;x++){config.data.datasets[i].data[x]=data[x].value;config.data.labels[x]=date.format(dateFormat,data[x].date);}}
 if(chart){chart.destroy();}

public/dist/scripts/app.js

@@ -373,7 +373,7 @@ if(target){target=document.getElementById(target);}
 button.addEventListener("click",function(){var clone=document.createElement(element.tagName);if(element.name){clone.name=element.name;}
 clone.innerHTML=template;clone.className=element.className;var input=clone.querySelector("input, select, textarea");view.render(clone);if(target){target.appendChild(clone);}else{button.parentNode.insertBefore(clone,button);}
 if(input){input.focus();}
-Array.prototype.slice.call(clone.querySelectorAll("[data-remove]")).map(function(obj){obj.addEventListener("click",function(){clone.parentNode.removeChild(clone);obj.scrollIntoView({behavior:"smooth"});});});Array.prototype.slice.call(clone.querySelectorAll("[data-up]")).map(function(obj){obj.addEventListener("click",function(){if(clone.previousElementSibling){clone.parentNode.insertBefore(clone,clone.previousElementSibling);obj.scrollIntoView({behavior:"smooth"});}});});Array.prototype.slice.call(clone.querySelectorAll("[data-down]")).map(function(obj){obj.addEventListener("click",function(){if(clone.nextElementSibling){clone.parentNode.insertBefore(clone.nextElementSibling,clone);obj.scrollIntoView({behavior:"smooth"});}});});});element.parentNode.insertBefore(button,element.nextSibling);element.parentNode.removeChild(element);button.form.addEventListener('reset',function(event){target.innerHTML='';if(first){button.click();}});if(first){button.click();}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-add",repeat:false,controller:function(element,view,container,document){for(var i=0;i<element.children.length;i++){let button=document.createElement("button");let template=element.children[i].cloneNode(true);let as=element.getAttribute('data-ls-as');let counter=0;button.type="button";button.innerText="Add";button.classList.add("reverse");button.classList.add("margin-end-small");button.addEventListener('click',function(){container.addNamespace(as,'new-'+counter++);console.log(container.namespaces,container.get(as),as);container.set(as,null,true,true);let child=template.cloneNode(true);view.render(child);element.appendChild(child);element.style.visibility='visible';let inputs=child.querySelectorAll('input,textarea');for(let index=0;index<inputs.length;++index){if(inputs[index].type!=='hidden'){inputs[index].focus();break;}}});element.after(button);}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-chart",controller:function(element,container,date,document){let wrapper=document.createElement("div");let child=document.createElement("canvas");let sources=element.getAttribute('data-forms-chart');let width=element.getAttribute('data-width')||500;let height=element.getAttribute('data-height')||175;let colors=(element.getAttribute('data-colors')||'blue,green,orange,red').split(',');let themes={'blue':'#29b5d9','green':'#4eb55b','orange':'#fba233','red':'#dc3232',};let range={'24h':'H:i','7d':'d F Y','30d':'d F Y','90d':'d F Y'}
+Array.prototype.slice.call(clone.querySelectorAll("[data-remove]")).map(function(obj){obj.addEventListener("click",function(){clone.parentNode.removeChild(clone);obj.scrollIntoView({behavior:"smooth"});});});Array.prototype.slice.call(clone.querySelectorAll("[data-up]")).map(function(obj){obj.addEventListener("click",function(){if(clone.previousElementSibling){clone.parentNode.insertBefore(clone,clone.previousElementSibling);obj.scrollIntoView({behavior:"smooth"});}});});Array.prototype.slice.call(clone.querySelectorAll("[data-down]")).map(function(obj){obj.addEventListener("click",function(){if(clone.nextElementSibling){clone.parentNode.insertBefore(clone.nextElementSibling,clone);obj.scrollIntoView({behavior:"smooth"});}});});});element.parentNode.insertBefore(button,element.nextSibling);element.parentNode.removeChild(element);button.form.addEventListener('reset',function(event){target.innerHTML='';if(first){button.click();}});if(first){button.click();}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-add",repeat:false,controller:function(element,view,container,document){for(var i=0;i<element.children.length;i++){let button=document.createElement("button");let template=element.children[i].cloneNode(true);let as=element.getAttribute('data-ls-as');let counter=0;button.type="button";button.innerText="Add";button.classList.add("reverse");button.classList.add("margin-end-small");button.addEventListener('click',function(){container.addNamespace(as,'new-'+counter++);console.log(container.namespaces,container.get(as),as);container.set(as,null,true,true);let child=template.cloneNode(true);view.render(child);element.appendChild(child);element.style.visibility='visible';let inputs=child.querySelectorAll('input,textarea');for(let index=0;index<inputs.length;++index){if(inputs[index].type!=='hidden'){inputs[index].focus();break;}}});element.after(button);}}});})(window);(function(window){"use strict";window.ls.container.get("view").add({selector:"data-forms-chart",controller:function(element,container,date,document){let wrapper=document.createElement("div");let child=document.createElement("canvas");let sources=element.getAttribute('data-forms-chart');let width=element.getAttribute('data-width')||500;let height=element.getAttribute('data-height')||175;let colors=(element.getAttribute('data-colors')||'blue,green,orange,red').split(',');let themes={'blue':'#29b5d9','green':'#4eb55b','orange':'#fba233','red':'#dc3232','create':'#00b680','read':'#009cde','update':'#696fd7','delete':'#da5d95',};let range={'24h':'H:i','7d':'d F Y','30d':'d F Y','90d':'d F Y'}
 element.parentNode.insertBefore(wrapper,element.nextSibling);wrapper.classList.add('content');child.width=width;child.height=height;sources=sources.split(',');wrapper.appendChild(child);let chart=null;let check=function(){let config={type:"line",data:{labels:[],datasets:[]},options:{responsive:true,title:{display:false,text:"Stats"},legend:{display:false},tooltips:{mode:"index",intersect:false,caretPadding:0},hover:{mode:"nearest",intersect:true},scales:{xAxes:[{display:false}],yAxes:[{display:false}]}}};for(let i=0;i<sources.length;i++){let label=sources[i].substring(0,sources[i].indexOf('='));let path=sources[i].substring(sources[i].indexOf('=')+1);let usage=container.get('usage');let data=usage[path];let value=JSON.parse(element.value);config.data.labels[i]=label;config.data.datasets[i]={};config.data.datasets[i].label=label;config.data.datasets[i].borderColor=themes[colors[i]];config.data.datasets[i].backgroundColor=themes[colors[i]]+'36';config.data.datasets[i].borderWidth=2;config.data.datasets[i].data=[0,0,0,0,0,0,0];config.data.datasets[i].fill=true;if(!data){return;}
 let dateFormat=(value.range&&range[value.range])?range[value.range]:'d F Y';for(let x=0;x<data.length;x++){config.data.datasets[i].data[x]=data[x].value;config.data.labels[x]=date.format(dateFormat,data[x].date);}}
 if(chart){chart.destroy();}

public/dist/styles/default-ltr.css

@@ -1 +1 @@
-.pull-start{float:left}.pull-end{float:right}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#8f8f8f;--config-color-fade-dark:#6e6e6e;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#fffbdd;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#d4f0f7;--config-border-color:#f3f3f3;--config-border-fade:#e0e3e4;--config-border-fade-super:#f7f7f7;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-web:#fff054;--config-language-web-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-yaml:#ca3333;--config-language-yaml-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#ffffff;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#ffffff;--config-language-flutter:#035698;--config-language-flutter-contrast:#ffffff;--config-language-android:#a4c439;--config-language-android-contrast:#ffffff;--config-language-kotlin:#766DB2;--config-language-kotlin-contrast:#ffffff;--config-language-swift:#f2624c;--config-language-swift-contrast:#ffffff;--config-language-java:#0074bd;--config-language-java-contrast:#ffffff;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-dark:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-dark:#81859b;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#c7d8eb;--config-border-color:#262D50;--config-border-fade:#19203a;--config-border-fade-super:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#171e33;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--configLine truncated
+.pull-start{float:left}.pull-end{float:right}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#8f8f8f;--config-color-fade-dark:#6e6e6e;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#fffbdd;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#d4f0f7;--config-border-color:#f3f3f3;--config-border-fade:#e0e3e4;--config-border-fade-super:#f7f7f7;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-web:#fff054;--config-language-web-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-yaml:#ca3333;--config-language-yaml-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#ffffff;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#ffffff;--config-language-flutter:#035698;--config-language-flutter-contrast:#ffffff;--config-language-android:#a4c439;--config-language-android-contrast:#ffffff;--config-language-kotlin:#766DB2;--config-language-kotlin-contrast:#ffffff;--config-language-swift:#f2624c;--config-language-swift-contrast:#ffffff;--config-language-java:#0074bd;--config-language-java-contrast:#ffffff;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-dark:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-dark:#81859b;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#c7d8eb;--config-border-color:#262D50;--config-border-fade:#19203a;--config-border-fade-super:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#171e33;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--configLine truncated

public/dist/styles/default-rtl.css

@@ -1 +1 @@
-.pull-start{float:right}.pull-end{float:left}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#8f8f8f;--config-color-fade-dark:#6e6e6e;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#fffbdd;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#d4f0f7;--config-border-color:#f3f3f3;--config-border-fade:#e0e3e4;--config-border-fade-super:#f7f7f7;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-web:#fff054;--config-language-web-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-yaml:#ca3333;--config-language-yaml-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#ffffff;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#ffffff;--config-language-flutter:#035698;--config-language-flutter-contrast:#ffffff;--config-language-android:#a4c439;--config-language-android-contrast:#ffffff;--config-language-kotlin:#766DB2;--config-language-kotlin-contrast:#ffffff;--config-language-swift:#f2624c;--config-language-swift-contrast:#ffffff;--config-language-java:#0074bd;--config-language-java-contrast:#ffffff;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-dark:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-dark:#81859b;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#c7d8eb;--config-border-color:#262D50;--config-border-fade:#19203a;--config-border-fade-super:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#171e33;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--configLine truncated
+.pull-start{float:right}.pull-end{float:left}img[src=""]{visibility:hidden;display:inline-block}:root{--config-width:910px;--config-width-xxl:1000px;--config-width-xl:910px;--config-width-large:700px;--config-width-medium:550px;--config-width-small:320px;--config-color-link:#1e849e;--config-color-background:#eceff1;--config-color-background-dark:#dfe2e4;--config-color-background-fade:#ffffff;--config-color-background-fade-super:#fdfdfd;--config-color-background-focus:#f5f5f5;--config-color-background-input:#ffffff;--config-color-placeholder:#868686;--config-color-tooltip-text:#dce8f5;--config-color-tooltip-background:#333333;--config-color-focus:#f02e65;--config-color-focus-fade:#fef8fa;--config-color-focus-hover:#ff729b;--config-color-focus-glow:#fce5ec;--config-color-focus-dark:#c52653;--config-color-normal:#40404c;--config-color-dark:#313131;--config-color-fade:#8f8f8f;--config-color-fade-dark:#6e6e6e;--config-color-fade-light:#e2e2e2;--config-color-fade-super:#f1f3f5;--config-color-danger:#f53d3d;--config-color-success:#1bbf61;--config-color-warning:#fffbdd;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#d4f0f7;--config-border-color:#f3f3f3;--config-border-fade:#e0e3e4;--config-border-fade-super:#f7f7f7;--config-border-radius:10px;--config-prism-background:#373738;--config-prism-numbers:#39393c;--config-note-background:#f1fbff;--config-note-border:#5bceff;--config-warning-background:#fdf7d9;--config-warning-border:#f8e380;--config-social-twitter:#1da1f2;--config-social-github:#000000;--config-social-discord:#7189dc;--config-social-facebook:#4070b4;--config-language-bash:#2b2626;--config-language-bash-contrast:#fff;--config-language-javascript:#fff054;--config-language-javascript-contrast:#333232;--config-language-web:#fff054;--config-language-web-contrast:#333232;--config-language-html:#ff895b;--config-language-html-contrast:#ffffff;--config-language-yaml:#ca3333;--config-language-yaml-contrast:#ffffff;--config-language-php:#6182bb;--config-language-php-contrast:#ffffff;--config-language-nodejs:#8cc500;--config-language-nodejs-contrast:#ffffff;--config-language-ruby:#fc3f48;--config-language-ruby-contrast:#ffffff;--config-language-python:#3873a2;--config-language-python-contrast:#ffffff;--config-language-go:#00add8;--config-language-go-contrast:#ffffff;--config-language-dart:#035698;--config-language-dart-contrast:#ffffff;--config-language-flutter:#035698;--config-language-flutter-contrast:#ffffff;--config-language-android:#a4c439;--config-language-android-contrast:#ffffff;--config-language-kotlin:#766DB2;--config-language-kotlin-contrast:#ffffff;--config-language-swift:#f2624c;--config-language-swift-contrast:#ffffff;--config-language-java:#0074bd;--config-language-java-contrast:#ffffff;--config-modal-note-background:#f5fbff;--config-modal-note-border:#eaf2f7;--config-modal-note-color:#3b5d73;--config-switch-background:#e2e2e2;--config-console-background:#eceff1;--config-console-nav-start:#143650;--config-console-nav-end:#302839;--config-console-nav-border:#2a253a;--config-console-nav-switch-background:#ececec;--config-console-nav-switch-color:#868686;--config-console-nav-switch-arrow:url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24'><path fill='%23868686' d='M7.406 7.828l4.594 4.594 4.594-4.594 1.406 1.406-6 6-6-6z'></path></svg>")}:root .theme-dark{--config-color-background:#061F2F;--config-color-background-dark:#262d50;--config-color-background-fade:#1c223a;--config-color-background-fade-super:#1a1f35;--config-color-background-focus:#1a1f35;--config-color-background-input:#dce8f5;--config-color-tooltip-text:#061F2F;--config-color-tooltip-background:#dce8f5;--config-color-link:#4caedb;--config-color-placeholder:#9ea1af;--config-color-focus:#c7d8eb;--config-color-focus-fade:#1e233e;--config-color-focus-hover:#d3deea;--config-color-focus-glow:#d3deea;--config-color-focus-dark:#657586;--config-color-normal:#c7d8eb;--config-color-dark:#c7d8eb;--config-color-fade:#bec3e0;--config-color-fade-dark:#81859b;--config-color-fade-light:#181818;--config-color-fade-super:#262D50;--config-color-danger:#d84a4a;--config-color-success:#34b86d;--config-color-warning:#e0d56d;--config-color-info:#386fd2;--config-color-chart:#29b5d9;--config-color-chart-fade:#c7d8eb;--config-border-color:#262D50;--config-border-fade:#19203a;--config-border-fade-super:#262D50;--config-prism-background:#1F253F;--config-prism-numbers:#1F253F;--config-note-background:#171e33;--config-note-border:#262D50;--config-warning-background:#1F253F;--config-warning-border:#262D50;--config-social-twitter:var(--config-color-normal);--config-social-github:var(--config-color-normal);--config-social-discord:var(--config-color-normal);--config-social-facebook:var(--config-color-normal);--config-language-bash:var(--config-color-normal);--config-language-bash-contrast:var(--config-color-background);--configLine truncated

public/scripts/views/forms/chart.js

@@ -10,7 +10,7 @@
       let width = element.getAttribute('data-width') || 500;
       let height = element.getAttribute('data-height') || 175;
       let colors = (element.getAttribute('data-colors') || 'blue,green,orange,red').split(',');
-      let themes = {'blue': '#29b5d9', 'green': '#4eb55b', 'orange': '#fba233', 'red': '#dc3232',};
+      let themes = {'blue': '#29b5d9', 'green': '#4eb55b', 'orange': '#fba233', 'red': '#dc3232', 'create': '#00b680', 'read': '#009cde', 'update': '#696fd7', 'delete': '#da5d95',};
       let range = {'24h': 'H:i', '7d': 'd F Y', '30d': 'd F Y', '90d': 'd F Y'}
 
       element.parentNode.insertBefore(wrapper, element.nextSibling);

public/styles/scopes/console.less

@@ -608,6 +608,41 @@
   .chart-notes {
     font-size: 12px;
 
+    &.crud li {
+      &:nth-child(1), &.create {
+        color: #00b680;
+
+        &::before {
+          background: #00b680;
+        }
+      }
+      
+      &:nth-child(2), &.read {
+        color: #009cde;
+
+        &::before {
+          background: #009cde;
+        }
+      }
+
+      &:nth-child(3), &.update {
+        color: #696fd7;
+
+        &::before {
+          background: #696fd7;
+        }
+      }
+
+      &:nth-child(4), &.delete {
+        color: #da5d95;
+
+        &::before {
+          background: #da5d95;
+        }
+      
+      }
+    }
+
     li {
       line-height: 20px;
       display: inline-block;