Discussion on Neon - Bootstrap Admin Theme

Discussion on Neon - Bootstrap Admin Theme

Cart 5,189 sales
Well Documented

Laborator supports this item

Supported

This author's response time can be up to 1 business day.

754 comments found.

Also we found that in Firefox the first cell in the table is stretched 70% of the table width if it’s placed in the tab. Please advise why is that happening in Firefox and how to fix this.

Hi mamontov,

Can you please write us your site URL here on comments first? We need to investigate your site and then get back to you if we have possible solution.

Kind regards,
—Ylli

Hi Ylli, thank for your follow up. After a recent Firefox update it seems that this problem was resolved automatically.

Hi mamontov,

Glad to hear this news :)

Kind regards,
—Ylli

Hi,

Are you planning to implement “scrollX”: true functional and styling. At the moment we have a black line at the bottom of the table and the scroll doesn’t appear.

Hi mamontov

Can you please tell me at which page do you apply scrollX? And which scrolling plugin do you use (perfectscrollbar or niceScroll)?


Best regards,
Arlind

Hello Arlind,

We aren’t using a plugin. Just activated “scrollX”: true in the Data Tables jQuery plugin used in NEON foundation.

Here is an example https://datatables.net/examples/basic_init/scroll_x.html We are using it on a regular page with table that needs scrolling just like the example shown. Will you provide styling for the scrolling?

Sincerely, Denis

Hi Denis

We haven’t disabled scrollX, however you may try to add your width to the table and scroll will appear:

table.dataTable {
    min-width: 1500px;
}

To Remove that “black line” in the end of table apply this CSS:

.dataTables_scrollFoot th {
    border-top-color: #ddd !important;
}


Best regards,
Arlind

Hello.

I am using the latest Neon Theme – downloaded yesterday, 2016-03-30.

In Firefox 45.0.1, the neon slider have problems with the height on the element, when switching from one slide to another.

On the first slide, the height is set to 126px when switching slide. On the second/third slide, the height is set to 335px when switching slide.

The height switches back and forth on the slides and results in a flickering page. And a not so nice looking slider ;-)

In Chrome and IE, the slider keeps its fixed height. It looks very nice and smooth.

Download the latest Firefox and look here: http://demo.neontheme.com/frontend/main/

Hopefully you’ll see what i am talking about.

Any ideas how to fix this?

Best regards Andreas

Hi Andreas

Sorry to hear that, I have managed to fix this by adding height because firefox is ignoring min-height property.

<style>
.slider-container .slides .slide {
    min-height: 335px;
    height: 335px;
}
</style>

This will fix your issue.


Best regards,
Arlind

Thank you.

You’re welcome :)

I am not necessarily asking for help, but requesting an update or a fix. The div.slides-nextprev-nav overrides any href on the image below in the slides on the front page.

Other than that, I am really happy with the product.

Hi foldager,

You may add this CSS and it will fix that issue:

.slides-nextprev-nav {
    pointer-events: none;
}

.slides-nextprev-nav a {
    pointer-events: all;
}

This should work in your case.


Best regards,
Arlind

Thank you so very much! I would recommend adding that to the theme as well – seems like an issue. :)

Hi foldager,

For sure, we will put this on our to-do list for the next update :)

Kind regards,
—Ylli

what js files are needed to show the animated top menu items? i have the top menu but when i hover over the meny items the sub menus are not extending (showing). i guess i am missing a JS file but i have them all from what i can see

Hi marriog

The essential files you need to include are neon-custom.js and neon-api.js (also jQuery).

This should work for you.


Best regards,
Arlind

Hello, I’m new to web development but i was wondeirng if this template can be used or customized to be used as something that would accept, count, chart and compare data an user has entered?

Hi Bilka1

This question is related to your abilities on development, because the elements you see in demo of Neon theme, are available to use and combine. If something is not shown, then you need to figure a way to implement that functionality.


Best regards,
Arlind

Thanks for the information sent to the Chat Api .

Got something similiar to set up the MailBox with Gmail to read and send email?

:D

Hi Lukahco

Actually that is only HTML template and I have no knowledge how to implement that inbox system.

You need to find some library that can help you easily implement the mail functionality. Neon theme has only these elements styled for your purpose to use within your framework.


Best regards,
Arlind

I am having an issue with pages that include datatables.js and the .modal function. If I remove the datatables.js the .modal works fine, otherwise it says jquery (...).modal is not a function.

Can you offer some help? I am using your default example to try and get it to work right now..>

function showAjaxModal()
{
    jQuery('#modal-7').modal('show', {backdrop: 'static'});
}
jQuery.ajax({
    url: "/data/ajax-content.txt",
    success: function(response)
    {
        jQuery('#modal-7 .modal-body').html(response);
    }
});

Nevermind! Figured it out. I accidentally included two jquery min files. Sorry to bother

Hi tomrippity

Great to hear that. If you have further questions feel free to post hem here.


Best regards,
Arlind

I have integrated Neon theme in one of my project. After adding some ajax activity, left sidebar menu not working properly Submenu Expand / Collapse activity freezed. Can you please suggest me if any function need to call after ajax activity or please suggest how to fix this.

