1192 comments found.
Hi Ace,
Sent you an email about this but I know responding here might be easier sometimes.
I am implementing Datatables similar to your EXAMPLE 2 whereby a user can click for more details.
Within this table, I am using the option to hide columns. http://datatables.net/examples/basic_init/hidden_columns.html
The issue I am running into is responsiveness. When I use and reduce my window size on this site: http://datatables.net/examples/basic_init/hidden_columns.html, the table responds.
However, when I use it on the template, the last row seems to cause an overlay and appear outside the table element.
I know the issue has to due with using this feature because is I opt to show all rows and make it similar to your example (1), once the screen is resized, it will adjust and hide those I marked data-hide=”phone,tablet”
Would you have an insight into why this is happening?
a
Hi there Mike, sorry about the delay with your request, Im trying to replicate your scenario
Just dropped you an email too
Hey, I’m very interested in purchasing this template, I jst have a question. In the iPhone version, when the chat comes up, it doesnt scroll down to all the users available, is the any work around on that or something to get it working, Just yes or no would do, then I purchase it, I’ll email you about. Yeah?
Hi there
Yes you can 
I did try on iphone 5 seems to be working, but we can use the scroll in the main menu or -webkit scroll with the bounce
Hey! So I did purchase it, awesome theme so far. anyways I like the bottom header, but I can’t seem to replicate it on a separate template. mind helping a designer out?
Hey there
Thank you very much! you want the header to be in the bottom of the page ? first of all I recommend you to work on the barebone index.html it has all the clean code to start your project and you copy what ever the elements you want from webarch to barebone
to make the header stick to the bottom
and the class “bottom-header” to the body
<body class="bottom-header">
Sweet thanks!
Ok, so I got it done, but the “notifications” and “settings” aren’t displaying?
Hi there For the notification list you can, if you scroll through the source and find the tag with the id=”my-task-list”
In the same tag you will find the attributedata-placement="bottom"
change it to “top”
as for the settings I’m working on tweak for you
Thank you!, ugh. 2 months in php, then suddenly html, can throw you off a bit lol I very much appreciate it
No worries glad I could help
Alright, well let me know in that settings tweak.
Hi – great work on this template! I’m moving to Angular as well. Would it be possible to have access to the AngularJS beta version?
Hi there
Thank you very much! we have a very basic angular version and its pretty much a very high demanding area, just added you the git via your gmail account
Hello!
First of all, great theme!
I was planning to build an app using Angular.js and I noticed in the past comments that you have a git repo for the Angular.js version of this. Could you add me in?
My GitHub handle is @stevetan86. Thanks!
Hi there
Sure! we have a private repository, if you could email me at support@revox.io will add you with that email address
and Thank you very much for the feedback and comments
Any plans for e-commerce pages?
Hi there
Not at the moment but you might want to see what coming up on the 8th August 
a big surprise
I have a table with 1000+ records, my tables takes a long time for the table to populate with the data records. How I can change that?
Load less data or another solution. It’s possible to configure out a way to recover less data per row? Something to improve the data load.
I’m using the table #example2 with ajax search.
Hi there
Well first question would be are you using datatables plugin ?
something like this would be more ideal for your problem
http://datatables.net/examples/server_side/simple.htmlIt will only load the first few and on pagination request it will load the next set with a limit say 10 per page
Hello,
Can you tell me what happened to the documentation?
http://dev.revox.io/documentation/helpfile.html no longer works.Thanks
Hi there
Its http://revox.io/webarch/documentation/helpfile.html and also distributed with the package
Hi, is the best admin template I have seen here but I would like to ask if is on your plan to the the version with the top menu, I mean the menu we have now on the left have it on the top (Is what I need)—Example: http://192.241.236.31/themes/preview/smartadmin/1.4.1/ajaxversion/#ajax/dashboard.html -> go to configuration and choose top menu. In case is yes how long? Thanks
Hi there
Thank you very much
Yes we are planing to put a horizontal menu say within next week Friday
Ok great thanks
Hi I have access to the repository but I can’t see the top menu. Are you still working on that? When will be released? Can I see it on the repository? Thanks
Hi there
Sorry I did not push any updates, working on something awesome for themeforest will make a push tomorrow, Thank you for waiting
ok thanks, please let me know when you push it. thanks
hi, i’m using less… how can I have only style.less to compile into .css … now I have style.css and responsive.css how Can i put responsive.less into style.less without conflics?
Hi there
Did you try adding the
//Responsive @import "responsive.less";just below search_results.less include ?
Hi there,
I can’t get tooltips to work correctly, I can’t find any working examples at http://revox.io/webarch/latest/, plus even on the documentation, the examples don’t work!
http://revox.io/webarch/documentation/helpfile.html#sectionMesssagesNotificationsCan you please help?
Regards, Aaran
Hi there
We have tool tips demo lets
scroll down a bit and on your left side you will see “Tool Tips” heading. These are Boostrap tool tips to get it working simply add
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>
<a href="#" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tool tip </a>adding the following attribute to a link or button helps it
data-toggle="tooltip" data-placement="left" title="Tooltip on left
Thats it!
Further more here is the guide
http://getbootstrap.com/javascript/#tooltipsSo..it works there for me, but not on your documentation pages.
Also, to be a little clearer on my issue, I’m trying to put tooltips on the main menu items in my menu. The tooltips work if the position is set to top, left, or bottom, but not ‘right’. And I want them to appear to the right so that they work fine when the menu is collapsed.
It doesn’t matter if I use inline data attributes:data-position="right"
or if I use the plugin options:
$(function() {
$('ul.menu > li > a').tooltip({
placement: 'right'
});
});
Any ideas?
I can’t show you the code as it’s all local on my machine at present.
Regards, Aaran
Hi there I was able to get it working no need any custom JS code to initialise the boostrap tooltip simply add the class tip and the attributes
like wise to the A tagclass="tip" data-toggle="tooltip" title="Up here!" data-placement="right"
You will be able to see it when the menu is condensed
Aha! so that works perfectly when the menu is collapsed…but not when it’s expanded – what’s the difference here that I’m missing? I want the tooltip to work the same for both the collapsed, and the expanded menu…?
Thanks for this prompt and helpful support by the way!
Hi there
Oh ok, what happens is that the side menu is a fixed element and scroll plugin sets its element overflow:hidden there by the tooltip appears but since the parent content overflow is hidden you will not see it, hope you got what I’m talking about,we can try making it visible but that makes the scroll stop working we might have to find an alternative path for this, ill further look into
Yep, that makes sense. Thanks for the help and will look forward to seeing if you can do anything with it!
Actually, before I forget, I also have another issue, that I can only assume is a fault on my part, but I’m struggling to work out why it’s happening.
The issue is that when the menu is in its collapsed form, the first sub-menu is being automatically displayed and can’t be hidden.
My code is as follows. Can you spot any glaring mistakes?
<ul class="menu">
<li class="leads active">
<a href="#" class="tip" data-toggle="tooltip" title="Up here!" data-placement="right">
<i class="fa fa-users" />
<span class="title">Menu 1</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li class="start">
<a href="javascript:;">
<i class="icon-custom-home" />
<span class="title">Menu 1a</span>
</a>
</li>
<li class="active">
<a href="javascript:;">
<i class="fa fa-search" />
<span class="title">Menu 1b</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li class=""><a href="javascript:;"><span class="title">Menu 1b1</span></a></li>
<li class="active"><a href="javascript:;"><span class="title">Menu 1b2</span></a></li>
</ul>
</li>
<li class="">
<a href="javascript:;">
<i class="fa fa-plus" />
<span class="title">Menu 1c</span>
</a>
</li>
<li class="">
<a href="javascript:;">
<i class="fa fa-archive" />
<span class="title">Menu 1d</span>
</a>
</li>
<li class="">
<a href="javascript:;">
<i class="fa fa-file-text" />
<span class="title">Menu 1e</span>
<span class="arrow" />
</a>
<ul class="sub-menu" style="display:none;">
<li class=""><a href="javascript:;">Menu 1e1</a></li>
<li class=""><a href="javascript:;">Menu 1e2</a></li>
<li class=""><a href="javascript:;">Menu 1e3</a></li>
<li class=""><a href="javascript:;">Menu 1e4</a></li>
</ul>
</li>
<li class="">
<a href="javascript:;">
<i class="fa fa-sitemap" />
<span class="title">Menu 1f</span>
<span class="arrow" />
</a>
<ul class="sub-menu" style="display:none;">
<li class=""><a href="javascript:;">Menu 1f1</a></li>
<li class=""><a href="javascript:;">Menu 1f2</a></li>
<li class=""><a href="javascript:;">Menu 1f3</a></li>
</ul>
</li>
<li class="">
<a href="javascript:;">
<i class="fa fa-download" />
<span class="title">Menu 1g</span>
<span class="arrow" />
</a>
<ul class="sub-menu" style="display:none;">
<li class=""><a href="javascript:;">Menu 1g1</a></li>
<li class=""><a href="javascript:;">Menu 1g2</a></li>
</ul>
</li>
</ul>
</li>
<!-- BEGIN reporting menu -->
<li class="reporting">
<a href="#">
<i class="fa fa-signal" />
<span class="title">Menu 2</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li>
<a href="javascript:;">
<i class="icon-custom-home" />
<span class="title">Menu 2a</span>
</a>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-signal" />
<span class="title">Menu 2b</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 2b1</a></li>
<li><a href="javascript:;">Menu 2b2</a></li>
<li><a href="javascript:;">Menu 2b3</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-upload" />
<span class="title">Menu 2c</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 2c1</a></li>
<li><a href="javascript:;">Menu 2c2</a></li>
</ul>
</li>
</ul>
</li>
<!-- END reporting menu -->
<!-- BEGIN questionnaires menu -->
<li class="questionnaires">
<a href="#">
<i class="fa fa-question" />
<span class="title">Menu 3</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li>
<a href="javascript:;">
<i class="icon-custom-home" />
<span class="title">Menu 3a</span>
</a>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-question" />
<span class="title">Menu 3b</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 3b1</a></li>
<li><a href="javascript:;">Menu 3b2</a></li>
</ul>
</li>
<li><a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 3c</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 3c1</a></li>
<li><a href="javascript:;">Menu 3c2</a></li>
<li><a href="javascript:;">Menu 3c3</a></li>
<li><a href="javascript:;">Menu 3c4</a></li>
<li><a href="javascript:;">Menu 3c5</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 3d</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 3d1</a></li>
<li><a href="javascript:;">Menu 3d2</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 3e</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 3e1</a></li>
<li><a href="javascript:;">Menu 3e2</a></li>
<li><a href="javascript:;">Menu 3e3</a></li>
</ul>
</li>
</ul>
</li>
<!-- END questionnaire menu -->
<!-- BEGIN setup menu -->
<li class="setup">
<a href="#">
<i class="fa fa-wrench" />
<span class="title">Menu 4</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li>
<a href="javascript:;">
<i class="icon-custom-home" />
<span class="title">Menu 4a</span>
</a>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 4b</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 4b1</a></li>
<li><a href="javascript:;">Menu 4b2</a></li>
<li><a href="javascript:;">Menu 4b3</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 4c</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 4c1</a></li>
<li><a href="javascript:;">Menu 4c2</a></li>
<li><a href="javascript:;">Menu 4c3</a></li>
<li><a href="javascript:;">Menu 4c4</a></li>
<li><a href="javascript:;">Menu 4c5</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 4d</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 4d1</a></li>
<li><a href="javascript:;">Menu 4d2</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 4e</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 4e1</a></li>
<li><a href="javascript:;">Menu 4e2</a></li>
<li><a href="javascript:;">Menu 4e3</a></li>
<li><a href="javascript:;">Menu 4e4</a></li>
<li><a href="javascript:;">Menu 4e5</a></li>
<li><a href="javascript:;">Menu 4e6</a></li>
<li><a href="javascript:;">Menu 4e7</a></li>
<li><a href="javascript:;">Menu 4e8</a></li>
<li><a href="javascript:;">Menu 4e9</a></li>
<li><a href="javascript:;">Menu 4e10</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 4f</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 4f1</a></li>
<li><a href="javascript:;">Menu 4f2</a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="fa fa-table" />
<span class="title">Menu 4g</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li><a href="javascript:;">Menu 4g1</a></li>
<li><a href="javascript:;">Menu 4g2</a></li>
<li><a href="javascript:;">Menu 4g3</a></li>
</ul>
</li>
</ul>
</li>
<!-- END setup menu -->
</ul>
<i /> or <span />
This way you will have so many unclosed tags where it will look all crazy
<li class="leads active">
<a href="#" class="tip" data-toggle="tooltip" title="Up here!" data-placement="right">
<i class="fa fa-users" />
<span class="title">Menu 1</span>
<span class="arrow" />
</a>
<ul class="sub-menu">
<li class="start">
<a href="javascript:;">
<i class="icon-custom-home" />
<span class="title">Menu 1a</span>
</a>
</li>
</ul>
</li>
Hi,
my code doesn’t use that shorthand form anywhere, so that must be an automatic formatting issue with the comment system here on ThemeForest….
Any other ideas?
Regards, Aaran
Hi there
Sorry about the late replies, working on something awesome now got some time to breathe yes themeforest comments section is not a good idea to send code, if you can email to support@revox.io I can have a look
Hi.
I have an issue in Chrome 36 (36.0.1985.125 m)
Please, check screenshot below:
How to reproduce: 1. Open the page http://www.revox.io/webarch/HTML/form_validations.html 2. Press Ctrl+R
Little update: if you go to Chrome Inspector and disable “float:right” rule for grid toolbar, and then enable it back, the view becomes correct. Magic…
Hi there Please notice that its not the latest version
http://www.revox.io/webarch/latest/form_validations.htmltry this link to, did a small background research and its small bug in chrome because of a network delay not quite sure but we will migrate to boostrap panels which will solve the case permanently and will try your solution too! Thank you very much
Hi
My Chrome says this version is latest But maybe not.
The link works fine. How can I apply this fix in my code?
Hi there
Sorry I meant the the preview link not the browser, btw we are adding it to Bootstrap panels. This only happens in chrome occasionally with network delay, could you email to support@revox.io
once the boostrap panels are made to webarch we will mail you the code and guide, it will look exactly like webarch portlets
Thanks. I have sent you email.
Got it!
1. How to make the mini sidebar the only sidebar, or toggle between a, NONE b, Mini, c. Big
2. On TOP BAR, We need the logo on the top left with the small/mini sidebar. We are able to see it by editing in INSPECTOR the header-seperation style=”display: box” from none.
However do not know where to edit to make it permanent??
Thank you Thank You<div class="header navbar navbar-inverse "> <div class="navbar-inner"> <div class="header-seperation" style="display: box; height: 61px; </pre> " /></div></div>
TOP BAR similar to: http://revox.io/webarch/latest/index.html#
Hi there
Lets get the first question sorted Im not quite sure whether I got it properly, you want to make the main menu go to mini and normal version and also extended version ?
Sidebar: Yes, you know how the left menu/sidebar how it toggles, we want the default to be minimal, 1st click on larger menu, 2nd click to vanish..and the pattern to repeat. In short, want it to toggle.
And 2nd Q is easy for you just want the logo to stay on the top bar throughout above!
Big Thanks!
Hi ok got it now
First we need to set it to be mini on page default simply add the class
.condense-menu to the body
<body class="condense-menu">
next we need to toggle to work abit different
so you find the HTML code for the three lines, its with the ID layout-condensed-toggle
note you have to remove the ID to remove the default functionality of toggle , once you have removed it the menu will no longer condensed by click. Its good thing
now we need a different function for it lets go with old fashion way of ID functions change the ID to some thing like “custom-menu-toggler”
<a href="#" class="" id="custom-menu-toggler">
<div class="iconset top-menu-toggle-dark" />
</a>
now open up core.js and add this function
$('#custom-menu-toggler').on('click', function () {
if($('body').hasClass('condense-menu')){
$("body").condensMenu();
}
else if($('body').hasClass('hide-sidebar')){
$("body").condensMenu();
}
else{
$("body").toggleMenu();
}
});
Hope you got it
Got it with the LOGO! – after your advice. DIV tag was missing from above.
<a href="#" class="" id="custom-menu-toggler">
<div class="iconset top-menu-toggle-dark"> ** </div> **
</a>
remove ** from above code
H O W E V E R, this seems only valid and working with certain screen size. Want it (the toggle top and menu effect) to stay in all devices/views. What do you recommend – o wise one! Do guide. Thanks!
Greetings, we can send you video screenshots as the above has lots of hiccups. do advice. Thanks
Hi there
Sorry about the delay on replies, working on something awesome just got some time to take a breath and yes that would be great, to support@revox.io
Sent you the email
Could you add a top navigation with a mega menu like this:
http://bigmedved.ru/orb/admin-megamenu.htmlHi there
Thats one huge menu! but will include much more elegant one in the next update
haha awesome
Hi Author.
I’m crazy with your admin template and the frontend design.
But the only with I’m missing on your template is a gantt chart.
There is a not a gantt-chart setup on any admin template on temeforest.
I think there could be very good earnings in a gantt-chart because there is over 165.000 search for gantt charts on google.
Best Regards
Christian Heidemann
Hi there
Thank you very much!
Yes true, will go through some gantt charts 3rd plugins and customize it to webarch design
Do you have an estimated timeframe?
Bump
Hi there
Sorry about the late reply the next update after August 8th as we are launching something really new to themeforest. But if you need the gantt chart in a hurry we could arrange a pre Beta version
Hi Ace. It sounds cool with a beta version of a Gantt design on webarch. The big update August 8th is for webarch…
Best Regards Christian
Can you write a short appetizer for the upcoming features on 8 august…
Hi there
In terms of Webarch, we will add the gantt chart, SCSS updates, form elements updates. But the biggest surprise is to be kept as a surprise we are working day and night to get it on the 8th but might have small change in dates
Awesome design!
Can I use this on my wordpress/woocommerce Admin?
If yes, do I have to know anything about coding? Would I be able to customise the whole admin interface just installing this?
DO you have a documentation on how to install and configure?
best
Hi there
Unfortunately its not a wordpress or wordpress admin theme, it falls in the HTML category where you can convert it to wordpress but keep in mind you need do some work of coding
The break between the table titles and the rest only happens in Chrome and only when there’s a <form element on the site, anywhere. Somehow <form> interferes with it!
Please help, Thanks!
Hi there
This is noted before and happens occasionally, we were thinking of migrating to boostrap panels thats the best way to solve it
This may be a stupid question but I have never played or tried Boostrap yet. If I purchase this theme does it come with the demo layouts i.e can I just upload the files to my test server and learn by going through the code of each page or do I have to build all those admin pages by hand?
i.e would uploading the files I ll get when I buy the theme be enough to have the same pages and look as your demo? Thanks in advance
Hi there
The package contains HTML / CSS / JS and if your going with a rails app then it has HAML/SCSS or LESS. It depends on you requirement and we would always be happy to help you out in the difficulties you face
Greetings! Big Fans of your work!
1) When is the next release coming out?
2) How do we integrate a stripped down version of the portfolio (frontend) into webarch, master template – what is needed. Got it stripped, struggling with integration
3) somewhere you mentioned you are working on a visual layout generator. Is that going to be a part of the upcoming release. Cannot wait!
thanks for your awesome work and business practices. Best Luck
Hi there
Sorry about the late replies, We have no date confirmed yet we are going to focus on new form elements and advance option , the other thing is the theme builder
Theme Builder..Theme Builder..
2) How do we integrate a stripped down version of the portfolio (frontend) into webarch, master template – what is needed. Got it stripped, struggling with integration
Hi there First of all add this code to your core.js or any other custom js file
0){
var $container = $('#thumbs');
$container.isotope({
filter: '*',
animationOptions: {
duration: 750,
easing: 'linear',
queue: false
}
});
$(window).resize(function() {
var $container = $('#thumbs');
$container.isotope({
itemSelector : '.item',
animationOptions: {
duration: 250,
easing: 'linear',
queue: false
}
});
});
// filter items when filter link is clicked
$('#portfolio-nav a, #gallery-nav a').click(function(){
//alert("CLICK")
var selector = $(this).attr('data-filter');
$container.isotope({ filter: selector });
$("#portfolio-nav li, #gallery-nav li").removeClass("current");
$(this).closest("li").addClass("current");
return false;
});
}
$(".portfolio-grid ul li").hover(function(){
var imgHeight=$(this).find("img").height();
$(this).find(".portfolio-image-wrapper").height(imgHeight);
});
After that use the following css its always available on front end style.css
.isotope-item {
z-index: 2;
}
.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1;
}
.isotope,
.isotope .isotope-item {
/* change duration value to whatever you like */
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
-ms-transition-duration: 0.8s;
-o-transition-duration: 0.8s;
transition-duration: 0.8s;
}
.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
-ms-transition-property: height, width;
-o-transition-property: height, width;
transition-property: height, width;
}
.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
-ms-transition-property: -ms-transform, opacity;
-o-transition-property: -o-transform, opacity;
transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
-webkit-transition-duration: 0s;
-moz-transition-duration: 0s;
-ms-transition-duration: 0s;
-o-transition-duration: 0s;
transition-duration: 0s;
}
/* PORTFOLIO */
.portfolio-filter ul{
list-style:none;
margin-left:0;
padding-left:0;
float:right;
}
.portfolio-filter li{
display:inline;
margin-right:20px
}
.portfolio-filter li a{
color:#505458;
}
.portfolio-filter li a:hover{
opacity:0.6
}
.portfolio-grid ul li a.hide {
display: none;
}
.portfolio-grid {
width: 101%;
margin: 0 0 0 -1%;
padding: 0;
float: left;
}
.portfolio-grid ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.portfolio-grid ul li {
float: left;
margin: 0 0 1% 1%;
padding: 0;
}
.portfolio-grid li .project-title {
opacity:0;
font-family: 'Montserrat', sans-serif;
font-weight: bold;
font-size: 14px;
letter-spacing: 1px;
text-transform:uppercase;
margin-bottom:0px;
}
.portfolio-grid li .project-description {
opacity:0;
}
.portfolio-grid li:hover .project-title {
opacity:1;
-webkit-transition: opacity .4s .5s;
-moz-transition: opacity .4s .5s;
-ms-transition: opacity .4s .5s;
-o-transition: opacity .4s .5s;
transition: opacity .3s .5s;
}
.portfolio-grid li:hover .project-description {
opacity:0.9;
-webkit-transition: opacity .4s .8s;
-moz-transition: opacity .4s .8s;
-ms-transition: opacity .4s .8s;
-o-transition: opacity .3s .8s;
transition: opacity .3s .8s;
}
.portfolio-grid li:hover .item-info-overlay{
opacity:1;
transition:all 0.4s ease 0s;
-moz-transition:all 0.4s ease 0s;
-webkit-transition:all 0.4s ease 0s;
-ms-transition:all 0.4s ease 0s;
-o-transition:all 0.4s ease 0s;
}
.isotope-item {
z-index: 1;
}
.isotope-hidden {
z-index: 0;
}
.col2 li {
width: 48.98%;
}
.col3 li {
width: 32.25%;
}
.col4 li {
width: 23.92%;
}
.portfolio-grid ul li img {
float: left;
width: 100%;
}
.portfolio-image-wrapper{
position:relative;
}
.item-info {
float: left;
}
.item-info-overlay a.overlay-link {
height: 100%;
position: absolute;
width: 100%;
z-index: -1;
left: 0;
top: 0;
}
/*--------------------------------------------------
PORTFOLIO THUMBNAIL HOVER
---------------------------------------------------*/
.item-info-overlay {
}
.item-info-overlay {
position:absolute;
left: 0;
top: 0;
width:100%;
height:100%;
opacity:0;
z-index: 120;
background: rgba(10, 166, 153, 0.80);
text-align: center;
}
.item-info-overlay div {
margin: 0 9%;
}
.item-info-overlay h3.title {
margin: 9% 9% 0 9%;
}
.item-info-overlay h3.title, .item-info-overlay h3.title a {
}
.item-info-overlay h3.title a:hover {
color: #fff;
}
.item-info-overlay p {
color: #fff;
}
.item-info-overlay .outline {
box-shadow: 0 0 0 1px #999 inset;
color: #999;
line-height: 16px;
}
.item-info-overlay .outline:hover {
color: #fff;
}
.item-info-overlay .button + .button {
margin-left: 5px;
}
After wards you need to copy the HTML code that is in the Fronted portfolio
thanks cannot wait for your next update. Keep up the good work!
how to close sidebar ?
Hi there Yes you can, you can view the guide here to do that
http://revox.io/webarch/latest/layout_options.htmlor we simply add Add condense-menu class to the body tag
Hello, I purchased your theme and it’s great … Can you tell me if the filter widget that appears within Live Preview is available within the downloaded code base?
I’m referring to filter fly-out menu on the right side of the page, that allows the user to preview different themes and layouts.
Hi there
Its only for demo usage and it use LESS.js to complie the LESS files realtime but if you want to we can send you the code for the demo version, Please send an email to support@revox.io
