Skip to content
Browse files

MOVED UPSTREAM!

  • Loading branch information...
1 parent 781fbe6 commit c5aed4ac13235af3dd2e8b3b0b676464732899ec Dean Sofer committed Aug 25, 2012
Showing with 2 additions and 12,866 deletions.
  1. +2 −10 README.textile
  2. +0 −406 css/LESS/anythingslider.less
  3. +0 −374 css/LESS/theme-construction.less
  4. +0 −365 css/LESS/theme-cs-portfolio.less
  5. +0 −410 css/LESS/theme-metallic.less
  6. +0 −406 css/LESS/theme-minimalist-round.less
  7. +0 −405 css/LESS/theme-minimalist-square.less
  8. +0 −3,813 css/animate.css
  9. +0 −291 css/anythingslider.css
  10. +0 −299 css/theme-construction.css
  11. +0 −277 css/theme-cs-portfolio.css
  12. +0 −313 css/theme-metallic.css
  13. +0 −311 css/theme-minimalist-round.css
  14. +0 −309 css/theme-minimalist-square.css
  15. +0 −130 css3.html
  16. +0 −743 demos.html
  17. BIN demos/colorbox/border.png
  18. +0 −62 demos/colorbox/colorbox.css
  19. BIN demos/colorbox/controls.png
  20. BIN demos/colorbox/internet_explorer/borderBottomCenter.png
  21. BIN demos/colorbox/internet_explorer/borderBottomLeft.png
  22. BIN demos/colorbox/internet_explorer/borderBottomRight.png
  23. BIN demos/colorbox/internet_explorer/borderMiddleLeft.png
  24. BIN demos/colorbox/internet_explorer/borderMiddleRight.png
  25. BIN demos/colorbox/internet_explorer/borderTopCenter.png
  26. BIN demos/colorbox/internet_explorer/borderTopLeft.png
  27. BIN demos/colorbox/internet_explorer/borderTopRight.png
  28. +0 −4 demos/colorbox/jquery.colorbox-min.js
  29. +0 −769 demos/colorbox/jquery.colorbox.js
  30. BIN demos/colorbox/loading.gif
  31. BIN demos/colorbox/loading_background.png
  32. BIN demos/colorbox/overlay.png
  33. +0 −178 demos/css/page.css
  34. BIN demos/images/251356.jpg
  35. BIN demos/images/apple-touch-icon.png
  36. BIN demos/images/favicon.ico
  37. BIN demos/images/slide-civil-1.jpg
  38. BIN demos/images/slide-civil-2.jpg
  39. BIN demos/images/slide-env-1.jpg
  40. BIN demos/images/slide-env-2.jpg
  41. BIN demos/images/slide-tele-1.jpg
  42. BIN demos/images/slide-tele-2.jpg
  43. BIN demos/images/th-slide-civil-1.jpg
  44. BIN demos/images/th-slide-civil-2.jpg
  45. BIN demos/images/th-slide-env-1.jpg
  46. BIN demos/images/th-slide-env-2.jpg
  47. +0 −42 demos/js/css3demo.js
  48. +0 −135 demos/js/demo.js
  49. +0 −11 demos/js/jquery.jatt.min.js
  50. BIN demos/video/movie.mp4
  51. BIN demos/video/movie.ogg
  52. BIN demos/video/movie.webm
  53. +0 −95 expand.html
  54. BIN images/arrows-metallic.png
  55. BIN images/arrows-minimalist.png
  56. BIN images/construction.gif
  57. BIN images/cs-portfolio.png
  58. BIN images/default.png
  59. +0 −423 index.html
  60. +0 −188 js/jquery.anythingslider.fx.js
  61. +0 −6 js/jquery.anythingslider.fx.min.js
  62. +0 −916 js/jquery.anythingslider.js
  63. +0 −6 js/jquery.anythingslider.min.js
  64. +0 −379 js/jquery.anythingslider.video.js
  65. +0 −8 js/jquery.anythingslider.video.min.js
  66. +0 −140 js/jquery.easing.1.2.js
  67. +0 −4 js/jquery.min.js
  68. +0 −4 js/swfobject.js
  69. +0 −165 license.txt
  70. +0 −45 package.json
  71. +0 −76 simple.html
  72. +0 −348 video.html