Hi vbnvicky

This is weird, is it possible for me to see your site?

Because normally sidebar does not interact with any AJAX, it simply uses these functions:

menu_do_collapse( ... );
menu_do_expand( ... );

So if you view these functions in neon-custom.js you will see that they simply use animations from TweenMax (from GreenSock) animation engine.


Best regards,
Arlind

Hi, The subnavigation items for the frontend are not displayed correcty when there is only 1 sub item:

<nav class="site-nav">

                    
</nav>

This is due to the first and last child styling…

Hi marvanni

I tried to see it live and the last element it is shown fine. See here:

(view large version)

Do you have any screenshot or URL so I can see whats the issue on your side.


Best regards,
Arlind

Hello,

I use NEON theme for my admin panel. Now I want use NEON color scheme, design for custom part. It is looks not good for me… Somethink is wrong…

I know, this is not support task, but may you can help me with design. Just put me in right direction.

I can’t imagine what is better background/border/font color and size for (1) Chat Panel and (2) User list, grouped by department.

Custom part – design needed Image and video hosting by TinyPic

Full panel view Image and video hosting by TinyPic

Hi Dimetreus

I am sorry but I am only a developer and do not know a lot about graphic design of web elements, so I don’t know how I can help you on this. Use the main color scheme of Neon to change the colors of this chat plugin, remove gradients and box shadows to make it Flat design.


Best regards,
Arlind

Thank you!

Glad to hear that :)

Kind Regards,
—Ylli

Hello, I would like to ask 3 things:

1) In entry fields, how can I have several “data-validates” with different “data-message-required”? For example, the field is required, is nothing is entered give some message. Also, there a maximun number of characters, if that number is exceeded give another message and so on.

2) In entry fields, with data-mask=”phone” we have a mask for a phone format, but is an American format )it seems like). Can I have something that changes depending on the country? For example is the user lives in Japan the mask gives a mask with the phone number estructure from Japan, and so on.

3) When uploading files with can I have some validation of the field? Like only some extensions allowed, a maximum size of the files, etc? So if some of these are exceeded the field will show a error message?

Thank you very much.

AM

Hi AM

1. If you want to implement several rules then I suggest you to do this in JavaScript way, here is an example:

http://code.runnable.com/UZJ24Io3XEw2AABU/how-to-validate-forms-in-jquery-for-validation

2. IF the format is not found in the list then you may apply regular expression so you can create your format. Read here:

http://jqueryvalidation.org/jQuery.validator.addMethod/

3. The best way is to validate on the server side, however file size its better to validate on client side:

For the HTML bellow

<input type="file" id="myFile" />
try the following:

//binds to onchange event of your input field
$('#myFile').bind('change', function() {

  //this.files[0].size gets the size of your file.
  var filesize = this.files[0].size; // in bytes

});

Read more: http://felipe.sabino.me/javascript/2012/01/30/javascipt-checking-the-file-size/

Hopefully this helps you.


Best regards,
Arlind

its not sending emails on any thing

Hi there, can you please post with the account you bought the theme, this way we can verify that you’re a real customer as we do not offer support to users who doesn’t have “Purchased” badge.

Kind Regards,
Art

sorry this comment is for another post .

Hello as I can put to work the Chat and Inbox , some kind of link that may contain information or manual.

Thank you for helping

jorgesenameh@gmail.com

Hi Lukahco

Documentation about how chat works is located here:

http://demo.neontheme.com/extra/chat-api/

All functions of Chat are contained inside neon-chat.js


Best regards,
Arlind

Hi there,
can the footer be “sticky”? like the one from Xenon, I saw you mentioned you were going to add it 2 years ago, but not sure if you did, if so what’s the HTML markup for that
thanks :)

Hi castlecode

This code will will make your footer sticky always to bottom:

jQuery( document ).ready( function( $ ) {
    var $footer = $( 'footer.main' );

    function adjustFooterHeight() {
        $footer.css( 'marginTop', '' );

        if ( $( window ).height() > $footer.offset().top + $footer.outerHeight() ) {
            $footer.css( {
                marginTop: $( window ).height() - $footer.offset().top - $footer.outerHeight()
            } );
        }
    }

    adjustFooterHeight();
    jQuery( window ).resize( adjustFooterHeight );
} );

I hope you like it.


Best regards,
Arlind

Hello,

I’m trying to get several menus to be open at the same time. How can this be done?

I thought “multiple-expanded” has this effect, but it doesn’t do anything.

Hi dannyzb

I’ve added multiple-expanded class to #main-menu element like shown here:

(view large version)

And it allows multiple menus to be open at the same time, here is the result:

(view large version)


Best regards,
Arlind

Can i get HTML version?

I bought a template admin on 2 weeks ago, but it just use on Agular JS.

Hi hotienloc,

If you buy Neon it will be in HTML, we don’t support AngularJS on Neon. We offer another admin theme Xenon that supports AngularJS, but Neon is only HTML.

Kind Regards,
—Ylli

Yeah! I got it.

I will be back if your theme’s the best choice with me :D

Thanks you so much.

