Browse Source

Ad lightbox

Add lightbox as an inline image handling.
pull/31/merge
Danang Probo Sayekti 11 years ago
parent
commit
6a7c090a68
11 changed files with 248 additions and 7 deletions
  1. +2
    -0
      config/users/username.ini.example
  2. +5
    -1
      system/includes/functions.php
  3. +15
    -0
      system/plugins/lightbox/README.md
  4. +207
    -0
      system/plugins/lightbox/css/lightbox.css
  5. BIN
      system/plugins/lightbox/img/close.png
  6. BIN
      system/plugins/lightbox/img/loading.gif
  7. BIN
      system/plugins/lightbox/img/next.png
  8. BIN
      system/plugins/lightbox/img/prev.png
  9. +1
    -0
      system/plugins/lightbox/js/lightbox-2.6.min.js
  10. +10
    -0
      system/resources/htmly.js
  11. +8
    -6
      themes/logs/css/style.css

+ 2
- 0
config/users/username.ini.example View File

@ -1,3 +1,5 @@
;Password
password = yourpassword
;Role
role = admin

+ 5
- 1
system/includes/functions.php View File

@ -1384,7 +1384,11 @@ function head_contents($title, $description, $canonical) {
$sitemap = '<link rel="sitemap" href="' . site_url() . 'sitemap.xml" />';
$canonical = '<link rel="canonical" href="' . $canonical . '" />';
$feed = '<link rel="alternate" type="application/rss+xml" title="'. blog_title() .' Feed" href="' . site_url() . 'feed/rss" />';
$output .= $title ."\n". $favicon ."\n". $charset ."\n". $generator ."\n". $xua ."\n". $viewport ."\n". $description ."\n". $sitemap ."\n". $canonical ."\n". $feed ."\n";
$lightboxcss = '<link href="' . site_url() . 'system/plugins/lightbox/css/lightbox.css" rel="stylesheet" />';
$jquery = '<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>';
$lightbox = '<script src="' . site_url() . 'system/plugins/lightbox/js/lightbox-2.6.min.js"></script>';
$corejs = '<script src="' . site_url() . 'system/resources/htmly.js"></script>';
$output .= $title ."\n". $favicon ."\n". $charset ."\n". $generator ."\n". $xua ."\n". $viewport ."\n". $description ."\n". $sitemap ."\n". $canonical ."\n". $feed ."\n". $lightboxcss ."\n". $jquery ."\n". $lightbox ."\n" .$corejs ."\n";
return $output;
}


+ 15
- 0
system/plugins/lightbox/README.md View File

