Discussion on Webarch - Responsive Admin Dashboard Template

Discussion on Webarch - Responsive Admin Dashboard Template

By
Cart 4,894 sales
Well Documented

ace supports this item

Supported

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

1192 comments found.

Sorry for asking again but I can’t figure out how to use only the desktop and the phone view (and their corresponding navigation) but not the tablet view.

In other words: When on tablet I want to see the left navigation menu in opened state (like on desktop), I can then close the menu and use the small left navigation if more space is needed.

How do I get this behavior?

Thanks in advance.

Hi there You want the desktop view even in the tablet right ?

so you once you scroll down in the source you will find the

<div class="page-sidebar" id="main-menu">

and the extra class opened

<pre>
<div class="page-sidebar opened" id="main-menu">

Hope you got it :)</div></pre></div>

This is a great template with lots of possibilities! However, there seems to be a small bug regarding the charts javascript.

When I delete all chart widgets from the widgets.html but keep the corresponding js files in the body, some of the animations from the other widgets won’t work anymore. When I delete the javascript files from the body,everythings works fine.

Hi there

I think its a small mis understanding, when you delete a chart you should delete the appropriate JS code relevant to that chart or else it will try to find it and if its not there it will through an error, I know why didn’t we error handle ? unfortunately these 3rd party plugins don’t but I’ll give you a best practice hint

In the package folder open the barebone :) from that you build your project, it has all the minimum requirement to run webarch, you simply import necessary plugin links( follow documentation).

To debug code Open up chrome and press f12 and go to console tab or else in OSX right click inspect element :)

To find the relavant chart JS in the HTML code you will find a div with a specific unique ID, open the chart.js in assets/js folder and find that same ID :)

Hope this helps

Found bug.. Go to “Layout – options”, click button “Toggle Chat”, and click “Show/Hide Menu” or button with three strips..

Hi there I think your talking about the settings gets over layed by the chat right ? :) yes its demo only bug will fix it Thank you very much

Small questions:

  • How do I colorize the fontawesome icons with eg the .primary color or any other color?
  • I do not see my logo in the header in tablet view. It appaers correctly in mobile and desktop view?
  • How do I change color of the left sidebar menu mousever (for the icons). The menu is my primay color but on mouseover it has a default color (from your demo).

forgot to ask how to force desktop view also on tablet? Thanks!

Hi there Answers 1) Try the 4 main color and the class

text-warning
text-success
text-danger
text-info

2) By default we have set it to go to condensed menu there for the logo also condense with the menu

to open the main in tabets

Just add the class .opened to main-menu div :) Done! we have already enabled that feature in 2.5

3) Have you use LESS because that would be quite easier to change the theme colors if not we can change the ill tell you the CSS line number :)

Hi Ace,

I am trying to view on an iPhone as a live preview it jumps from one view to another, meaning that it shows the two posibilities you can have as a layout or with or without the expanded side bar. So my question is: will this happen to me after I will purchase is it just for demo purposes?

Cheers!

Hi there Im not sure if I got exactly what you were saying, you mean when you have the themeforest top bar and without it ? :)

