added theme metallic for slider

master
Alexander Negoda 2012-07-27 03:08:25 +04:00
parent b1ad108123
commit 0ab5ab468f
12 changed files with 152 additions and 13 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

View File

@ -7,6 +7,7 @@
//= require jquery
//= require jquery_ujs
//= require jquery.easing.1.3
//= require jquery.noisy.min
//= require twitter/bootstrap
//= require plupload
//= require jquery.plupload.queue
@ -17,3 +18,15 @@
//= require plupload.gears
//= require plupload.browserplus
//= require_tree .
$(document).ready(function () {
$('body').noisy({
'intensity':10,
'size':200,
'opacity':0.320,
'fallback':'',
'monochrome':false
}).css('background-color', '#fefefe');
});

View File

@ -5,6 +5,129 @@
*= require bootstrap_and_overrides
*/
*{
text-shadow: 1px 1px 1px #fff;
/*text-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 0 30px rgba(255, 255, 255, 0.125);*/
font-family: 'Nunito', 'Istok Web', sans-serif;
color: #959494;
}
body {
padding-top: 90px;
padding-bottom: 40px;
}
h1, h2, h3, h4, h5, h6 {
color: #666;
}
.navbar-inner {
background-color: #FAFAFA;
background-image: -moz-linear-gradient(center top, #FAFAFA, #EAEAEA);
background-image: -ms-linear-gradient(center top, #FAFAFA, #EAEAEA);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FAFAFA), to(#EAEAEA));
background-image: -webkit-linear-gradient(center top, #FAFAFA, #EAEAEA);
background-image: -o-linear-gradient(center top, #FAFAFA, #EAEAEA);
background-image: linear-gradient(top, #FAFAFA, #EAEAEA);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#FAFAFA', endColorstr = '#EAEAEA', GradientType = 0);
}
.navbar .brand {
color: #000;
font-weight: bold;
padding-bottom: 5px;
/*text-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 0 30px rgba(255, 255, 255, 0.125);*/
}
navbar .nav .dropdown-toggle .caret, .navbar .nav .open.dropdown .caret {
border-top-color: #000000;
}
.navbar .nav {
margin-top: 15px;
}
.navbar .nav > li {
padding-right: 5px;
}
.navbar .nav .divider-vertical {
padding: 0;
height: 61px;
}
.navbar .nav > li > a {
color: #333333;
font-size: 18px;
}
.navbar .nav > li > a:hover {
background-color: #FAFAFA;
color: #7B7B7B;
border: 0px solid #C9C9C9;
border-radius: 5px 5px 5px 5px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 0px rgba(255, 255, 255, 0.75);
-moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 0px rgba(255, 255, 255, 0.75);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 0px rgba(255, 255, 255, 0.75);
transition: none;
}
.navbar .nav .active > a, .navbar .nav .active > a:hover {
background-color: #FAFAFA;
color: #7B7B7B;
border: 0;
border-radius: 5px 5px 5px 5px;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 0px rgba(255, 255, 255, 0.75);
transition: none;
}
.navbar .nav .open > .dropdown-toggle, .navbar .nav .active > .dropdown-toggle, .navbar .nav .open.active > .dropdown-toggle {
background-color: #FAFAFA;
color: #7B7B7B;
}
.navbar .nav .active > .dropdown-toggle:hover {
color: #7B7B7B;
}
.navbar-search {
margin-top: 15px;
}
.navbar-search .search-query {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 15px;
font-weight: normal;
line-height: 1.2;
color: #333;
background: #666;
background: rgba(255, 255, 255, 0.3);
border: 0;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 0px rgba(255, 255, 255, 0.75);
transition: none;
}
.navbar-search .search-query :-moz-placeholder {
color: #666;
}
.navbar-search .search-query::-webkit-input-placeholder {
color: #666;
}
.navbar-search .search-query:hover {
color: #333;
background-color: #999999;
background-color: rgba(255, 255, 255, 0.5);
}
.navbar-search .search-query:focus, .navbar-search .search-query.focused {
padding: 5px 10px;
color: #333333;
text-shadow: 0 1px 0 #ffffff;
background-color: #ffffff;
border: 0;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
outline: 0;
}
.ajaxful-rating-wrapper{
float: right;
}

View File

@ -5,6 +5,7 @@ class FileUploader < CarrierWave::Uploader::Base
@@generate_file_name = ''
@@original_filename = ''
# Include RMagick or ImageScience support
# include CarrierWave::RMagick
# include CarrierWave::ImageScience
@ -71,7 +72,7 @@ class FileUploader < CarrierWave::Uploader::Base
# Below 767px viewports, the columns become fluid and stack vertically.
version :middle do
process :resize_to_fit => [724, 500]
process :resize_to_fill => [742, 500]
def store_dir
ENV['STORAGE_PATH'] + "/thumbs/#{model.album.path}/#{model.id}"
@ -79,7 +80,7 @@ class FileUploader < CarrierWave::Uploader::Base
end
version :large do
process :resize_to_fit => [940, 500]
process :resize_to_fill => [940, 600]
def store_dir
ENV['STORAGE_PATH'] + "/thumbs/#{model.album.path}/#{model.id}"
@ -87,7 +88,7 @@ class FileUploader < CarrierWave::Uploader::Base
end
version :largest do
process :resize_to_fit => [1170, 500]
process :resize_to_fill => [1170, 600]
def store_dir
ENV['STORAGE_PATH'] + "/thumbs/#{model.album.path}/#{model.id}"

View File

@ -1,14 +1,14 @@
<%= content_for :head do %>
<%= stylesheet_link_tag "anythingslider/anythingslider" %>
<%= stylesheet_link_tag "anythingslider/anythingslider", "anythingslider/theme-metallic", "anythingslider/animate" %>
<%= javascript_include_tag "anythingslider/jquery.anythingslider.min" %>
<script>
$(function () {
$('#home-slider').anythingSlider({
// theme:'metallic',
expand:true,
theme:'metallic',
// expand:true,
//resizeContents: false,
autoPlay:true
autoPlay:false
});
@ -17,12 +17,11 @@
<style type="text/css">
#home-slider {
height: 1000px;
height: 600px;
}
.slider-wrapper {
width: 100%;
height: 1000px;
margin: 0 auto;
margin-bottom: 20px;
}
@ -32,7 +31,7 @@
<div class="span12 slider-wrapper">
<ul id="home-slider">
<% @popular_photos.each do |photo| %>
<li><%= image_tag photo.attachment.large.url %></li>
<li><%= image_tag photo.attachment.largest.url %></li>
<% end %>
</ul>
</div>

View File

@ -62,7 +62,7 @@ Photo.blueprint {
public { true }
attachment {
file_name = ::SecureRandom.hex(8)
file = open("http://lorempixel.com/1300/1000/people/")
file = open("http://lorempixel.com/1170/600/people/")
if file.kind_of? Tempfile
name = File.basename(file.path)
FileUtils.move(file.path, "#{Rails.root}/tmp/attachments/#{name}.jpeg")

View File

@ -34,7 +34,7 @@
}
/* Navigation buttons + start/stop button, default state */
.anythingSlider-metallic .anythingControls a {
background: transparent url(../images/arrows-metallic.png) -68px -40px repeat-x;
background: transparent url(/assets/anythingslider/arrows-metallic.png) -68px -40px repeat-x;
color: #000;
border: #000 1px solid;
border-radius: 5px;
@ -130,7 +130,7 @@
margin: -47.5px 0 0 0; /* half height of image */
text-align: center;
outline: 0;
background: url(../images/arrows-metallic.png) no-repeat;
background: url(/assets/anythingslider/arrows-metallic.png) no-repeat;
}
/* back arrow */

View File

@ -0,0 +1,3 @@
(function(c){c.fn.noisy=function(b){b=c.extend({},c.fn.noisy.defaults,b);var d,a;if(JSON&&localStorage.getItem)a=localStorage.getItem(JSON.stringify(b));if(a)d=a;else{a=document.createElement("canvas");if(a.getContext){a.width=a.height=b.size;for(var h=a.getContext("2d"),e=h.createImageData(a.width,a.height),i=b.intensity*Math.pow(b.size,2),j=255*b.opacity;i--;){var f=(~~(Math.random()*a.width)+~~(Math.random()*a.height)*e.width)*4,g=i%255;e.data[f]=g;e.data[f+1]=b.monochrome?g:~~(Math.random()*255);
e.data[f+2]=b.monochrome?g:~~(Math.random()*255);e.data[f+3]=~~(Math.random()*j)}h.putImageData(e,0,0);d=a.toDataURL("image/png");if(d.indexOf("data:image/png")!=0||c.browser.msie&&c.browser.version.substr(0,1)<9&&d.length>32768)d=b.fallback}else d=b.fallback;JSON&&localStorage&&localStorage.setItem(JSON.stringify(b),d)}return this.each(function(){c(this).css("background-image","url('"+d+"'),"+c(this).css("background-image"))})};c.fn.noisy.defaults={intensity:0.9,size:200,opacity:0.08,fallback:"",
monochrome:false}})(jQuery);