@ -0,0 +1,15 @@
## Lightbox2
by Lokesh Dhakar | [lokeshdhakar.com](http://www.lokeshdhakar.com) | [twitter.com/lokesh](http://twitter.com/lokesh)
### Information and support
For examples, downloads, and information on using Lightbox, visit the Lightbox2 homepage:
[http://lokeshdhakar.com/projects/lightbox2/](http://lokeshdhakar.com/projects/lightbox2/)
For personal support issues and feature requests, visit the Lightbox forums:
[http://lokeshdhakar.com/forums/](http://lokeshdhakar.com/forums/)
### License
Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
* Free for use in both personal and commercial projects.
* Attribution requires leaving author name, author homepage link, and the license info intact.

+ 207
- 0
system/plugins/lightbox/css/lightbox.css View File

@ -0,0 +1,207 @@
/* line 7, ../sass/lightbox.sass */
body:after {
content: url(../img/close.png) url(../img/loading.gif) url(../img/prev.png) url(../img/next.png);
display: none;
}
/* line 11, ../sass/lightbox.sass */
.lightboxOverlay {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
background-color: black;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
opacity: 0.8;
display: none;
}
/* line 20, ../sass/lightbox.sass */
.lightbox {
position: absolute;
left: 0;
width: 100%;
z-index: 10000;
text-align: center;
line-height: 0;
font-weight: normal;
}
/* line 28, ../sass/lightbox.sass */
.lightbox .lb-image {
display: block;
height: auto;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
}
/* line 32, ../sass/lightbox.sass */
.lightbox a img {
border: none;
}
/* line 35, ../sass/lightbox.sass */
.lb-outerContainer {
position: relative;
background-color: white;
*zoom: 1;
width: 250px;
height: 250px;
margin: 0 auto;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
}
/* line 38, ../../../../.rvm/gems/ruby-1.9.3-p392/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.lb-outerContainer:after {
content: "";
display: table;
clear: both;
}
/* line 44, ../sass/lightbox.sass */
.lb-container {
padding: 4px;
}
/* line 47, ../sass/lightbox.sass */
.lb-loader {
position: absolute;
top: 43%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
/* line 56, ../sass/lightbox.sass */
.lb-cancel {
display: block;
width: 32px;
height: 32px;
margin: 0 auto;
background: url(../img/loading.gif) no-repeat;
}
/* line 63, ../sass/lightbox.sass */
.lb-nav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
/* line 71, ../sass/lightbox.sass */
.lb-container > .nav {
left: 0;
}
/* line 74, ../sass/lightbox.sass */
.lb-nav a {
outline: none;
}
/* line 77, ../sass/lightbox.sass */
.lb-prev, .lb-next {
width: 49%;
height: 100%;
cursor: pointer;
/* Trick IE into showing hover */
display: block;
}
/* line 84, ../sass/lightbox.sass */
.lb-prev {
left: 0;
float: left;
}
/* line 87, ../sass/lightbox.sass */
.lb-prev:hover {
background: url(../img/prev.png) left 48% no-repeat;
}
/* line 90, ../sass/lightbox.sass */
.lb-next {
right: 0;
float: right;
}
/* line 93, ../sass/lightbox.sass */
.lb-next:hover {
background: url(../img/next.png) right 48% no-repeat;
}
/* line 96, ../sass/lightbox.sass */
.lb-dataContainer {
margin: 0 auto;
padding-top: 5px;
*zoom: 1;
width: 100%;
-moz-border-radius-bottomleft: 4px;
-webkit-border-bottom-left-radius: 4px;
border-bottom-left-radius: 4px;
-moz-border-radius-bottomright: 4px;
-webkit-border-bottom-right-radius: 4px;
border-bottom-right-radius: 4px;
}
/* line 38, ../../../../.rvm/gems/ruby-1.9.3-p392/gems/compass-0.12.2/frameworks/compass/stylesheets/compass/utilities/general/_clearfix.scss */
.lb-dataContainer:after {
content: "";
display: table;
clear: both;
}
/* line 103, ../sass/lightbox.sass */
.lb-data {
padding: 0 4px;
color: #bbbbbb;
}
/* line 106, ../sass/lightbox.sass */
.lb-data .lb-details {
width: 85%;
float: left;
text-align: left;
line-height: 1.1em;
}
/* line 111, ../sass/lightbox.sass */
.lb-data .lb-caption {
font-size: 13px;
font-weight: bold;
line-height: 1em;
}
/* line 115, ../sass/lightbox.sass */
.lb-data .lb-number {
display: block;
clear: left;
padding-bottom: 1em;
font-size: 12px;
color: #999999;
}
/* line 121, ../sass/lightbox.sass */
.lb-data .lb-close {
display: block;
float: right;
width: 30px;
height: 30px;
background: url(../img/close.png) top right no-repeat;
text-align: right;
outline: none;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
opacity: 0.7;
}
/* line 130, ../sass/lightbox.sass */
.lb-data .lb-close:hover {
cursor: pointer;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
/* fix image preview */
.lb-image {
max-width: inherit!important;
}

BIN
system/plugins/lightbox/img/close.png View File

Before After
Width: 27  |  Height: 27  |  Size: 280 B

BIN
system/plugins/lightbox/img/loading.gif View File

Before After
Width: 32  |  Height: 32  |  Size: 8.3 KiB

BIN
system/plugins/lightbox/img/next.png View File

Before After
Width: 50  |  Height: 45  |  Size: 1.3 KiB

BIN
system/plugins/lightbox/img/prev.png View File

Before After
Width: 50  |  Height: 45  |  Size: 1.3 KiB

+ 1
- 0
system/plugins/lightbox/js/lightbox-2.6.min.js
File diff suppressed because it is too large
View File


+ 10
- 0
system/resources/htmly.js View File

@ -0,0 +1,10 @@
(function ($) {
$(document).ready(function() {
$('.post-teaser img, .post-body img').each(function() {
var currentImage = $(this);
currentImage.wrap("<a class='img-wrap' title='" + currentImage.attr("alt") + "' data-lightbox='lightbox' href='" + currentImage.attr("src") + "'></a>");
});
});
})(jQuery);

+ 8
- 6
themes/logs/css/style.css View File

@ -12,7 +12,7 @@ body {
line-height: 1.6em;
font-family: Georgia, sans-serif;
background: #F7F7F7;
color: #44444;
color: #444444;
}
section, footer, header, aside, nav{
@ -70,7 +70,6 @@ h6 {
--------------------------*/
#cover {
padding: 0 0 20px 0;
float:left;
width:100%;
@ -114,7 +113,6 @@ h6 {
Link
--------------------------*/
a {
color: #21759B;
text-decoration: none;
@ -545,13 +543,13 @@ ul li, ol li{
.border #disqus_thread {
padding-top: 1.2em;
}
#disqus_thread {
float: left;
font-family: Georgia,Times,Cambria,serif;
width: 100%;
}
/*-------------------------
Sidebar
--------------------------*/
@ -562,7 +560,7 @@ ul li, ol li{
height:100%;
width: 200px;
font-size:15px;
line-height: 1.5;
line-height: 1.4;
}
#sidebar h2, #sidebar h3, #sidebar h4 {
@ -579,13 +577,17 @@ ul li, ol li{
}
#sidebar .archivegroup ul.month {
margin-left:1.3em;
margin: 0.25em 0 0.25em 1.3em;
}
#sidebar .archivegroup ul.month li {
margin:0;
}
.archivegroup li.expanded, .archivegroup li.collapsed {
margin:0;
}
.about, .social, .archive, .comments, .tagcloud {
margin-bottom:2em;
}


Loading…
Cancel
Save