447 comments found.
Can we also get XD Design File as mentioned in the title? We are about to buy but will only buy if you provide XD Design File since our designer wants to customize the design before we get it approved from the client so need XD the file of this template in order to proceed with our purchase. So please confirm if XD the file is included in this or not?
Hi innovationlover,
Thank you for taking the time to contact us, I am very happy to assist you to whatever you need to know about our templates and services.. 
Yes, We have one for the XD design file but it currently contains only the dashboard page (We will make an update for it regularly).
Hope this helps.
Best regards, Left4code Team
Hello,
Please i have some issues while using some features of your template , like toast part i always get toastify undefined in web console .
please note that i’m using this template in mvc core app.
Hi passanthussien,
Thank you for taking the time to contact us, I’m more than happy to assist you with this.
Looking at the issues you’re experiencing I can confirm that you’re trying to access Toastify plugin outside the JS resource. Normally you need to write every JS code inside /src/js/* and then import it within app.js.
However, you can still use Toastify by exporting the plugin globally. Please follow the steps below:
Modify ”/src/js/bootstrap.js” to export Toastify plugin like below:
// Load plugins
import cash from 'cash-dom'
import helper from './helper'
import Toastify from 'toastify-js'
// Set plugins globally
window.cash = cash
window.helper = helper
window.Toastify = Toastify
Then run “yarn run watch” or “npm run watch” to compile the assets. Now you can call Toastify everywhere on your page.
Hope this helps.
Best regards, Left4code
Hello, I did the installation exactly as it shows in the documentation folder but when I run it (port 3000) it is taking a very long time trying to actually load the page but it never does finish loading.. In the bottom right corner it just says waiting for localhost (chrome latest browser) and firefox as well. If I use yarn run dev this won’t help as it just compiles things but at this moment this is useless since I can’t actually edit anything. Please help!
I’ve tried yarn run watch from 2 different PCs with older and newest version of nodeJS and yarn installed and keep getting nothing but empty loading screen with everything installed properly following the documentation. Any help is much appreciated here.
Hi davidj_orbital,
Thank you for taking the time to contact us, I’m more than happy to assist you with this. Looking at the template you’ve purchased, it is an HTML template.
You don’t need to access the URL with port listed on the console to view the pages. You can simply drag the index.html file to your browser to view the template.
The URL on the console is only intended if you already have a web server installed on your computer, which usually uses the hostname “localhost”.
Hope this helps.
Best regards, Left4code
Yes actually I figured that after I sent the message. Thanks! Another thing, the css is nearly 4mb so aside from removing files we don’t need how do you keep it low size? And what do you recommend to use for scss compiler for working optimally with your files?
The template has shipped with a built-in compiler, we are using Laravel Mix. For maximum compression for production, you can use the command “production run npm” or “production run npm”.
Hope this helps.
Best regards, Left4code
Hi, I want to but one version of your template, I am developing with larval for backend and Vue.js for front end witch version do you advise me to take the Vue version or the HTML one?
Hi JigSnow,
Thank you for your interest to our template. Looking at your stack, I really recommend you to buy the Vuejs version which include 3 projects inside.
- HTML version
- Vuejs version (Created from vue cli)
- Laravel + Vuejs version (Vue SPA with laravel in a single project)
I think the Vuejs version can afford your needs..
Hope this helps,
Best regards, Left4code
Hi I recently purchased Midone theme and it’s a great APP, 1 issue i am facing the summer-note order list and unorder list is not working in Post section. route : http://127.0.0.1:8000/page/side-menu/post
I am using Laravel version, please help me out how to solve this issue.
Thanks.
Regards: Hamad.
Hi hamadpervaiz,
Sorry, I can’t see your purchased badge. Can you post your question in the item that you have purchased?
Hello, im tryng to use datatables bootstrap 4 version: https://datatables.net/examples/styling/bootstrap4.html
but incliding the datatables bootsrap4 verison causing conflict to the templates : https://prnt.sc/v5vn4c
Hi diand_el,
As version 2 above released, we don’t use any plugins that has jquery dependency including datatable.
Now we use Tabulator library as our officially supported datagrid plugin.
Hope this helps
so why embedding datatables bootsrap4 verison causing templates unusable?
Maybe it caused by the plugin itself, since it’s built for bootstrap framework it shouldn’t be used on templates that built with other framework than bootstrap. There may be a conflict or missing between utility classes.
You may need to use the datatable plugin without bootstrap dependencies.
what is plugin ’./highlight’ used for?
Hi diand_el,
It used to highlight the code example, you can remove it on production level..
Hello. i’m having issue with the tail select when using js to add dynamic field.. the initial field is okay, but the next additional field cannot be clicked after clicking the ”+” button, however, not using the tail select properties [ class=”tail-select w-full” data-search=”True”]
the code is here, ready to run: https://jsfiddle.net/mjogu4ck/
hello plese help.. The original form works: https://prnt.sc/v4i62j
But after clik on number 1, the field number 2 is not working: https://prnt.sc/v4i7qn
cleaned code here: https://jsfiddle.net/wc6r53on/3/
Please help.
Hi diand_el,
You need to use the “source” version to work with Tailselect plugin. It’s because you want to clone the select and you need to re-init the plugin to make it works as it should.
Here’s the steps:
1. Install Yarn and follow the installation instruction in the documentation.
2. Export TailSelect plugin as a global so we can access it somewhere within the body tags. Modify ”/src/bootstrap.js” to the following code:
// Load plugins
import cash from 'cash-dom'
import helper from './helper'
import tail from 'tail.select'
// Set plugins globally
window.cash = cash
window.helper = helper
window.tail = tail
3. Re-compile the assets by running “yarn run watch” for debugging and “yarn run production” for production (minify the assets to reduce the file size).
4. Now you can check the following code to clone and re-init the Tailselect element.
<!DOCTYPE html>
<html lang="en" class="bg-white">
<head>
<title>Example</title>
<link rel="stylesheet" href="/dist/css/app.css"/>
</head>
<div class="tail-select-example">
<select class="tail-select w-full">
<option value="">Menu 1</option>
<option value="">Menu 2</option>
<option value="">Menu 3</option>
<option value="">Menu 4</option>
</select>
</div>
<button class="button bg-theme-1 text-white mt-2">Add Menu</button>
<script src="/dist/js/app.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$('button').on('click', function() {
$('.tail-select').clone().appendTo('.tail-select-example')
tail($('.tail-select')[0], {
search: true
}).reload();
})
</script>
Hello, thanks for the reply, i’ve following the step above, however the given script doesn’t work, i forgot to mention that the current <script> is needed and should not be removed because responsible to send data to backend, so i’m trying to embed the script above inside the current “on click” https://prnt.sc/v5039c event. but failed,
how do i combine the script above with the current one?
on click trigger this function: https://prnt.sc/v503oi
Hi diand_el,
Can run this script and see the result in browser console?
console.log(tail);
Here is the result: https://prnt.sc/v50bwk
Can you try this code?
<!DOCTYPE html>
<html lang="en" class="bg-white">
<head>
<title>Example</title>
<link rel="stylesheet" href="dist/css/app.css"/>
</head>
<div class="tail-select-example">
<select class="tail-select w-full">
<option value="">Menu 1</option>
<option value="">Menu 2</option>
<option value="">Menu 3</option>
<option value="">Menu 4</option>
</select>
</div>
<button class="button bg-theme-1 text-white mt-2">Add Menu</button>
<script src="dist/js/app.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$('button').on('click', function() {
$('select.tail-select')
.first().clone()
.appendTo('.tail-select-example')
.removeAttr('style')
.removeAttr('data-select-hidden')
.removeAttr('data-tail-select')
$('select.tail-select').each(function() {
tail(this, {
classNames: 'w-full'
});
})
})
</script>
<div class="mt-3 form-row">
<div class="grid grid-cols-12 gap-2">
<select class="tail-select w-full">
<option value="">Menu 1</option>
<option value="">Menu 2</option>
<option value="">Menu 3</option>
</select>
</div>
</div>
.
How to merge the code you provide into exixting javascript below?
<script type="text/javascript">
function updateElementIndex(el, prefix, ndx) {
var id_regex = new RegExp('(' + prefix + '-\\d+)');
var replacement = prefix + '-' + ndx;
if ($(el).attr("for")) $(el).attr("for", $(el).attr("for").replace(id_regex, replacement));
if (el.id) el.id = el.id.replace(id_regex, replacement);
if (el.name) el.name = el.name.replace(id_regex, replacement);
}
function cloneMore(selector, prefix) {
var newElement = $(selector).clone(true);
var total = $('#id_' + prefix + '-TOTAL_FORMS').val();
newElement.find(':input:not([type=button]):not([type=submit]):not([type=reset])').each(function () {
var name = $(this).attr('name')
if (name) {
name = name.replace('-' + (total - 1) + '-', '-' + total + '-');
var id = 'id_' + name;
$(this).attr({'name': name, 'id': id}).val('').removeAttr('checked');
}
});
newElement.find('label').each(function () {
var forValue = $(this).attr('for');
if (forValue) {
forValue = forValue.replace('-' + (total - 1) + '-', '-' + total + '-');
$(this).attr({'for': forValue});
}
});
total++;
$('#id_' + prefix + '-TOTAL_FORMS').val(total);
$(selector).after(newElement);
var conditionRow = $('.form-row:not(:last)');
conditionRow.find('.btn.add-form-row')
.removeClass('btn-success').addClass('btn-danger')
.removeClass('add-form-row').addClass('remove-form-row')
.html('-');
return false;
}
function deleteForm(prefix, btn) {
var total = parseInt($('#id_' + prefix + '-TOTAL_FORMS').val());
if (total > 1) {
btn.closest('.form-row').remove();
var forms = $('.form-row');
$('#id_' + prefix + '-TOTAL_FORMS').val(forms.length);
for (var i = 0, formCount = forms.length; i < formCount; i++) {
$(forms.get(i)).find(':input').each(function () {
updateElementIndex(this, prefix, i);
});
}
}
return false;
}
$(document).on('click', '.add-form-row', function (e) {
e.preventDefault();
cloneMore('.form-row:last', 'form');
return false;
});
$(document).on('click', '.remove-form-row', function (e) {
e.preventDefault();
deleteForm('form', $(this));
return false;
});
</script>
Simply add “search: true” to the Tailselect options.
tail(this, {
classNames: 'w-full',
search: true
});
You can check all the Tailselect properties on their documentation page.
https://github.com/pytesNET/tail.select/wiki/public-optionshello im updating the css and js asset on here using global plugin https://jsfiddle.net/w5m3x7p0/ so you can test and see the result directly:
however beside should be able to clone functioning tail select it should be able to clone every field inside class=”mt-3 form-row” like code below (there already a js at the bottom that handly any kind of field) https://jsfiddle.net/g41sxd6z/Hi diand_el,
I can only provide a support for the template features, functionality, and usage of third party plugins. You may need a developer to hire if you want to customize your code and guide you to achieve your expected result.
Hello, im trying to use datatable linked to CDN, but not work, im trying to load the datatables css & js, below after app.css and below app.js. aplied to the tables but not working the table doestn change, im using class “small-table”, please i need a solution asap… Thanks
Hi diand_el,
Sorry for our late reply,
The datatable plugin was removed since the release of Midone HTML version 2 and replaced with a tabulator. You can use the datatable by adding the plugins manually.
Please check thefollowing steps:
1. Include jQuery <script src=”https://code.jquery.com/jquery-3.5.1.min.js”></script>
2. Include datatable js <script src=”https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js”></script>
3. Include datatable css <link rel=”stylesheet” href=”https://cdn.datatables.net/1.10.22/css/jquery.dataTables.min.css”/>
4. Init the plugin
$(document).ready( function () {
$('#myTable').DataTable();
});
Hope this helps
Hello, thanks for the reply, im doing exactly that, and like i used to on other template, but still not working, the table not changes at all..
the asset loads just fine: https://prnt.sc/v3j64c
Can you show me if there are any error’s in chrome console tab?
Here: https://prnt.sc/v3kfa4 is it anything to do with the datatables?
It’s very weird..
Can you upload the project online? I need to see it directly.
Heres the code, its only the HTML code, please use the latest MIDONE asset app.css& js. https://jsfiddle.net/02x6urbq/
maybe copy it into local machine Midone folder
Hi diand_el,
I just tried your code and find out the issue why it’s not working. It’s because you put the datatable intialization js code before the plugin (jquery & datatable), so the errors occured.
To fix the problem just put the datatable intialization js code after the jquery & datatable js script tag.
<script type="text/javascript" charset="utf8" src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" class="init">
$(document).ready( function () {
$('#myTable').DataTable();
});
</script>
Thank you so much! solved my problem!!
You’re welcome!
the latest version doesnt have datables integrated? im trying to use datatable linked to CDN, but not work, im prung to laod below after app.css and below app.js. not working the table doestn change, im using class “small-table”
hello? anyone?
I just replied to your latest comment, please check it..
Let me know if you have any other questions.
is this theme support rtl ?
Hi onlinesa,
Sorry, we don’t have support for RTL layout.
Hi - Laravel version : I test with new install it’s working fine but I have problem,
If I create new site with Laravel 8 + Jetstream / livewire : for make Authorize system to use login/ log out / user management of Jetstream
how to include your theme to my project
Hi omeletmatter,
You may need to check the Laravel mix configuration and package.json file to check the template dependencies.
Then copy all the assets from ”/resources” directory. Thats all, some other details you will know after you do the configuration.
Does this template come with Tables such as DataTables? I thought it would but after buying quickly realized it was not in the menu as a page to display.
Hi skylerrichard,
Sorry for the inconvenience,
After the release of version 2 We removed support for jquery in our templates as well as all plugins that use jquery.
For that as a replacement we use the Tabulator for the datagrid plugin. Please check the demo here: https://midone.left4code.com/side-menu-light-tabulator.html And here is the official documentation: http://tabulator.info/docs/4.8/quickstartToastify plugin is not accessible from window scope, app.js seems not exporting Toastify correctly. it always raise “Toastify is not defined” exception. I have to load it separately to make it work.
Hi AliMushtaq2016,
Not all plugins exported by default. All javascript code should be written inside /src/ dir and compiled through webpack/mix.
Therefore you need to use “source” version if you want to export additional plugins to become globally accessible.
Here’s the way:
- After following the installation step on the documentation (installing npm etc). - Next, modify ”/src/js/bootstrap.js” to export Toastify plugin:
// Load plugins
import cash from 'cash-dom'
import helper from './helper'
import Toastify from 'toastify-js'
// Set plugins globally
window.cash = cash
window.helper = helper
window.Toastify = Toastify
- Remove import statement from toastify plugin example code at ”/src/js/toast.js”. Remove this line of code.
import Toastify from 'toastify-js'
How to change the datepicker date format to match my db config?
You can use data property like below:
<input type="text" data-format="D MMM, YYYY">
Or you can modify the default format at ”/src/js/datepicker.js”.
Please check the litepicker docs to see more format. https://wakirin.github.io/Litepicker/Hello guys, this template is just stunning, until i’m working on it, the app.js is include all js with 10mb! wich looks clean and simple on paper, but when its comes to load speed, it not very efficient. on some network would take so long for the page to load, can you guys provide the separated js? i see some of the repply to edit current app.js which is very unpractical for purchased template like this. Thanks.
Hi diand_el,
We use npm as our package manager. So there’s no way to separate every external library. We really pay attention to the best practices in the code that we do, we have long abandoned using an external library without a package manager.
Anyway you don’t need to setup anything to compile the assets, we’ve covered this with Laravel mix. All you need to do is only install the dependencies with yarn/npm.
Then simply run “yarn run watch” to build the assets.
Please follow the documentation below. https://prnt.sc/urie8pthe menu expand not working if the google map js API Key not included, which is a conflict if i don’t need to use a google map, please fix this imidiately.. the template is not usable this way, or please provide a solution for this. waiting to hear from you guys asap. thanks.
Please use the “source” version to add or remove any dependencies from the template.
You can remove the code below to not use the google map library. https://prnt.sc/urifk6Let me know if you get into other difficulties.
How to achieve this? Installing node JS? Im not very familiar with that, can you guys provide all separated js? Not everyone looking for HTML template want to get dirty installing js framework, etc.
Yes, you need to install NPM which is shipped with node.js. Have you tried to install it?
It’s not that we don’t want to provide your request, but we can’t. Many of the plugins used in templates are only available and can be installed via NPM.
May I know what difficulties you encountered while installing node js?
Or what operating system are you using?
Not bother to try, when the template description says, JS Files & Modular JS, people usually get all separate js in one folder. This is my fisrt time buying a HTML template but need to install node js to manage the files. I mean, there’s alredy so much comment about this, why not just provide the separated files to make it easier for all of us.
As a said before we can’t and no body can, as an example we used TailwindCSS as our CSS framework. There’s no way to use it without npm.
Please check the documentation below. https://tailwindcss.com/docs/installationThe modular js and files means that every functionalities and applied plugins are separately in each file.
You can check the code structure below. https://prnt.sc/urj371 As a result you can simply add or remove them via app.js. https://prnt.sc/urj3vahow to manage the js modules? im using mac os,
After installing the dependencies you can go to this file to add or remove the installed plugins or modules:
”/src/js/app.js”
Then run “yarn run watch” to re-compile the changes.
There’s several ways to install node.js on mac, I recommend you to use homebrew. Please check the link below:
https://pawelgrzybek.com/install-nodejs-installer-vs-homebrew-vs-nvm/ok, ill try that, thanks for fast reply! (y)
Thank you, I am happy to help..
hello, im following the steps mentioned before, after Run “yarn install’, how to delete unwanted js from the list? which file to edit?
ahh nevermind, already figured it out!
All right, let me know if you need any other help ..
There’s other thing, for production use “yarn run production” instead of “yarn run watch”.
It will run all the Mix tasks and minify the output for better asset size.
owh thanks for the tips!
one more thing, is there a way to detect which plugin is actually unused and safe to remove?
Hi diand_el,
Sorry for late reply,
Please check the following code, you can remove this code to work only with the basic features of the template.
For js code – App.js
// 3rd Parties
import bootstrap from './bootstrap'
import chart from './chart' // remove
import highlight from './highlight' // remove
import feather from './feather'
import slick from './slick' // remove
import tooltipster from './tooltipster'
import datatable from './datatable' // remove
import datepicker from './datepicker' // remove
import select2 from './select2' // remove
import dropzone from './dropzone' // remove
import summernote from './summernote' // remove
import validation from './validation' // remove
import imageZoom from './image-zoom' // remove
import svgLoader from './svg-loader'
import toast from './toast' // remove
// Components
import maps from './maps' // remove
import chat from './chat' // remove
import dropdown from './dropdown'
import modal from './modal'
import showModal from './show-modal'
import tab from './tab'
import accordion from './accordion'
import search from './search'
import copyCode from './copy-code' // remove
import showCode from './show-code' // remove
import sideMenu from './side-menu'
import mobileMenu from './mobile-menu'
import sideMenuTooltip from './side-menu-tooltip'
For css code – App.scss
// Fonts
@import 'fonts/roboto';
// Breakpoint
@import 'breakpoint';
// 3rd Parties
@import '~slick-carousel/slick/slick'; // remove
@import '~slick-carousel/slick/slick-theme'; // remove
@import '~highlight.js/scss/github'; // remove
@import '~tooltipster/dist/css/tooltipster.bundle.min';
@import '~tooltipster/dist/css/plugins/tooltipster/sideTip/themes/tooltipster-sideTip-shadow.min';
@import '~tooltipster/dist/css/plugins/tooltipster/sideTip/themes/tooltipster-sideTip-borderless.min';
@import '~daterangepicker/daterangepicker'; // remove
@import '~select2/src/scss/core'; // remove
@import '~dropzone/dist/dropzone'; // remove
@import '~jquery-toast-plugin/src/jquery.toast'; // remove
// Animations
@import 'typing-dots';
@import 'zoom-in';
@import 'intro';
// Components
@import 'top-bar';
@import 'app';
@import 'login';
@import 'mini-chat-box'; // remove
@import 'mini-chat-list'; // remove
@import 'mini-chat'; // remove
@import 'table';
@import 'table-report'; // remove
@import 'report-timeline'; // remove
@import 'report-chart'; // remove
@import 'search';
@import 'input';
@import 'button';
@import 'notification';
@import 'image-fit';
@import 'box';
@import 'report-box'; // remove
@import 'global';
@import 'content';
@import 'top-nav';
@import 'side-nav';
@import 'breadcrumb';
@import 'tailwind';
@import 'top-bar-boxed';
@import 'mobile-menu';
@import 'pagination';
@import 'dropdown';
@import 'modal';
@import 'tab';
@import 'checkbox';
@import 'file'; // remove
@import 'inbox-filter'; // remove
@import 'inbox'; // remove
@import 'scrollbar';
@import 'chat'; // remove
@import 'boxed-tabs';
@import 'chat-dropdown'; // remove
@import 'wizard'; // remove
@import 'blog'; // remove
@import 'news'; // remove
@import 'pricing-tabs'; // remove
@import 'accordion';
@import 'error-page';
@import 'tooltip';
@import 'datatable-wrapper'; // remove
@import 'datepicker'; // remove
@import 'select2'; // remove
@import 'summernote'; // remove
@import 'slick'; // remove
@import 'jquery-validation'; // remove
@import 'slick'; // remove
@import 'search-result';
@import 'mini-report-chart'; // remove
@import 'notification-content';
@import 'report-maps'; // remove
@import 'pos-dropdown'; // remove
@import 'pos'; // remove
@import 'toast'; // remove
@import 'post'; // remove
Hello, is there a way to show / list every package size of all package installed in app.js before compiled? so i can consider wich to keep based on size?
Hi diand_el,
Unfortunately there’s no way to show the package size before it getting compiled. You might try separate the js vendor package by re-configure the Laravel mix settings.
Please check the illustration below, let’s say we want to extract the dropzone plugi:
Make new SASS file (/src/sass/dropzone.scss)
@import '~dropzone/dist/dropzone';
Make new JS file (/src/js/dropzone.js)
import from './dropzone'
Configure Laravel mix:
mix.js('src/js/dropzone.js', 'dist/js')
.sass('src/sass/dropzone.scss', 'dist/css')
Now remove dropzone plugin from app.js and app.scss. Then you can include the dropzone plugin to your HTML file.
<head>
<title>Midone</title>
<link rel="stylesheet" href="dist/css/dropzone.css"/>
<link rel="stylesheet" href="dist/css/app.css"/>
</head>
<script src="dist/js/dropzone.js"></script>
<script src="dist/js/app.js"></script>
Now you can see the size of the dropzone.js package on the network console. Here’s an example with app.js.
https://prnt.sc/uzm2dw
udah sy bayar gan.. lg proses download…thanks
Baik gan, sama-sama..
Happy coding!
apabila ada error sy infokan.. thanks
Baik gan bisa kontak kami di email berikut:
muhammadrizki@left4code.comgak ada Listviewnya yah gan? gak bisa ditambahkan gan? hehehehe
Halo abidhamma,
Listview yang dimaksud seperti apa ya? Bisa dikirim contohnya?
gan.. tabulator itu kan ambil datanya dari JS dan mengarah ke https://dummy-data.left4code.com/
Ada formatnya gak yah dari domain tersebut? biar sy bisa ambil data dari mysql menggunakan PHP kemudian di olah oleh JS tabulatornya…
oh gak jadi ah.. ada yang lebih simple.. crud data list.. thanks gan…
Oke gan..
gan.. gimana cara pake chart donut dalam 1 line table dan kolom?
saya coba rubah di app.js jadikan seperti ada arraynya tapi gak jalan…
var _ctx9 = cash('#donut-chart-widget')[1].getContext('2d');Kemudian saya coba ganti ID canvas juga gak nongol.. caranya gmn yah? bingung… makasih gan..
Halo gan,
Maaf, maksudnya chart donut dalam 1 line table ini seperti apa ya?
Saya kurang paham, ada contoh gambarnya?
Hi.
Your Components > Grid > Tabulator page has an javascript error!
Hi sojupiter,
Can you describe in more detail the error you are referring to?
I can’t find it in the demo file. A screenshot will be very helpful ..
Hello, how are you ? The coding of this theme it is very confusing full of classes and it is not very clean the code could reverse the purchase made. Yesterday this theme was bought the midone.
Hi danilolimar,
Thank you for your purchase, I hope you are good..
The first thing I want to say is, I know what you feel about it. I had the same impression when I first started using TailwindCSS (So much classes, bloated HTML code).
But that is the main power of TailwindCSS, you can create a UI component without writing a lot of CSS code, we change it instead with a complete of utility classes provided by TailwindCSS.
The benefit of it is: - You can reduce the SASS compile time like 3x or 4x faster (since you don’t need to write a regular SASS code). - It can significantly reduce your CSS code size and bring consistency for both developers and end users, you can read the article below to see the comparation and why utility classes is so powerfull.
https://blog.logrocket.com/css-utility-classes-library-extendable-styles/So as a conclusion, I can say that the less you write regular css code, the cleaner the code you write, and the more consistent your code will be you will know when you try it.
Hope this helps..
You can also frequently access the TailwindCSS documentation, it will easily familiarize you to use existing utility classes.
https://tailwindcss.com/Cool, but it doesn’t meet my project. I would like if I can reverse the purchase it will be better for me.
Have you read the item description?
It clearly describes the item specifications and used frameworks or plugins.
Yes, I read the description but I had not seen the coding, it is very polluted, I only realized it when I bought the theme.
Have you used TailwindCSS before?
That’s how TailwindCSS works, please check this link: https://tailwindcss.com/#utility-firstSorry before, but you also wrote a bad review on our template based on the difficulties you are having.
Whereas that is how the TailwindCSS works, what do you think about it? Is the framework is bad or or are we using it incorrectly?
It doesn’t fit my project, I could do the chargeback please! I will have a lot of code and it will be very polluted. And in the written description it does not inform that it is TailwindCSS it only has the freamwork icon and the credit and filter appeared to me as a bootstrap. The structure is very polluted of classes for those who develop applications in C # this is very impracticable for the project.
I could reverse the purchase. pls
We write it clearly in the description, please check it more carefully.
https://prnt.sc/ukn1oaWe also did not write any bootstrap info in the descriptions or template tags.
So you wrote a review about something you didn’t know about, gave it 1 star and are now asking for a refund?
I change the rating without a problem but I want to refund this. You say features, example: buttons, modals, etc … This is freamework is written in the description below the 1 demo image.
Pls check this exemple – https://themeforest.net/item/gotri-admin-dashboard-html-bootstrap-angular-6-template/22822073
It does not inform or in the description, just by image and says as functionality. This is not specific!
That’s what the template has to offer and the biggest difference with other TailwindCSS template.
Since the TailwindCSS framework has no components at all, except you are using TailwindUI. So we make any of these from scratch to make it easier for developers using this template.
The example that I showed you is for you to see that you do not show that it is TailwindCSS does not say anywhere. I want my money back!
If you can read the product description carefully you can scroll it a little more down and find out at “Detailed Features”.
Written specifically “TailwindCSS 1.2.0”.
You say but don’t say it was based or developed with it, it’s a feature!
Yes it is!
When you read about TailwindCSS you will know that it is a framework, and you should understand that the template are built with TailwindCSS.
Just like other CSS frameworks like MaterializeCSS, Bulma, or Foundation.
it must be specified! That is why you have the option of describing, describing what the topic is and not leaving it implied, it is not clear! I am very dissatisfied I want my money back!
I think like you don’t read the description carefully, I am very sorry We got so many sales and multiple reviews without having any problems with the description (Please check it at reviews tab).
You can apply for a refund according to the item you bought, we will process it according to the Envato refund policy at link below…