Hi hotienloc,

Glad to hear that :)

Kind Regards,
—Ylli

Hi,

I really like this theme but there are many issues and I am beginning to notice them one at a time. I will describe each issue in a separate entry; but the first major problem I have is with SelectBoxIt, Horizontal Menu and DataTable.. If a page uses all 3; then things are broken on the page..

Here is my order of scrips –

@Scripts.Render("/assets/js/datatables/datatables.js")
  @Scripts.Render("/assets/js/fileinput.js")
  @Scripts.Render("/assets/js/dropzone/dropzone.js")
  @Scripts.Render("/assets/js/jquery.validate.min.js")
  @Scripts.Render("/assets/js/joinable.js")
  @Scripts.Render("/assets/js/resizeable.js")
  @Scripts.Render("/assets/js/neon-api.js")
  @Scripts.Render("/assets/js/select2/select2.min.js")
  @Scripts.Render("/assets/js/bootstrap-tagsinput.min.js")
  @Scripts.Render("/assets/js/typeahead.min.js")
  @Scripts.Render("/assets/js/selectboxit/jquery.selectBoxIt.min.js")
  @Scripts.Render("/assets/js/bootstrap-datepicker.js")
  @Scripts.Render("/assets/js/bootstrap-timepicker.min.js")
  @Scripts.Render("/assets/js/bootstrap-colorpicker.min.js")
  @Scripts.Render("/assets/js/daterangepicker/daterangepicker.js")
  @Scripts.Render("/assets/js/jquery.multi-select.js")
  @Scripts.Render("/assets/js/icheck/icheck.min.js")
  @Scripts.Render("/assets/js/neon-chat.js")
  @Scripts.Render("/assets/js/neon-custom.js")
  @Scripts.Render("/assets/js/neon-demo.js")
  @Scripts.Render("/assets/js/datatables/datatables.js")
  @Scripts.Render("/assets/js/fileinput.js")
  @Scripts.Render("/assets/js/dropzone/dropzone.js")
  @Scripts.Render("/assets/js/jquery.validate.min.js")
  @Scripts.Render("/assets/js/joinable.js")
  @Scripts.Render("/assets/js/resizeable.js")
  @Scripts.Render("/assets/js/neon-api.js")
  @Scripts.Render("/assets/js/select2/select2.min.js")
  @Scripts.Render("/assets/js/bootstrap-tagsinput.min.js")
  @Scripts.Render("/assets/js/typeahead.min.js")
  @Scripts.Render("/assets/js/selectboxit/jquery.selectBoxIt.min.js")
  @Scripts.Render("/assets/js/bootstrap-datepicker.js")
  @Scripts.Render("/assets/js/bootstrap-timepicker.min.js")
  @Scripts.Render("/assets/js/bootstrap-colorpicker.min.js")
  @Scripts.Render("/assets/js/daterangepicker/daterangepicker.js")
  @Scripts.Render("/assets/js/jquery.multi-select.js")
  @Scripts.Render("/assets/js/icheck/icheck.min.js")
  @Scripts.Render("/assets/js/neon-chat.js")
  @Scripts.Render("/assets/js/neon-custom.js")
  @Scripts.Render("/assets/js/neon-demo.js")

The SelectBoxIt does not appear.. Pls help me fix this issue. Thx, Manish

Hi Arlind,

It’s just a MVC way; I am using the regular way for loading the scripts.. even then I have trouble with “selectboxit” not showing up.. I am using datatable and selectboxit and the order I checked is correct too (like I am loading datatable.js before joinable.js).

Kindly help with me fixing this issue of datatable and selectboxit.. For now, the selectboxit is not showing up and I see javascript errors.

Below is the javascript errors -

SCRIPT438: Object doesn’t support property or method ‘widget’ jquery.selectBoxIt.min.js (4,92)

SCRIPT438: Object doesn’t support property or method ‘selectBoxIt’

Thanks, -Manish

Hi Arlind,

I am using both datatable.js and selectboxit.min.js – if I comment just the datatable.js then it selectboxit show up; but when I have both the scripts on the page; then selectboxit does not show up.. and I get javascript errors like I noted in the previous email.

Thanks, -Manish

Hi Manish

We have updated Datatables to the latest version so I guess that should not be the problem.

I suggest you to update to latest SelectBoxIt and it will fix the issue.

It will break the CSS structure but with some small CSS modifications you will manage to sort it out.


Best regards,
Arlind

When the basic license says it’s not for products that are sold, what does that mean?

If it is placed in a subscription-based website, does that apply to the basic license or not? (A website like moz.com for example)

Hi there,

The regular license is used unless you revenue from that site, like a subscription site or a site that will re-sell the framework – for example you’re a developer and want to sell your plugin with our theme then you need to get an extended license.

Kind Regards,
Art

Hello,

I need an RFP for several custom sites. Please confirm if you also develop mobile apps as well. My email is bedellcarleton@gmail.com.

I can send you more details.

Thanks, Carleton

Hi Carleton,

We do not develop mobile apps and we are not available for freelance work.

Kind Regards,
Art

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve ThemeForest.

Sure, take me to the survey