Hi, is the “Slide Toggle” scalable? Perhaps with ”.input-lg”/”.input-sm”? I`d like to have it smaller but i did not find documtation.

Hi there Unfortunately its not this is a third party plugin, but we have already made one for the new update,

Pre Checkbox update : slide toggle

Send an email to support@revox.io

We will mail you the code :)

Cool. I will wait for the update, thanks :-)

Hello , What should i do for using scrolling feature in grids. ?

Hi there Simply add the following div after grid body, note that you must specify a height :)
<div class="scroller" data-height="220px" data-always-visible="1">
Your scroll content
</div>

Hi Ace,

We are implementing Datatables ColVis in our application. We have about 16 items. On load, only 6 display in order to keep the elments within the grid (grid simple). What happens, is when the user displays more than 8 and the page needs to expand, the white-bordered background (grid) does not expand with it. The table elements simple overlay it.

Is there a way to achieve a responsive result that when the page expands to the right, that the grid (grid simple) can expand with it?

Please let me know if you need a screen shot for better clarification.

Thanks!

Hi there Sorry about the late reply, I think I got what you said but a screenshot would be very helpfull, did you try out the datatables responsive plugin

Its already available in webarch

https://github.com/Comanche/datatables-responsive

HI Ace. I am using the responsive datatable element and it works when screen size is different. Sending screen shots

very nice and professional design. Well done!

Hi there Thank you very much, appreciate the great comments :)

link for example login page.

You can add a background image on the login panel page?

Yes why not but you need a js custom code, that we could provide, quick question do you have a set of images stored on a directory and your retrieving it from that or from an api ? :)

set of stored images.

Hi there Open up core.js or even login.js to put the custom code to change images

$.fn.randomeBackground = function(numberofimages,dirpath,ext) {
       var random = 1 + Math.floor(Math.random() * 6);
       $(this).css("background-image",dirpath+numberofimages+ext);
};
//Function Call
//Para -  Number of images, Path to dir, Extenstion
$('body').randomeBackground(6,'assets/img/bg/','.jpg');

Hi, I really want to purchase this theme but could do with a blog page layout. Is one coming in the future or is it easy enough to create one on the blank page template with the existing features? thanks

Hi there Im assuming your talking about the front end, but if you look at the admin panel design dashboard we have made a couple of blog widgets :) yes we are planning to update the front end so blog page would be an awesome idea

Hi, we experience problems compiling SASS files. I have read about a fixed version somewhere in the comments? Are there any known issues with SASS?

BTW. any plans for update to this excellent theme?

Thanks!

Hi there You should be able to compile it properly though, there was a minor update issue with 2.5 where it was not sync with the LESS files, but we now have a proper update and will be available in themeforest soon

but if you want to SCSS files please email to

support@revox.io

SCSS Latest Update Available

Hi Ace, just a quick question is it possible to have a Grid/Portlet Collapsed by Default when a page loads? also; about the problem that palmtown has with Datatables Tabletools, it might be the SWF location (tabletools uses flash for that functions). i had the same issue and fixed it editing the datatables.min.js and pointing manually the copy_csv_xls_pdf.swf location.

Hi there Yes the data-tables plugin is bit annoying even there latest update uses flash :/ but they do not have any other options, still investigating on this problem with data-tables, well if you want to

Knowledge Base

Close Port-lets By Default

To your grid add the class closed

<div class="grid simple closed">

</div>

and afterwards we need to point the arrow up so you will find the div .collapse inside the grid

change it to

expand

Thanks, i’ll try it later. and like i said i just changed the file dataTables.tableTools.min.js there search for

TableTools.DEFAULTS={sSwfPath:"../swf/copy_csv_xls_pdf.swf"
and replace it for
TableTools.DEFAULTS={sSwfPath:"assets/plugins/jquery-datatable/extra/swf/copy_csv_xls_pdf.swf"

Hi I use wysihtml5 in the form. All editor buttons are huge and get styles from regular theme buttons. How can I give them regular look of text editor controls?

Hi there This is surprising, We have fully tested in Safari, Chrome, Firefox, in Windows 7,8 and also Mac OSX, will you be able to tell me more info about chrome version, and OS version ? :) Thank you again

Hi. I’m sorry, the problem was in 3rd party chrome extension. Everything is ok now, the question is closed. Thanks a lot!

Great Happy to here that :)

Fixed : Problem due to chrome extension

Hello Ace,

I think I’ve hit another bug, in short I have 2 problems:

1. I am using the datatables plugin as used in the example and I am using table tools. The problem is when I click on the download button to get the drop down of options, it shows an overlay that prevents me from clicking one of the drop down menu choices. Then when I try to click an option, the overlay simply closes and the menu is gone. I think somewhere in the code it is invoking an overlay. Also, when I remove “sExtends”: “collection”, from aButtons, it shows all the buttons, but only the CVS button works, but it downloads the PDF as if some image map is out of place.

2. On my samsung table, I can’t get the menu to expand or show the sub-menu items. Works fine on pc.

Hello Ace, for #1, I was able to find out what the problem is, not sure how to fix it. Basically, when I click the download button, DTTT_collection_background gets applied and that’s what causes the overlay. I read a few problems with this down the same lines, but no solid fix in this particular case, you have any suggestions?

Hi there Will look into it and get back to you :)

Hi . Please tell me the solution that by which page template I can get all plugins and option facility in one page because I am stuck by adding one by one plugin JavaScript in one page and most of the time its not work . Please tell me one page in this awesome solution which have all plugins support.

Hi there Adding all the plugin will make your page really really heavy, Im assuming your working from the barebon folder ? if so let me guid you through in which plugin or element you need to add and what goes wrong :)

First please do always refer the documentation in case of a problem and if that does not work, open up the debugger in chrome or firefox and go to console tab, once your there you might see any error coming up, let me know what they are and what plugin or element you want to add, I’ll be happy to help you out :)

I believe there is a small bug in the Form Controls area in the form_elements.html page. Specifically, the username control with the instagram icon appears with inner border when it should be transparent. It seems like the live version does not contain this issue. Can you let us know what the code-fix is? Thanks!

UPDATE: I am using Safari 7.0.5.

Hi there Sorry about yes its going be update in the next version

FIx

Using CSS
Open up assets/css/style.css add this code
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:last-child>.btn, .input-group-btn:last-child>.btn-group>.btn, .input-group-btn:last-child>.dropdown-toggle, .input-group-btn:first-child>.btn:not(:first-child), .input-group-btn:first-child>.btn-group:not(:first-child)>.btn{
    border-left:0
}
Using LESS
assets/less/modules/form_elements.less
.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
  border-left: 0;
}

Hi, in the version 2.03 the padding of the ‘scrollup’ remain in the wider sidebar width when i change viewport. Any hotfix for this without upgrading to 2.5?

Please advice, Kostas

Hi there Yes we can give you a fix, viewport as in a different resolution? what might be the resolution so we can use media queries to change the scrollup class

Hello, i need fox for the standard viewports. when you change the browser size (in your demo as well) and the sidebar fully close, the scrollup remain in the middle of the screen.

Hi there! :) Its been a while! sure why not, If you can drop an email to support@revox.io I can write back

Hello, Please I need to view the datepicker in months format and years format, how I do that?

Hi there Im guessing your talking about the view mode

Here is the documentation for it :)

http://www.eyecon.ro/bootstrap-datepicker/?utm_source=twitterfeed&utm_medium=twitter
$('#datepicker').datepicker({
format:"dd/mm/yyyy",
startView:1,
viewMode:1,
daysOfWeekDisabled:"3,4",
autoclose:true,
todayHighlight:true
});

Try changing the view mode :) attribute

thanks :)

Image and video hosting by TinyPic

The search results page doesn’t render well responsively. I’m using the Samsung galaxy s5

Hi there Sorry about that just fixed it up on the live version :) http://revox.io/webarch/latest/search_results.html#

PATCH

you can add the following code on to the responsive .css file

or less

@media (max-width: 500px){
  #Parks.grid .mix{
    width: 100%;
    padding-top: 53%;
  }

  .drop_down{
    display: none;
  }
}

@media (max-width: 1000px){
  #Parks.list .meta{
    width: 150px;
  }
} 

@media (max-width: 840px){
  #Parks.list .meta.region,
  #Parks.list .meta.rec{
    display: none;
  }
}

@media (max-width: 540px){
  #Parks.list .meta.area{
    display: none;
  }

  #Parks.list .titles {
  max-width: 37%;
  }
}
and a small change in the style.css css
#Parks ul{
    padding-left: 0px;
}

less
#Parks {
  ul{
    padding-left: 0px;
  }
}
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