forked from saurabh/orbit4-5
update Templates storn & Module storn UI
This commit is contained in:
Ray
parent
d64dc336a5
commit
5f90be20a2
|
|
@ -1,9 +1,9 @@
|
|||
<tr>
|
||||
<td class="detail-row">
|
||||
<h5 class="mt_title"><span><%= design['title'] %></span></h5>
|
||||
<span class="mt_title"><%= design['title'] %></span>
|
||||
</td>
|
||||
<td>
|
||||
<p class="mt_dev"><%= design['author'] %></p>
|
||||
<spna class="mt_dev"><%= design['author'] %></span>
|
||||
</td>
|
||||
<td class="active">
|
||||
<%= radio_button_tag 'design_default', design['key'], (current_site.template && current_site.template.eql?(design['key']) ? true : false), :class => 'design_default toggle-check', :rel => admin_site_change_design_path(:site_id=>current_site.id, :design_key=>design['key']) %>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,10 @@
|
|||
<thead>
|
||||
<tr class="sort-header">
|
||||
<th class="first span4">Templates Title</th>
|
||||
<th class="active span3">Designer</th>
|
||||
<th class="span2">Status</th>
|
||||
<th class="">Templates Title</th>
|
||||
<th class="">Designer</th>
|
||||
<th class="">Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tbody id="tbody_designs" class="sort-holder">
|
||||
<%= render :partial => 'design', :collection => @designs %>
|
||||
</tbody>
|
||||
|
|
@ -4,119 +4,11 @@
|
|||
<%= stylesheet_link_tag "lib/mt-list"%>
|
||||
<%= stylesheet_link_tag "lib/filter"%>
|
||||
<%= stylesheet_link_tag "lib/togglebox"%>
|
||||
<%= stylesheet_link_tag "admin/store"%>
|
||||
|
||||
<%= javascript_include_tag 'lib/footable-0.1' %>
|
||||
<%= javascript_include_tag 'lib/all-list' %>
|
||||
<%= javascript_include_tag 'lib/retina' %>
|
||||
<style type="text/css">
|
||||
.container{
|
||||
/*max-width: 600px;*/
|
||||
}
|
||||
|
||||
.panel{
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #DFDFDF;
|
||||
background: #FFF;
|
||||
box-shadow: 0px 0px 10px #CCC;
|
||||
}
|
||||
|
||||
.break{
|
||||
border-left: 1px solid #FCFCFC;
|
||||
border-right: 1px solid #DDD;
|
||||
padding: 10px 0;
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.panel-heading{
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
padding: 10px 20px;
|
||||
height: 20px;
|
||||
|
||||
background-color: #fafafa;
|
||||
background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
|
||||
background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
|
||||
background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
|
||||
background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
|
||||
*zoom: 1;
|
||||
border-bottom: 1px solid #DDD;
|
||||
}
|
||||
|
||||
.table{
|
||||
margin: 0;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/* .table td, .table th, .table .quick-edit{
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
*/
|
||||
/*.table td img{
|
||||
background: #666;
|
||||
border: 3px solid #AAA;
|
||||
padding: 2px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0px 0px 10px #000 inset;
|
||||
}
|
||||
*/
|
||||
.pannel-body{
|
||||
min-height: 400px;
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.pannel-footer{
|
||||
background: #f2f2f2; /* Old browsers */
|
||||
background: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 76%, #ededed 100%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(76%,#ffffff), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(top, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(top, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* IE10+ */
|
||||
background: linear-gradient(to bottom, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
|
||||
|
||||
border: 1px solid #EEE;
|
||||
border-top: 1px solid #CCC;
|
||||
padding: 10px;
|
||||
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
#apply_change_btn{
|
||||
display: none;
|
||||
}
|
||||
|
||||
#alert_wrap{
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 93%;
|
||||
top: 30%;
|
||||
z-index: 1045;
|
||||
}
|
||||
|
||||
.alert{
|
||||
width: 400px;
|
||||
text-align: center;
|
||||
z-index: 1050;
|
||||
margin: 0 auto;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.modal-backdrop{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.icons-faq:before{ content: "\e086"; }
|
||||
.icons-ask:before { content: "\e062"; }
|
||||
</style>
|
||||
</head>
|
||||
|
||||
|
||||
|
|
@ -129,42 +21,47 @@
|
|||
<%= image_tag("preloader.gif", size: "50") %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container row-fluid">
|
||||
|
||||
<div class="span4">
|
||||
<div class="panel">
|
||||
<div class="panel-heading"><i class="icons-download"></i><span class="break"></span><%= t(:installed_templates) %></div>
|
||||
<div class="pannel-body">
|
||||
<div class="templates-store panel">
|
||||
<div class="panel-heading">
|
||||
<ul>
|
||||
<li class="active">
|
||||
<a href="#installed_templates" data-toggle="tab">
|
||||
<i class="icons-download"></i><%= t(:installed_templates) %>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#template_store" data-toggle="tab">
|
||||
<i class="icon-shopping-cart"></i><%= t(:template_store) %>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="pannel-body tab-content">
|
||||
<div class="tab-pane fade active in" id="installed_templates">
|
||||
<div class="installed-templates-search">
|
||||
<input class="search" type="text" />
|
||||
</div>
|
||||
<div class="pannel-body-inner">
|
||||
<table class="table table-striped">
|
||||
<tbody id="extensions_table">
|
||||
<%= render 'designs' %>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="pannel-footer">
|
||||
<button id="apply_change_btn" onclick="apply_change();" class="btn btn-primary btn-small pull-right">Apply Change</button>
|
||||
</div>
|
||||
<div class="tab-pane fade" id="template_store">
|
||||
<div class="templates-store-search">
|
||||
<input class="search" type="text" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="span8 pull-right">
|
||||
<div class="panel">
|
||||
<div class="panel-heading"><i class="icon-shopping-cart"></i><span class="break"></span><%= t(:template_store) %></div>
|
||||
<div class="pannel-body">
|
||||
<%= render :partial => "admin/store/store", :locals => {:section => "templates"} %>
|
||||
</div>
|
||||
<div class="pannel-footer">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-backdrop"></div>
|
||||
</table>
|
||||
|
||||
<div class="form-actions form-fixed pagination-right">
|
||||
<div class="modal-backdrop"></div>
|
||||
|
||||
<!-- <div class="form-actions form-fixed pagination-right"> -->
|
||||
<%#= link_to content_tag(:i, nil, :class => 'icon-plus icon-white') + t(:upload), upload_package_admin_designs_path, :class => 'btn btn-primary pull-right' %>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
<script type="text/javascript">
|
||||
$(document).on('change', '.design_default', function(){
|
||||
$("#alert_wrap").show();
|
||||
|
|
@ -176,6 +73,4 @@
|
|||
$(".modal-backdrop").hide();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
</script>
|
||||
|
|
@ -4,136 +4,11 @@
|
|||
<%= stylesheet_link_tag "lib/mt-list"%>
|
||||
<%= stylesheet_link_tag "lib/filter"%>
|
||||
<%= stylesheet_link_tag "lib/togglebox"%>
|
||||
<%= stylesheet_link_tag "admin/store"%>
|
||||
|
||||
<%= javascript_include_tag 'lib/footable-0.1' %>
|
||||
<%= javascript_include_tag 'lib/all-list' %>
|
||||
<%= javascript_include_tag 'lib/retina' %>
|
||||
<style type="text/css">
|
||||
.container{
|
||||
/*max-width: 600px;*/
|
||||
}
|
||||
|
||||
.panel{
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #DFDFDF;
|
||||
background: #FFF;
|
||||
box-shadow: 0px 0px 10px #CCC;
|
||||
}
|
||||
|
||||
.break{
|
||||
border-left: 1px solid #FCFCFC;
|
||||
border-right: 1px solid #DDD;
|
||||
padding: 10px 0;
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.panel-heading{
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
padding: 10px 20px;
|
||||
height: 20px;
|
||||
|
||||
background-color: #fafafa;
|
||||
background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
|
||||
background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
|
||||
background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
|
||||
background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
|
||||
*zoom: 1;
|
||||
border-bottom: 1px solid #DDD;
|
||||
}
|
||||
|
||||
.table{
|
||||
margin: 0;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.table td{
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.table td img{
|
||||
background: #666;
|
||||
border: 3px solid #AAA;
|
||||
padding: 2px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0px 0px 10px #000 inset;
|
||||
}
|
||||
|
||||
.pannel-body{
|
||||
min-height: 400px;
|
||||
overflow: scroll;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.pannel-footer{
|
||||
background: #f2f2f2; /* Old browsers */
|
||||
background: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 76%, #ededed 100%); /* FF3.6+ */
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(76%,#ffffff), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
|
||||
background: -webkit-linear-gradient(top, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* Chrome10+,Safari5.1+ */
|
||||
background: -o-linear-gradient(top, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* Opera 11.10+ */
|
||||
background: -ms-linear-gradient(top, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* IE10+ */
|
||||
background: linear-gradient(to bottom, #f2f2f2 0%,#ffffff 76%,#ededed 100%); /* W3C */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
|
||||
|
||||
border: 1px solid #EEE;
|
||||
border-top: 1px solid #CCC;
|
||||
padding: 10px;
|
||||
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
#apply_change_btn{
|
||||
display: none;
|
||||
}
|
||||
|
||||
#alert_wrap{
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 93%;
|
||||
top: 30%;
|
||||
z-index: 1045;
|
||||
}
|
||||
|
||||
.alert{
|
||||
width: 400px;
|
||||
text-align: center;
|
||||
z-index: 1050;
|
||||
margin: 0 auto;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
#delete_confirm_wrap{
|
||||
display: none;
|
||||
position: absolute;
|
||||
width: 93%;
|
||||
top: 30%;
|
||||
z-index: 1045;
|
||||
}
|
||||
|
||||
#delete_confirm_wrap .alert{
|
||||
width: 260px;
|
||||
text-align: left;
|
||||
padding: 20px;
|
||||
font-size: 14px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
.modal-backdrop{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.icons-faq:before{ content: "\e086"; }
|
||||
.icons-ask:before { content: "\e062"; }
|
||||
.icons-survey:before { content: "\e070"; }
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<%= flash[:notice] rescue nil%>
|
||||
|
|
@ -159,31 +34,29 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container row-fluid">
|
||||
|
||||
<div class="span4">
|
||||
<div class="panel">
|
||||
<div class="panel-heading"><i class="icons-download"></i><span class="break"></span><%= t(:installed_modules) %></div>
|
||||
<div class="pannel-body">
|
||||
<table class="table table-striped">
|
||||
<tbody id="extensions_table">
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="module-store panel">
|
||||
<div class="panel-heading">
|
||||
<ul>
|
||||
<li class="active">
|
||||
<a href="#installed_modules" data-toggle="tab">
|
||||
<i class="icons-download"></i><%= t(:installed_modules) %>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#module_store" data-toggle="tab">
|
||||
<i class="icon-shopping-cart"></i><%= t(:module_store) %>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="pannel-footer">
|
||||
<div class="pannel-body tab-content">
|
||||
<div class="tab-pane fade active in" id="installed_modules">
|
||||
<table class="table table-striped"></table>
|
||||
<button id="apply_change_btn" onclick="apply_change();" class="btn btn-primary btn-small pull-right"><%= t(:apply_change) %></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="span8 pull-right">
|
||||
<div class="panel">
|
||||
<div class="panel-heading"><i class="icon-shopping-cart"></i><span class="break"></span><%= t(:module_store) %></div>
|
||||
<div class="pannel-body">
|
||||
<div class="tab-pane fade" id="module_store">
|
||||
<%= render :partial => "admin/store/store", :locals => {:section => "apps"} %>
|
||||
</div>
|
||||
<div class="pannel-footer">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-backdrop"></div>
|
||||
|
|
|
|||
|
|
@ -21,13 +21,14 @@
|
|||
line-height: 20px;
|
||||
}
|
||||
</style>
|
||||
<div id="store-area">
|
||||
<div class="pannel-body-inner">
|
||||
<div class="store-item-list" id="store-area">
|
||||
<div class="loading-store">
|
||||
<%= image_tag("preloader.gif", size: "50") %>
|
||||
<p class="loading-status"></p>
|
||||
<p> Please wait ... </p>
|
||||
</div>
|
||||
<div class="form-area">
|
||||
<div class="form-area"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1 +1,14 @@
|
|||
This is template store.
|
||||
<% 55.times do %>
|
||||
<div class="store-item">
|
||||
<div class="app-pic">
|
||||
<a href="">
|
||||
<%= image_tag("http://fakeimg.pl/80x80/ff0000/ffffff/?text=World&font=lobster") %>
|
||||
</a>
|
||||
</div>
|
||||
<h4 class="app-name">
|
||||
<a href="">App Name</a>
|
||||
</h4>
|
||||
<p class="app-author">Rulingcom</p>
|
||||
<p class="app-category">category</p>
|
||||
</div>
|
||||
<% end %>
|
||||
Loading…
Reference in New Issue