added theme metallic for slider
This commit is contained in:
parent
b1ad108123
commit
0ab5ab468f
BIN
app/assets/images/anythingslider/arrows-metallic.png
Normal file
BIN
app/assets/images/anythingslider/arrows-metallic.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
BIN
app/assets/images/anythingslider/arrows-minimalist.png
Normal file
BIN
app/assets/images/anythingslider/arrows-minimalist.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 5.5 KiB |
BIN
app/assets/images/anythingslider/construction.gif
Normal file
BIN
app/assets/images/anythingslider/construction.gif
Normal file
Binary file not shown.
After Width: | Height: | Size: 21 KiB |
BIN
app/assets/images/anythingslider/cs-portfolio.png
Normal file
BIN
app/assets/images/anythingslider/cs-portfolio.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 12 KiB |
BIN
app/assets/images/anythingslider/default.png
Normal file
BIN
app/assets/images/anythingslider/default.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 15 KiB |
|
@ -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');
|
||||
});
|
||||
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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}"
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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")
|
||||
|
|
|
@ -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 */
|
||||
|
|
3
vendor/assets/javascripts/jquery.noisy.min.js
vendored
Normal file
3
vendor/assets/javascripts/jquery.noisy.min.js
vendored
Normal 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);
|
Loading…
Reference in a new issue