View
12 README.textile
@@ -1,13 +1,5 @@
h1. AnythingSlider jQuery Plugin
-*Just what the world needs, another jQuery slider. YAWN.* I know, check this one out though, it’s got lots of cool features.
+*Moved Up Stream!*
-Here on CSS-Tricks, I’ve created a number of different sliders. Three, in fact. A "“featured content”":http://css-tricks.com/creating-a-slick-auto-playing-featured-content-slider/ slider, a "“start/stop slider”":http://css-tricks.com/startstop-slider/, and "“moving boxes”":http://css-tricks.com/moving-boxes/. Each of them had some cool interesting feature that I needed to build at the time. All were well-received, but as is the case with these things, people want them to do X, Y, and Z in addition to what they already did.
-
-This new AnythingSlider is an attempt at bringing together the functionality of all of those previous sliders and adding new features. In other words, to create a really “full featured” slider that could be widely useful. This is the first time (on CSS-Tricks) that one of these sliders is an actual plugin as well, which should make implementing it and customizing it much easier.
-
-* "Documentation Wiki":https://github.com/ProLoser/AnythingSlider/wiki
-* "Keep Reading":http://css-tricks.com/anythingslider-1-4/
-* "Main Demo":http://proloser.github.com/AnythingSlider/
-* "More Demos":https://github.com/ProLoser/AnythingSlider/wiki
-* Having an issue? Submit it "here":https://github.com/ProLoser/AnythingSlider/issues
+Yes it's finally been relocated to it's rightful home in the CSS-Tricks organization
View
406 css/LESS/anythingslider.less
@@ -1,406 +0,0 @@
-/*
- AnythingSlider v1.8+ LESS Default theme
- By Rob Garrison, based on default anythingslider.css
-*/
-
-/*****************************
-SET DEFAULT DIMENSIONS HERE
-*****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/* slider borders */
-@slider-border-size : 3px;
-@inactive-border-color : #777;
-@active-border-color : #7C9127;
-
-/* current navigation tab styling - uses same navigation background image */
-@inactive-background-current : #888;
-@active-background-current : #7C9127;
-@navigation-text-color-current : #000;
-
-/* non-current navigation styling */
-@inactive-background-tab : #777;
-@active-background-tab : #7C9127;
-@navigation-text-color : #000;
-.navigation-text-styling {
- font: 11px/18px Georgia, Serif;
- height: 18px;
- padding: 2px 8px;
- margin: 0 5px 0 0;
-}
-.navigation-border (@radius: 0 0 5px 5px) {
- border-radius: @radius;
- -moz-border-radius: @radius;
- -webkit-border-radius: @radius;
-}
-.navigation-background {
- /* top shadow */
- background: url(../images/default.png) center -288px repeat-x;
-}
-.navigation-background-hovered {
- background-image: none;
-}
-
-/* start-stop button background color */
-@inactive-start-stop-stopped : #040;
-@inactive-start-stop-playing : #800;
-@active-start-stop-stopped : #080;
-@active-start-stop-playing : #d00;
-
-/* start-stop button text */
-@inactive-start-stop-text : #ddd;
-@active-start-stop-text : #fff;
-@active-start-stop-text-hover : #fff;
-
-/* navigation arrows */
-@arrow-width : 45px;
-@arrow-height : 140px;
-@arrow-image : url(../images/default.png);
-@arrow-back-position : left top;
-@arrow-back-position-hovered : left -140px;
-@arrow-forward-position : right top;
-@arrow-forward-position-hovered: right -140px;
-@arrow-horizontal-pad : 45px; /* distance the arrow protrudes horizontally outside of the AnythingSlider wrapper */
-@navigation-bottom-pad : 28px; /* distance the navigation controls (tabs & start-stop button) protrudes below the wrapper */
-
-.anythingSlider-default {
- /*
- =================================
- Default state (no keyboard focus)
- =================================
- */
- /* Overall Wrapper */
- margin: 0 auto;
- padding: 0 @arrow-horizontal-pad @navigation-bottom-pad @arrow-horizontal-pad;
-
- /* slider window - top & bottom borders, default state */
- .anythingWindow {
- border-top: @slider-border-size solid @inactive-border-color;
- border-bottom: @slider-border-size solid @inactive-border-color;
- }
-
- /* Navigation buttons + start/stop button, default state */
- .anythingControls a {
- .navigation-background; /* top shadow */
- background-color: @inactive-background-tab;
- color: @navigation-text-color;
- .navigation-border;
-
- /* Make sure navigation text is visible */
- span {
- visibility: visible;
- }
-
- /* Navigation current button, default state */
- &.cur {
- background: @inactive-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, default state */
- &.start-stop {
- background-color: @inactive-start-stop-stopped;
- color: @inactive-start-stop-text;
-
- /* start-stop button, playing, default state */
- &.playing { background-color: @inactive-start-stop-playing; }
-
- /* start-stop button, default hovered text color (when visible) */
- /* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
- &:hover, &.hover, .anythingControls ul a:hover {
- color: @active-start-stop-text-hover;
- .navigation-background-hovered;
- }
- }
-
- }
-
- /*
- =================================
- Active State (has keyboard focus)
- =================================
- */
- &.activeSlider {
-
- /* slider window - top & bottom borders, active state */
- .anythingWindow {
- border-color: @active-border-color;
- }
-
- /* Navigation buttons, active state */
- .anythingControls a {
- /* background image = top shadow */
- background-color: @active-background-tab;
-
- /* Navigation current & hovered button, active state */
- &.cur, &:hover {
- /* background image removed */
- background: @active-background-current;
- }
-
- /* start-stop button, stopped, active state */
- &.start-stop {
- background-color: @active-start-stop-stopped;
- color: @active-start-stop-text;
-
- /* start-stop button, playing, active state */
- &.playing {
- color: @active-start-stop-text;
- background-color: @active-start-stop-playing;
- }
-
- }
-
- }
-
- /* start-stop button, active slider hovered text color (when visible) */
- .start-stop:hover, .start-stop.hover {
- color: @active-start-stop-text-hover;
- }
-
- }
-
- /************************
- NAVIGATION POSITIONING
- ************************/
- /* Navigation Arrows */
- .arrow {
- top: 50%;
- position: absolute;
- display: block;
-
- a {
- display: block;
- width: @arrow-width;
- height: @arrow-height;
- margin: -@arrow-height/2 0 0 0; /* half height of image */
- text-align: center;
- outline: 0;
- background: @arrow-image no-repeat;
- }
-
- }
-
- /* back arrow */
- .back {
- left: 0;
-
- a { background-position: @arrow-back-position; }
- a:hover, a.hover { background-position: @arrow-back-position-hovered; }
-
- }
-
- /* forward arrow */
- .forward {
- right: 0;
-
- a { background-position: @arrow-forward-position; }
- a:hover, a.hover { background-position: @arrow-forward-position-hovered; }
-
- }
-
- /* Navigation Links */
- .anythingControls {
-
- outline: 0;
- display: none;
-
- ul {
- margin: 0;
- padding: 0;
- float: left;
-
- li {
- margin: 0;
- display: inline;
- }
-
- a {
- .navigation-text-styling;
- display: inline-block;
- text-decoration: none;
- text-align: center;
- outline: 0;
- }
-
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- overflow: hidden;
- float: left;
- }
-
- /* Autoplay Start/Stop button */
- .start-stop {
- padding: 2px 5px;
- width: 40px;
- text-align: center;
- text-decoration: none;
- float: right;
- z-index: 100;
- outline: 0;
- }
-
- }
-
-}
-
-/***********************
-IE8 AND OLDER STYLING
-***********************/
-.as-oldie .anythingSlider-default {
-
- /* Navigation Arrows */
- .arrow {
- top: 35%;
-
- a {
- margin: 0;
- }
-
- }
-
- /* margin between nav buttons just looks better */
- .anythingControls {
- li {
- margin-left: 3px;
- }
-
- /* When using the navigationSize option, the side margins need to be zero
- None of the navigation panels look good in IE7 now =( */
- a {
- margin: 0;
- }
-
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- margin: 0 2px;
- }
-
- .anythingNavWindow li {
- padding: 3px 0 0 0;
- }
-
-}
-
-/***********************
-COMMON SLIDER STYLING
-***********************/
-/* Overall Wrapper */
-.anythingSlider {
-
- display: block;
- overflow: visible !important;
- position: relative;
-
- /* anythingSlider viewport window */
- .anythingWindow {
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
- }
-
- /* anythingSlider base (original element) */
- .anythingBase {
- background: transparent;
- list-style: none;
- position: absolute;
- overflow: visible !important;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- }
-
- /* Navigation arrow text; indent moved to span inside "a", for IE7;
- apparently, a negative text-indent on an "a" link moves the link as well as the text */
- .arrow span {
- display: block;
- visibility: hidden;
- }
-
- /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
- .arrow.disabled {
- display: none;
- }
-
- /* all panels inside the slider; horizontal mode */
- .panel {
- background: transparent;
- display: block;
- overflow: hidden;
- float: left;
- padding: 0;
- margin: 0;
- }
-
- /* vertical mode */
- .vertical .panel {
- float: none;
- }
-
- /* fade mode */
- .fade {
- .panel {
- float: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
-
- .activePage {
- z-index: 0;
- }
- }
-
- /***********************
- RTL STYLING
- ***********************/
- /* slider autoplay right-to-left, reverse order of nav links to look better */
- &.rtl {
-
- .anythingWindow {
- direction: ltr;
- unicode-bidi: bidi-override;
- }
-
- /* move nav link group to left */
- .anythingControls ul {
- float: left;
-
- /* reverse order of nav links */
- a { float: right; }
- }
-
- /* move start/stop button - in case you want to switch sides */
- .start-stop {
- /* float: right; */
- }
-
- }
-
- /* probably not necessary, but added just in case */
- .anythingWindow,
- .anythingControls ul a,
- .arrow a,
- .start-stop {
- transition-duration: 0;
- -o-transition-duration: 0;
- -moz-transition-duration: 0;
- -webkit-transition-duration: 0;
- }
-
-}
View
374 css/LESS/theme-construction.less
@@ -1,374 +0,0 @@
-/*
- AnythingSlider v1.8+ LESS Construction theme
- By Rob Garrison
-*/
-
-/*****************************
-SET DEFAULT DIMENSIONS HERE
-*****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/* slider borders */
-@slider-border-size : 3px;
-@inactive-border-color : #333;
-@active-border-color : #d0aa0d;
-
-/* current navigation tab styling - uses same navigation background image */
-@inactive-background-current : -52px -18px;
-@active-background-current : #fff;
-@navigation-text-color-current : #000;
-
-/* non-current navigation styling */
-@inactive-background-tab : transparent url(../images/construction.gif) -52px top no-repeat;
-@navigation-text-color : #fff;
-@navigation-tab-size : 15px;
-.navigation-tab-styling {
- width: @navigation-tab-size;
- height: @navigation-tab-size;
- margin: 3px;
- padding: 0;
-}
-.navigation-border (@radius: 5px) {
- border-radius: @radius;
- -moz-border-radius: @radius;
- -webkit-border-radius: @radius;
-}
-
-/* start-stop button background color */
-@inactive-start-stop-stopped : -52px -35px;
-@inactive-start-stop-playing : -52px -52px;
-@active-start-stop-hover : -52px -18px;
-
-/* navigation arrows */
-@arrow-width : 45px;
-@arrow-height : 200px; /* image height = 300px; set anywhere from 1-300 */
-@arrow-image : url(../images/construction.gif);
-@arrow-back-position : left center;
-@arrow-back-position-hovered : -5px center;
-@arrow-forward-position : right center;
-@arrow-forward-position-hovered: -67px center;
-@arrow-horizontal-pad : 45px; /* distance the arrow protrudes horizontally outside of the AnythingSlider wrapper */
-@navigation-bottom-pad : 0; /* distance the navigation controls (tabs & start-stop button) protrudes below the wrapper */
-
-.anythingSlider-construction {
- /*
- =================================
- Default state (no keyboard focus)
- =================================
- */
- /* Overall Wrapper */
- margin: 0 auto;
- padding: 0 @arrow-horizontal-pad @navigation-bottom-pad @arrow-horizontal-pad;
-
- /* slider window - top & bottom borders, default state */
- .anythingWindow {
- border-top: @slider-border-size solid @inactive-border-color;
- border-bottom: @slider-border-size solid @inactive-border-color;
- }
-
- /* Navigation buttons + start/stop button, default state */
- .anythingControls {
-
- a {
- background: @inactive-background-tab;
- color: @navigation-text-color;
-
- /* Navigation current button, default state */
- &.cur, &:hover {
- background-position: @inactive-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, default state */
- &.start-stop {
- background-position: @inactive-start-stop-stopped;
-
- /* start-stop button, playing, default state */
- &.playing { background-position: @inactive-start-stop-playing; }
- /* start-stop button, default hovered text color (when visible) */
- /* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
- &:hover, &.hover, .anythingControls ul a:hover {
- background-position: @active-start-stop-hover;
- }
- }
-
- }
- }
-
- /*
- =================================
- Active State (has keyboard focus)
- =================================
- */
- &.activeSlider {
-
- /* slider window - top & bottom borders, active state */
- .anythingWindow {
- border-color: @active-border-color;
- }
-
- }
-
- /************************
- NAVIGATION POSITIONING
- ************************/
- /* Navigation Arrows */
- .arrow {
- top: 50%;
- position: absolute;
- display: block;
-
- a {
- display: block;
- width: @arrow-width;
- height: @arrow-height;
- margin: -@arrow-height/2 0 0 0; /* half height of image */
- text-align: center;
- outline: 0;
- background: @arrow-image no-repeat;
- }
-
- }
-
- /* back arrow */
- .back {
- left: 0;
-
- a {
- background-position: @arrow-back-position;
- .navigation-border(5px 0 0 5px);
-
- &:hover, &.hover { background-position: @arrow-back-position-hovered; }
- }
- }
-
- /* forward arrow */
- .forward {
- right: 0;
-
- a {
- background-position: @arrow-forward-position;
- .navigation-border(0 5px 5px 0);
-
- &:hover, &.hover { background-position: @arrow-forward-position-hovered; }
- }
- }
-
- /* Navigation Links */
- .anythingControls {
- height: @navigation-tab-size*1.5; /* limit height, needed for IE9 of all things */
- outline: 0;
- display: none;
- float: right;
- position: absolute;
- bottom: 5px;
- right: 20px;
- margin: 0 @arrow-width; /* needed for IE */
- z-index: 100;
- opacity: 0.90;
- filter: alpha(opacity=90);
-
- ul {
- margin: 0;
- padding: 0;
- float: left;
-
- li {
- list-style: none;
- float: left;
- margin: 0;
- padding: 0;
- }
-
- a {
- display: inline-block;
- .navigation-tab-styling;
- text-decoration: none;
- text-align: center;
- outline: 0;
- }
-
- }
-
- span {
- display: block;
- visibility: hidden; /* needed for IE8, instead of text-indent: -9999px */
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- overflow: hidden;
- float: left;
- }
-
- /* navigationSize arrows */
- li.next a, li.prev a {
- width: 14px;
- height: 14px;
- margin: 4px;
- }
-
- li.next a {
- background-position: -92px -143px;
-
- &:hover {
- background-position: -90px -143px;
- }
- }
-
- li.prev a {
- background-position: -11px -143px;
-
- &:hover {
- background-position: -13px -143px;
- }
- }
-
- /* Autoplay Start/Stop button */
- .start-stop {
- display: inline-block;
- .navigation-tab-styling;
- text-decoration: none;
- float: right;
- z-index: 100;
- outline: 0;
- }
-
- }
-
-}
-
-/***********************
-IE8 AND OLDER STYLING
-***********************/
-.as-oldie .anythingSlider-construction {
-
- /* Navigation Arrows */
- .arrow {
- top: 14%;
-
- a {
- margin: 0;
- }
-
- }
-
-}
-
-/***********************
-COMMON SLIDER STYLING
-***********************/
-/* Overall Wrapper */
-.anythingSlider {
- display: block;
- overflow: visible !important;
- position: relative;
-
- /* anythingSlider viewport window */
- .anythingWindow {
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
- }
-
- /* anythingSlider base (original element) */
- .anythingBase {
- background: transparent;
- list-style: none;
- position: absolute;
- overflow: visible !important;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- }
-
- /* Navigation arrow text; indent moved to span inside "a", for IE7;
- apparently, a negative text-indent on an "a" link moves the link as well as the text */
- .arrow span {
- display: block;
- visibility: hidden;
- }
-
- /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
- .arrow.disabled {
- display: none;
- }
-
- /* all panels inside the slider; horizontal mode */
- .panel {
- background: transparent;
- display: block;
- overflow: hidden;
- float: left;
- padding: 0;
- margin: 0;
- }
-
- /* vertical mode */
- .vertical .panel {
- float: none;
- }
-
- /* fade mode */
- .fade {
- .panel {
- float: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
-
- .activePage {
- z-index: 0;
- }
- }
-
- /***********************
- RTL STYLING
- ***********************/
- /* slider autoplay right-to-left, reverse order of nav links to look better */
- &.rtl {
-
- .anythingWindow {
- direction: ltr;
- unicode-bidi: bidi-override;
- }
-
- /* move nav link group to left */
- .anythingControls ul {
- float: left;
-
- /* reverse order of nav links */
- a { float: right; }
- }
-
- /* move start/stop button - in case you want to switch sides */
- .start-stop {
- /* float: right; */
- }
-
- }
-
- /* probably not necessary, but added just in case */
- .anythingWindow,
- .anythingControls ul a,
- .arrow a,
- .start-stop {
- transition-duration: 0;
- -o-transition-duration: 0;
- -moz-transition-duration: 0;
- -webkit-transition-duration: 0;
- }
-
-}
View
365 css/LESS/theme-cs-portfolio.less
@@ -1,365 +0,0 @@
-/*
- AnythingSlider v1.8+ LESS cs-portfolio theme
- By Curtis Scott (http://www.curtisscott.com/portfolio.html)
-*/
-
-/*** Note: the nav-cs-portfolio.png used for navigation and slideshow buttons uses a semi-transparent png,
- through which the background color is seen... so colors set will turn out darker than normal ***/
-
-/*****************************
-SET DEFAULT DIMENSIONS HERE
-*****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/* slider borders */
-@slider-border : 0;
-
-/* current navigation tab styling - uses same navigation background image */
-@inactive-background-current : #0d5c9f;
-@navigation-text-color-current : #000;
-
-/* non-current navigation styling */
-@inactive-background-tab : #fff;
-
-@navigation-text-color : #000;
-@navigation-height : 49px;
-@navigation-padding-left : 75px; /* distance from left edge (must be > than @back-arrow-left + @arrow-width */
-.navigation-text-styling {
- font: 11px/18px Georgia, Serif;
- width: 17px;
- height: 17px;
- margin: 0 5px 0 0;
- padding: 0;
-}
-.navigation-background {
- /* top shadow */
- background: @inactive-background-tab url(../images/cs-portfolio.png) right -20px no-repeat;
-}
-
-/* start-stop button background color */
-@inactive-start-stop-stopped : #080;
-@inactive-start-stop-playing : #800;
-@active-start-stop-stopped : #0f0;
-@active-start-stop-playing : #f00;
-
-/* start-stop button text - HIDDEN */
-@inactive-start-stop-text : #ddd;
-@active-start-stop-text : #fff;
-@active-start-stop-text-hover : #fff;
-
-.start-stop-position {
- right: 60px;
- top: 15px;
- margin: 0;
- padding: 0;
-}
-
-/* navigation arrows */
-@arrow-width : 26px;
-@arrow-height : 27px;
-@forward-arrow-right : 20px; /* distance from right edge */
-@back-arrow-left : 20px; /* distance from left edge */
-@arrow-image : url(../images/cs-portfolio.png);
-@arrow-back-position : left top;
-@arrow-back-position-hovered : left -27px;
-@arrow-forward-position : -24px top;
-@arrow-forward-position-hovered: -24px -27px;
-
-.anythingSlider-cs-portfolio {
- /*
- =================================
- Default state (no keyboard focus)
- =================================
- */
- /* Overall Wrapper */
- margin: 0 auto;
- padding: 0;
-
- /* slider window - top & bottom borders, default state */
- .anythingWindow {
- border: @slider-border;
- }
-
- /* Navigation buttons + start/stop button, default state */
- .anythingControls a {
- .navigation-background;
- color: @navigation-text-color;
-
- /* Navigation current button, default state */
- &.cur, &:hover {
- background-color: @inactive-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, default state */
- &.start-stop {
- background-color: @inactive-start-stop-stopped;
- background-position: right top;
- color: @inactive-start-stop-text;
-
- /* start-stop button, default hovered text color (when visible) */
- /* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
- &:hover, &.hover {
- background-color: @active-start-stop-stopped;
- color: @active-start-stop-text-hover;
- }
-
- /* start-stop button, playing, default state */
- &.playing {
- background-color: @inactive-start-stop-playing;
-
- &:hover {
- background-color: @active-start-stop-playing;
- }
- }
-
-
- }
-
- }
-
- /************************
- NAVIGATION POSITIONING
- ************************/
- /* Navigation Arrows */
- .arrow {
- display: block;
- position: absolute;
- bottom: -@navigation-height/2 - @arrow-height/2; /* this is -18px for IE7 */
- z-index: 100;
-
- a {
- display: block;
- width: @arrow-width;
- height: @arrow-height;
- text-align: center;
- outline: 0;
- background: @arrow-image no-repeat;
- }
-
- }
-
- /* back arrow */
- .back {
- left: @back-arrow-left;
-
- a { background-position: @arrow-back-position; }
- a:hover, a.hover { background-position: @arrow-back-position-hovered; }
-
- }
-
- /* forward arrow */
- .forward {
- right: @forward-arrow-right;
-
- a { background-position: @arrow-forward-position; }
- a:hover, a.hover { background-position: @arrow-forward-position-hovered; }
-
- }
-
- /* Navigation Links */
- .anythingControls {
-
- position: relative;
- background: @arrow-image repeat-x bottom center;
- height: @navigation-height;
- margin: 0 auto;
- padding-left: @navigation-padding-left;
- text-align: center;
-
- ul {
- margin: 0;
- padding: 0;
- z-index: 100;
-
- &.thumbNav {
- padding-top: 18px;
- }
-
- li {
- margin: 0;
- padding: 0;
- display: inline;
- }
-
- a {
- .navigation-text-styling;
- float: left;
- text-decoration: none;
- text-align: center;
- outline: 0;
- border: 0;
- }
-
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- margin: 0 5px 0 0;
- overflow: hidden;
- float: left;
- }
-
- /* Navigation size window arrows */
- li.next a, li.prev a {
- margin: 19px 5px 0 0;
- width: 16px;
- height: 15px;
- background: @arrow-image -25px -54px no-repeat;
- }
- li.prev a { background-position: -9px -54px; }
- li.next a:hover { background-position: -56px -54px; }
- li.prev a:hover { background-position: -41px -54px; }
-
- /* Autoplay Start/Stop button */
- .start-stop {
- .start-stop-position;
- position: absolute;
- text-align: center;
- width: 20px;
- height: 20px;
- z-index: 100;
- border: 0;
- }
-
- }
-
-}
-
-/***********************
-IE8 AND OLDER STYLING
-***********************/
-.as-oldie .anythingSlider-cs-portfolio {
-
- /* Navigation Arrows */
- .arrow a span, .anythingControls a span {
- /* line-height: 1px; needed for IE7 */
- }
-
- /* IE7 png fix*/
- .arrow a, .anythingControls, .anythingControls a {
- background-image: url(../images/cs-portfolio.png);
- _background:none;
- _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/cs-portfolio.png',sizingMethod='crop');
- }
-
-}
-
-/***********************
-COMMON SLIDER STYLING
-***********************/
-/* Overall Wrapper */
-.anythingSlider {
-
- display: block;
- overflow: visible !important;
- position: relative;
-
- /* anythingSlider viewport window */
- .anythingWindow {
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
- }
-
- /* anythingSlider base (original element) */
- .anythingBase {
- background: transparent;
- list-style: none;
- position: absolute;
- overflow: visible !important;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- }
-
- /* Navigation arrow text; indent moved to span inside "a", for IE7;
- apparently, a negative text-indent on an "a" link moves the link as well as the text */
- .arrow span, .anythingControls span {
- display: block;
- visibility: hidden;
- }
-
- /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
- .arrow.disabled {
- display: none;
- }
-
- /* all panels inside the slider; horizontal mode */
- .panel {
- background: transparent;
- display: block;
- overflow: hidden;
- float: left;
- padding: 0;
- margin: 0;
- }
-
- /* vertical mode */
- .vertical .panel {
- float: none;
- }
-
- /* fade mode */
- .fade {
- .panel {
- float: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
-
- .activePage {
- z-index: 0;
- }
- }
-
- /***********************
- RTL STYLING
- ***********************/
- /* slider autoplay right-to-left, reverse order of nav links to look better */
- &.rtl {
-
- .anythingWindow {
- direction: ltr;
- unicode-bidi: bidi-override;
- }
-
- /* move nav link group to left */
- .anythingControls ul {
- float: left;
-
- /* reverse order of nav links */
- a { float: right; }
- }
-
- /* move start/stop button - in case you want to switch sides */
- .start-stop {
- /* float: right; */
- }
-
- }
-
- /* probably not necessary, but added just in case */
- .anythingWindow,
- .anythingControls ul a,
- .arrow a,
- .start-stop {
- transition-duration: 0;
- -o-transition-duration: 0;
- -moz-transition-duration: 0;
- -webkit-transition-duration: 0;
- }
-
-}
View
410 css/LESS/theme-metallic.less
@@ -1,410 +0,0 @@
-/*
- AnythingSlider v1.8+ LESS Metallic theme
- By Rob Garrison
-*/
-
-/*****************************
-SET DEFAULT DIMENSIONS HERE
-*****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/* slider borders */
-@slider-border-size : 3px;
-@inactive-border-color : #333;
-@active-border-color : #0355a3;
-
-/* current navigation tab styling - uses same navigation background image */
-@inactive-background-current : #888;
-@inactive-background-position : -70px -137px; /* two-tone dark grey */
-@active-background-current : #ccc;
-@active-background-position : -76px -57px; /* two-tone light grey */
-@navigation-text-color-current : #000;
-
-/* non-current navigation styling */
-@inactive-background-tab : transparent;
-@active-background-tab : transparent;
-@navigation-text-color : #fff;
-@navigation-tab-size : 10px;
-.navigation-tab-styling {
- width: @navigation-tab-size;
- height: @navigation-tab-size;
- margin: 3px;
- padding: 0;
-}
-.navigation-border (@radius: 5px) {
- border: #000 1px solid;
- border-radius: @radius;
- -moz-border-radius: @radius;
- -webkit-border-radius: @radius;
-}
-.navigation-background {
- /* two-tone blue */
- background: url(../images/arrows-metallic.png) -68px -40px repeat-x;
-}
-
-/* start-stop button background color */
-@inactive-start-stop-stopped : #040;
-@inactive-start-stop-playing : #800;
-@active-start-stop-stopped : #080;
-@active-start-stop-playing : #d00;
-
-/* start-stop button text */
-@inactive-start-stop-text : #ddd;
-@active-start-stop-text : #fff;
-@active-start-stop-text-hover : #fff;
-.start-stop-shadow (@shadow: inset 1px 2px 5px rgba(0,0,0,0.5)) {
- /* top shadow */
- -moz-box-shadow: @shadow;
- -webkit-box-shadow: @shadow;
- box-shadow: @shadow;
-}
-
-/* navigation arrows */
-@arrow-width : 45px;
-@arrow-height : 95px;
-@arrow-image : url(../images/arrows-metallic.png);
-@arrow-back-position : left bottom;
-@arrow-back-position-hovered : left top;
-@arrow-forward-position : right bottom;
-@arrow-forward-position-hovered: right top;
-@arrow-horizontal-pad : 23px; /* distance the arrow protrudes horizontally outside of the AnythingSlider wrapper */
-@navigation-bottom-pad : 0; /* distance the navigation controls (tabs & start-stop button) protrudes below the wrapper */
-
-.anythingSlider-metallic {
- /*
- =================================
- Default state (no keyboard focus)
- =================================
- */
- /* Overall Wrapper */
- margin: 0 auto;
- padding: 0 @arrow-horizontal-pad @navigation-bottom-pad @arrow-horizontal-pad;
-
- /* slider window - top & bottom borders, default state */
- .anythingWindow {
- border-top: @slider-border-size solid @inactive-border-color;
- border-bottom: @slider-border-size solid @inactive-border-color;
- }
-
- /* Navigation buttons + start/stop button, default state */
- .anythingControls a {
- .navigation-background; /* top shadow */
- background-color: @inactive-background-tab;
- color: @navigation-text-color;
- .navigation-border;
-
- /* Navigation current button, default state */
- &.cur, &:hover {
- background-color: @inactive-background-current;
- background-position: @inactive-background-position;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, default state */
- &.start-stop {
- background: @inactive-start-stop-stopped;
- color: @inactive-start-stop-text;
- .start-stop-shadow;
-
- /* start-stop button, playing, default state */
- &.playing { background-color: @inactive-start-stop-playing; }
- /* start-stop button, default hovered text color (when visible) */
- /* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
- &:hover, &.hover, .anythingControls ul a:hover {
- color: @active-start-stop-text-hover;
- .start-stop-shadow(inset 0 0 0 #000);
- }
- }
-
- }
-
- /*
- =================================
- Active State (has keyboard focus)
- =================================
- */
- &.activeSlider {
-
- /* slider window - top & bottom borders, active state */
- .anythingWindow {
- border-color: @active-border-color;
- }
-
- /* Navigation buttons, active state */
- .anythingControls a {
- /* background image = top shadow */
- background-color: @active-background-tab;
-
- /* Navigation current button, active state */
- &.cur, &:hover {
- background-color: @active-background-current;
- background-position: @active-background-position;
- }
-
- /* start-stop button, stopped, active state */
- &.start-stop {
- background: @active-start-stop-stopped;
- color: @active-start-stop-text;
-
- /* start-stop button, playing, active state */
- &.playing {
- color: @active-start-stop-text;
- background: @active-start-stop-playing;
- }
-
- }
-
- }
-
- /* start-stop button, active slider hovered text color (when visible) */
- .start-stop:hover, .start-stop.hover {
- color: @active-start-stop-text-hover;
- }
-
- }
-
- /************************
- NAVIGATION POSITIONING
- ************************/
- /* Navigation Arrows */
- .arrow {
- top: 50%;
- position: absolute;
- display: block;
- z-index: 100;
-
- a {
- display: block;
- width: @arrow-width;
- height: @arrow-height;
- margin: -@arrow-height/2 0 0 0; /* half height of image */
- text-align: center;
- outline: 0;
- background: @arrow-image no-repeat;
- }
-
- }
-
- /* back arrow */
- .back {
- left: 0;
-
- a { background-position: @arrow-back-position; }
- a:hover, a.hover { background-position: @arrow-back-position-hovered; }
-
- }
-
- /* forward arrow */
- .forward {
- right: 0;
-
- a { background-position: @arrow-forward-position; }
- a:hover, a.hover { background-position: @arrow-forward-position-hovered; }
-
- }
-
- /* Navigation Links */
- .anythingControls {
-
- height: @navigation-tab-size*1.5; /* limit height, needed for IE9 of all things */
- outline: 0;
- display: none;
- float: right;
- position: absolute;
- bottom: 5px;
- right: 20px;
- margin: 0 @arrow-width*1.5; /* needed for IE */
- z-index: 100;
- opacity: 0.90;
- filter: alpha(opacity=90);
-
- ul {
- margin: 0;
- padding: 0;
- float: left;
-
- li {
- list-style: none;
- float: left;
- margin: 0;
- padding: 0;
- }
-
- a {
- display: inline-block;
- .navigation-tab-styling;
- text-decoration: none;
- text-align: center;
- outline: 0;
- }
-
- }
-
- span {
- display: block;
- visibility: hidden;
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- overflow: hidden;
- float: left;
- }
-
- /* navigationSize nav arrow positioning */
- li.prev a span, li.next a span {
- visibility: visible;
- position: relative;
- top: -6px; /* bring navigationSize text arrows into view */
- color: @navigation-text-color;
- }
-
- /* Autoplay Start/Stop button */
- .start-stop {
- display: inline-block;
- .navigation-tab-styling;
- text-align: center;
- text-decoration: none;
- z-index: 100;
- outline: 0;
- }
-
- }
-
-}
-
-/***********************
-IE8 AND OLDER STYLING
-***********************/
-.as-oldie .anythingSlider-metallic {
-
- /* Navigation Arrows */
- .arrow {
- top: 40%;
-
- a {
- margin: 0;
- }
-
- }
-
-}
-
-/***********************
-COMMON SLIDER STYLING
-***********************/
-/* Overall Wrapper */
-.anythingSlider {
-
- display: block;
- overflow: visible !important;
- position: relative;
-
- /* anythingSlider viewport window */
- .anythingWindow {
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
- }
-
- /* anythingSlider base (original element) */
- .anythingBase {
- background: transparent;
- list-style: none;
- position: absolute;
- overflow: visible !important;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- }
-
- /* Navigation arrow text; indent moved to span inside "a", for IE7;
- apparently, a negative text-indent on an "a" link moves the link as well as the text */
- .arrow a span {
- display: block;
- visibility: hidden;
- }
-
- /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
- .arrow.disabled {
- display: none;
- }
-
- /* all panels inside the slider; horizontal mode */
- .panel {
- background: transparent;
- display: block;
- overflow: hidden;
- float: left;
- padding: 0;
- margin: 0;
- }
-
- /* vertical mode */
- .vertical .panel {
- float: none;
- }
-
- /* fade mode */
- .fade {
- .panel {
- float: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
-
- .activePage {
- z-index: 0;
- }
- }
-
- /***********************
- RTL STYLING
- ***********************/
- /* slider autoplay right-to-left, reverse order of nav links to look better */
- &.rtl {
-
- .anythingWindow {
- direction: ltr;
- unicode-bidi: bidi-override;
- }
-
- /* move nav link group to left */
- .anythingControls ul {
- float: left;
-
- /* reverse order of nav links */
- a { float: right; }
- }
-
- /* move start/stop button - in case you want to switch sides */
- .start-stop {
- /* float: right; */
- }
-
- }
-
- /* probably not necessary, but added just in case */
- .anythingWindow,
- .anythingControls ul a,
- .arrow a,
- .start-stop {
- transition-duration: 0;
- -o-transition-duration: 0;
- -moz-transition-duration: 0;
- -webkit-transition-duration: 0;
- }
-
-}
View
406 css/LESS/theme-minimalist-round.less
@@ -1,406 +0,0 @@
-/*
- AnythingSlider v1.8+ LESS Minimalist Round theme
- By Rob Garrison
-*/
-
-/*****************************
-SET DEFAULT DIMENSIONS HERE
-*****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/* slider borders */
-@slider-border-size : 3px;
-@inactive-border-color : #333;
-@active-border-color : #164054;
-
-/* current navigation tab styling - uses same navigation background image */
-@inactive-background-current : #777;
-@active-background-current : #fff;
-@navigation-text-color-current : #000;
-
-/* non-current navigation styling */
-@inactive-background-tab : #333;
-@active-background-tab : #164054;
-@navigation-text-color : #fff;
-@navigation-tab-size : 10px;
-.navigation-tab-styling {
- width: @navigation-tab-size;
- height: @navigation-tab-size;
- margin: 3px;
- padding: 0;
-}
-.navigation-border (@radius: 5px) {
- border: #000 1px solid;
- border-radius: @radius;
- -moz-border-radius: @radius;
- -webkit-border-radius: @radius;
-}
-
-/* start-stop button background color */
-@inactive-start-stop-stopped : #040;
-@inactive-start-stop-playing : #800;
-@active-start-stop-stopped : #080;
-@active-start-stop-playing : #f00;
-
-/* start-stop button text */
-@inactive-start-stop-text : #ddd;
-@active-start-stop-text : #fff;
-@active-start-stop-text-hover : #fff;
-.start-stop-shadow (@shadow: inset 1px 2px 5px rgba(0,0,0,0.5)) {
- /* top shadow */
- -moz-box-shadow: @shadow;
- -webkit-box-shadow: @shadow;
- box-shadow: @shadow;
-}
-
-/* navigation arrows */
-@arrow-width : 30px;
-@arrow-height : 40px;
-@arrow-image : url(../images/arrows-minimalist.png);
-@arrow-back-position : left bottom;
-@arrow-back-position-hovered : left top;
-@arrow-forward-position : right bottom;
-@arrow-forward-position-hovered: right top;
-@arrow-horizontal-pad : 30px; /* distance the arrow protrudes horizontally outside of the AnythingSlider wrapper */
-@navigation-bottom-pad : 0; /* distance the navigation controls (tabs & start-stop button) protrudes below the wrapper */
-
-.anythingSlider-minimalist-round {
- /*
- =================================
- Default state (no keyboard focus)
- =================================
- */
- /* Overall Wrapper */
- margin: 0 auto;
- padding: 0 @arrow-horizontal-pad @navigation-bottom-pad @arrow-horizontal-pad;
-
- /* slider window - top & bottom borders, default state */
- .anythingWindow {
- border-top: @slider-border-size solid @inactive-border-color;
- border-bottom: @slider-border-size solid @inactive-border-color;
- }
-
- /* Navigation buttons + start/stop button, default state */
- .anythingControls a {
- background-color: @inactive-background-tab;
- color: @navigation-text-color;
- .navigation-border;
-
- /* Navigation current button, default state */
- &.cur, &:hover {
- background-color: @inactive-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, default state */
- &.start-stop {
- background: @inactive-start-stop-stopped;
- color: @inactive-start-stop-text;
- .start-stop-shadow;
-
- /* start-stop button, playing, default state */
- &.playing { background-color: @inactive-start-stop-playing; }
-
- /* start-stop button, default hovered text color (when visible) */
- /* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
- &:hover, &.hover, .anythingControls ul a:hover {
- color: @active-start-stop-text-hover;
- .start-stop-shadow(inset 0 0 0 #000);
- }
- }
-
- }
-
- /*
- =================================
- Active State (has keyboard focus)
- =================================
- */
- &.activeSlider {
-
- /* slider window - top & bottom borders, active state */
- .anythingWindow {
- border-color: @active-border-color;
- }
-
- /* Navigation buttons, active state */
- .anythingControls a {
- /* background image = top shadow */
- background-color: @active-background-tab;
- color: @navigation-text-color;
-
- /* Navigation current button, active state */
- &.cur, &:hover {
- background-color: @active-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, active state */
- &.start-stop {
- background: @active-start-stop-stopped;
- color: @active-start-stop-text;
-
- /* start-stop button, playing, active state */
- &.playing {
- color: @active-start-stop-text;
- background: @active-start-stop-playing;
- }
-
- }
-
- }
-
- /* start-stop button, active slider hovered text color (when visible) */
- .start-stop:hover, .start-stop.hover {
- color: @active-start-stop-text-hover;
- }
-
- }
-
- /************************
- NAVIGATION POSITIONING
- ************************/
- /* Navigation Arrows */
- .arrow {
- top: 50%;
- position: absolute;
- display: block;
-
- a {
- display: block;
- width: @arrow-width;
- height: @arrow-height;
- margin: -@arrow-height/2 0 0 0; /* half height of image */
- text-align: center;
- outline: 0;
- background: @arrow-image no-repeat;
- }
-
- }
-
- /* back arrow */
- .back {
- left: 0;
-
- a {
- background-position: @arrow-back-position;
- &:hover, &.hover { background-position: @arrow-back-position-hovered; }
- }
-
- }
-
- /* forward arrow */
- .forward {
- right: 0;
-
- a {
- background-position: @arrow-forward-position;
- &:hover, &.hover { background-position: @arrow-forward-position-hovered; }
- }
-
- }
-
- /* Navigation Links */
- .anythingControls {
-
- height: @navigation-tab-size*1.5; /* limit height, needed for IE9 of all things */
- outline: 0;
- display: none;
- float: right;
- position: absolute;
- bottom: 5px;
- right: 20px;
- margin: 0 @arrow-width*1.5; /* needed for IE */
- z-index: 100;
- opacity: 0.90;
- filter: alpha(opacity=90);
-
- ul {
- margin: 0;
- padding: 0;
- float: left;
-
- li {
- list-style: none;
- float: left;
- margin: 0;
- padding: 0;
- }
-
- a {
- display: inline-block;
- .navigation-tab-styling;
- text-decoration: none;
- text-align: center;
- outline: 0;
- }
-
- }
-
- span {
- display: block;
- visibility: hidden; /* needed for IE8, instead of text-indent: -9999px */
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- overflow: hidden;
- float: left;
- }
-
- /* navigationSize nav arrow positioning */
- li.prev a span, li.next a span {
- visibility: visible;
- position: relative;
- top: -6px; /* bring navigationSize text arrows into view */
- }
-
- /* Autoplay Start/Stop button */
- .start-stop {
- display: inline-block;
- .navigation-tab-styling;
- text-align: center;
- text-decoration: none;
- z-index: 100;
- outline: 0;
- }
-
- }
-
-}
-
-/***********************
-IE8 AND OLDER STYLING
-***********************/
-.as-oldie .anythingSlider-minimalist-round {
-
- /* Navigation Arrows */
- .arrow {
- top: 45%;
-
- a {
- margin: 0;
- }
-
- }
-
-}
-
-/***********************
-COMMON SLIDER STYLING
-***********************/
-/* Overall Wrapper */
-.anythingSlider {
-
- display: block;
- overflow: visible !important;
- position: relative;
-
- /* anythingSlider viewport window */
- .anythingWindow {
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
- }
-
- /* anythingSlider base (original element) */
- .anythingBase {
- background: transparent;
- list-style: none;
- position: absolute;
- overflow: visible !important;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- }
-
- /* Navigation arrow text; indent moved to span inside "a", for IE7;
- apparently, a negative text-indent on an "a" link moves the link as well as the text */
- .arrow span {
- display: block;
- visibility: hidden;
- }
-
- /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
- .arrow.disabled {
- display: none;
- }
-
- /* all panels inside the slider; horizontal mode */
- .panel {
- background: transparent;
- display: block;
- overflow: hidden;
- float: left;
- padding: 0;
- margin: 0;
- }
-
- /* vertical mode */
- .vertical .panel {
- float: none;
- }
-
- /* fade mode */
- .fade {
- .panel {
- float: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
-
- .activePage {
- z-index: 0;
- }
- }
-
- /***********************
- RTL STYLING
- ***********************/
- /* slider autoplay right-to-left, reverse order of nav links to look better */
- &.rtl {
-
- .anythingWindow {
- direction: ltr;
- unicode-bidi: bidi-override;
- }
-
- /* move nav link group to left */
- .anythingControls ul {
- float: left;
-
- /* reverse order of nav links */
- a { float: right; }
- }
-
- /* move start/stop button - in case you want to switch sides */
- .start-stop {
- /* float: right; */
- }
-
- }
-
- /* probably not necessary, but added just in case */
- .anythingWindow,
- .anythingControls ul a,
- .arrow a,
- .start-stop {
- transition-duration: 0;
- -o-transition-duration: 0;
- -moz-transition-duration: 0;
- -webkit-transition-duration: 0;
- }
-
-}
View
405 css/LESS/theme-minimalist-square.less
@@ -1,405 +0,0 @@
-/*
- AnythingSlider v1.8+ LESS Minimalist Square theme
- By Rob Garrison
-*/
-
-/*****************************
-SET DEFAULT DIMENSIONS HERE
-*****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/* slider borders */
-@slider-border-size : 3px;
-@inactive-border-color : #333;
-@active-border-color : #164054;
-
-/* current navigation tab styling - uses same navigation background image */
-@inactive-background-current : #777;
-@active-background-current : #fff;
-@navigation-text-color-current : #000;
-
-/* non-current navigation styling */
-@inactive-background-tab : #333;
-@active-background-tab : #164054;
-@navigation-text-color : #fff;
-@navigation-tab-size : 10px;
-.navigation-tab-styling {
- width: @navigation-tab-size;
- height: @navigation-tab-size;
- margin: 3px;
- padding: 0;
-}
-.navigation-border {
- border: #000 1px solid;
-}
-
-/* start-stop button background color */
-@inactive-start-stop-stopped : #040;
-@inactive-start-stop-playing : #800;
-@active-start-stop-stopped : #080;
-@active-start-stop-playing : #f00;
-
-/* start-stop button text */
-@inactive-start-stop-text : #ddd;
-@active-start-stop-text : #fff;
-@active-start-stop-text-hover : #fff;
-.start-stop-shadow (@shadow: inset 1px 2px 5px rgba(0,0,0,0.5)) {
- /* top shadow */
- -moz-box-shadow: @shadow;
- -webkit-box-shadow: @shadow;
- box-shadow: @shadow;
-}
-
-/* navigation arrows */
-@arrow-width : 30px;
-@arrow-height : 40px;
-@arrow-image : url(../images/arrows-minimalist.png);
-@arrow-back-position : left bottom;
-@arrow-back-position-hovered : left top;
-@arrow-forward-position : right bottom;
-@arrow-forward-position-hovered: right top;
-@arrow-horizontal-pad : 30px; /* distance the arrow protrudes horizontally outside of the AnythingSlider wrapper */
-@navigation-bottom-pad : 0; /* distance the navigation controls (tabs & start-stop button) protrudes below the wrapper */
-
-.anythingSlider-minimalist-square {
- /*
- =================================
- Default state (no keyboard focus)
- =================================
- */
- /* Overall Wrapper */
- margin: 0 auto;
- padding: 0 @arrow-horizontal-pad @navigation-bottom-pad @arrow-horizontal-pad;
-
- /* slider window - top & bottom borders, default state */
- .anythingWindow {
- border-top: @slider-border-size solid @inactive-border-color;
- border-bottom: @slider-border-size solid @inactive-border-color;
- }
-
- /* Navigation buttons + start/stop button, default state */
- .anythingControls a {
- background-color: @inactive-background-tab;
- color: @navigation-text-color;
- .navigation-border;
-
- /* Navigation current button, default state */
- &.cur, &:hover {
- background-color: @inactive-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, default state */
- &.start-stop {
- background: @inactive-start-stop-stopped;
- color: @inactive-start-stop-text;
- .start-stop-shadow;
-
- /* start-stop button, playing, default state */
- &.playing { background-color: @inactive-start-stop-playing; }
-
- /* start-stop button, default hovered text color (when visible) */
- /* hide nav/start-stop background image shadow on hover - makes the button appear to come forward */
- &:hover, &.hover, .anythingControls ul a:hover {
- color: @active-start-stop-text-hover;
- .start-stop-shadow(inset 0 0 0 #000);
- }
- }
-
- }
-
- /*
- =================================
- Active State (has keyboard focus)
- =================================
- */
- &.activeSlider {
-
- /* slider window - top & bottom borders, active state */
- .anythingWindow {
- border-color: @active-border-color;
- }
-
- /* Navigation buttons, active state */
- .anythingControls a {
- /* background image = top shadow */
- background-color: @active-background-tab;
- color: @navigation-text-color;
-
- /* Navigation current button, active state */
- &.cur, &:hover {
- background-color: @active-background-current;
- color: @navigation-text-color-current;
- }
-
- /* start-stop button, stopped, active state */
- &.start-stop {
- background: @active-start-stop-stopped;
- color: @active-start-stop-text;
-
- /* start-stop button, playing, active state */
- &.playing {
- color: @active-start-stop-text;
- background: @active-start-stop-playing;
- }
-
- }
-
- }
-
- /* start-stop button, active slider hovered text color (when visible) */
- .start-stop:hover, .start-stop.hover {
- color: @active-start-stop-text-hover;
- }
-
- }
-
- /************************
- NAVIGATION POSITIONING
- ************************/
- /* Navigation Arrows */
- .arrow {
- top: 50%;
- position: absolute;
- display: block;
-
- a {
- display: block;
- width: @arrow-width;
- height: @arrow-height;
- margin: -@arrow-height/2 0 0 0; /* half height of image */
- text-align: center;
- outline: 0;
- background: @arrow-image no-repeat;
- }
-
- }
-
- /* back arrow */
- .back {
- left: 0;
-
- a {
- background-position: @arrow-back-position;
- &:hover, &.hover { background-position: @arrow-back-position-hovered; }
- }
-
- }
-
- /* forward arrow */
- .forward {
- right: 0;
-
- a {
- background-position: @arrow-forward-position;
- &:hover, &.hover { background-position: @arrow-forward-position-hovered; }
- }
-
- }
-
- /* Navigation Links */
- .anythingControls {
-
- height: @navigation-tab-size*1.5; /* limit height, needed for IE9 of all things */
- outline: 0;
- display: none;
- float: right;
- position: absolute;
- bottom: 5px;
- right: 20px;
- margin: 0 @arrow-width*1.5; /* needed for IE */
- z-index: 100;
- opacity: 0.90;
- filter: alpha(opacity=90);
-
- ul {
- margin: 0;
- padding: 0;
- float: left;
-
- li {
- list-style: none;
- float: left;
- margin: 0;
- padding: 0;
- }
-
- a {
- display: inline-block;
- .navigation-tab-styling;
- text-decoration: none;
- text-align: center;
- outline: 0;
- }
-
- }
-
- span {
- display: block;
- visibility: hidden; /* needed for IE8, instead of text-indent: -9999px */
- }
-
- /* navigationSize window */
- .anythingNavWindow {
- overflow: hidden;
- float: left;
- }
-
- /* navigationSize nav arrow positioning */
- li.prev a span, li.next a span {
- visibility: visible;
- position: relative;
- top: -6px; /* bring navigationSize text arrows into view */
- }
-
- /* Autoplay Start/Stop button */
- .start-stop {
- margin: 3px;
- padding: 0;
- display: inline-block;
- .navigation-tab-styling;
- text-align: center;
- text-decoration: none;
- z-index: 100;
- outline: 0;
- }
-
- }
-
-}
-
-/***********************
-IE8 AND OLDER STYLING
-***********************/
-.as-oldie .anythingSlider-minimalist-square {
-
- /* Navigation Arrows */
- .arrow {
- top: 45%;
-
- a {
- margin: 0;
- }
-
- }
-
-}
-
-/***********************
-COMMON SLIDER STYLING
-***********************/
-/* Overall Wrapper */
-.anythingSlider {
-
- display: block;
- overflow: visible !important;
- position: relative;
-
- /* anythingSlider viewport window */
- .anythingWindow {
- overflow: hidden;
- position: relative;
- width: 100%;
- height: 100%;
- }
-
- /* anythingSlider base (original element) */
- .anythingBase {
- background: transparent;
- list-style: none;
- position: absolute;
- overflow: visible !important;
- top: 0;
- left: 0;
- margin: 0;
- padding: 0;
- }
-
- /* Navigation arrow text; indent moved to span inside "a", for IE7;
- apparently, a negative text-indent on an "a" link moves the link as well as the text */
- .arrow span {
- display: block;
- visibility: hidden;
- }
-
- /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
- .arrow.disabled {
- display: none;
- }
-
- /* all panels inside the slider; horizontal mode */
- .panel {
- background: transparent;
- display: block;
- overflow: hidden;
- float: left;
- padding: 0;
- margin: 0;
- }
-
- /* vertical mode */
- .vertical .panel {
- float: none;
- }
-
- /* fade mode */
- .fade {
- .panel {
- float: none;
- position: absolute;
- top: 0;
- left: 0;
- z-index: -1;
- }
-
- .activePage {
- z-index: 0;
- }
- }
-
- /***********************
- RTL STYLING
- ***********************/
- /* slider autoplay right-to-left, reverse order of nav links to look better */
- &.rtl {
-
- .anythingWindow {
- direction: ltr;
- unicode-bidi: bidi-override;
- }
-
- /* move nav link group to left */
- .anythingControls ul {
- float: left;
-
- /* reverse order of nav links */
- a { float: right; }
- }
-
- /* move start/stop button - in case you want to switch sides */
- .start-stop {
- /* float: right; */
- }
-
- }
-
- /* probably not necessary, but added just in case */
- .anythingWindow,
- .anythingControls ul a,
- .arrow a,
- .start-stop {
- transition-duration: 0;
- -o-transition-duration: 0;
- -moz-transition-duration: 0;
- -webkit-transition-duration: 0;
- }
-
-}
View
3,813 css/animate.css
0 additions, 3,813 deletions not shown because the diff is too large. Please use a local Git client to view these changes.
View
291 css/anythingslider.css
@@ -1,291 +0,0 @@
-/*
- AnythingSlider v1.8+ Default theme
- By Chris Coyier: http://css-tricks.com
- with major improvements by Doug Neiner: http://pixelgraphics.us/
- based on work by Remy Sharp: http://jqueryfordesigners.com/
-*/
-
-/*****************************
- SET DEFAULT DIMENSIONS HERE
- *****************************/
-/* change the ID & dimensions to match your slider */
-#slider {
- width: 700px;
- height: 390px;
- list-style: none;
- /* Prevent FOUC (see FAQ page) and keep things readable if javascript is disabled */
- overflow-y: auto;
- overflow-x: hidden;
-}
-
-/******************
- SET STYLING HERE
- ******************
- =================================
- Default state (no keyboard focus)
- ==================================*/
-/* Overall Wrapper */
-.anythingSlider-default {
- margin: 0 auto;
- /* 45px right & left padding for the arrows, 28px @ bottom for navigation */
- padding: 0 45px 28px 45px;
-}
-/* slider window - top & bottom borders, default state */
-.anythingSlider-default .anythingWindow {
- border-top: 3px solid #777;
- border-bottom: 3px solid #777;
-}
-/* Navigation buttons + start/stop button, default state */
-.anythingSlider-default .anythingControls a {
- /* top shadow */
- background: #777 url(../images/default.png) center -288px repeat-x;
- color: #000;
- border-radius: 0 0 5px 5px;
- -moz-border-radius: 0 0 5px 5px;
- -webkit-border-radius: 0 0 5px 5px;
-}
-/* Make sure navigation text is visible */
-.anythingSlider-default .anythingControls a span {
- visibility: visible;
-}
-/* Navigation current button, default state */
-.anythingSlider-default .anythingControls a.cur {
- background: #888;
- color: #000;
-}
-
-/* start-stop button, stopped, default state */