harukin/core
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Pages populate the available-to-export list. New checkbox class for smaller boxes.

Browse Source
This commit is contained in:
Andrew Manning
2016-08-19 19:32:52 -04:00
parent f2e87a204d
commit 40a7d38210
4 changed files with 182 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
view/css/mod_webpages.css
View File

@@ -119,3 +119,77 @@
opacity: 1;
}
/* SQUARED THREE */
.squaredThree {
width: 14px;
height: 14px;
background: #fcfff4;
background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
margin: 5px auto;
-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
position: relative;
}
.squaredThree label {
cursor: pointer;
position: absolute;
width: 10px;
height: 10px;
left: 2px;
top: 2px;
-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
background: -o-linear-gradient(top, #222 0%, #45484d 100%);
background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
background: linear-gradient(top, #222 0%, #45484d 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}
.squaredThree label:after {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
content: '';
position: absolute;
width: 9px;
height: 5px;
background: transparent;
top: 2px;
left: 2px;
border: 3px solid #fcfff4;
border-top: none;
border-right: none;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.squaredThree label:hover::after {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
filter: alpha(opacity=30);
opacity: 0.3;
}
.squaredThree input[type=checkbox]:checked + label:after {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}

42
view/tpl/webpage_export_list.tpl
View File

@@ -9,13 +9,43 @@
<div class="clear"></div>
</div>
<div id="import-website-content-wrapper" class="section-content-wrapper">
<div class="pull-left">
<button id="toggle-select-all" class="btn btn-xs btn-primary" onclick="checkedAll(window.isChecked); return false;"><i class="fa fa-check"></i>&nbsp;Toggle Select All</button>
</div>
<div class="clear"></div>
<div class="pull-left">
<button id="toggle-select-all" class="btn btn-xs btn-primary" onclick="checkedAll(window.isChecked); return false;"><i class="fa fa-check"></i>&nbsp;Toggle Select All</button>
</div>
<div class="clear"></div>
<h4>Pages</h4>
<div>
<table class="table-striped table-responsive table-hover" style="width: 100%;">
<tr><td>Export?</td><td>Page Title</td><td>Page Link</td><td>Type</td></tr>
{{foreach $pages as $page}}
<tr>
<td>
<div class='squaredThree'>
<input type="checkbox" id="page_{{$page.mid}}" name="page[]" value="{{$page.mid}}">
<label for="page_{{$page.mid}}"></label>
</div>
</td>
<td>
<div class='desc'>
{{$page.title}}<br>
</div>
</td>
<td>
<div class='desc'>
{{$page.pagetitle}}<br>
</div>
</td>
<td>
<div class='desc'>
{{$page.mimetype}}<br>
</div>
</td>
</tr>
{{/foreach}}
</table>
</div>
</div>
<div class="clear"></div>
</form>
</div>