From 753f60c7d4769fa72d3b910e491f37db6f130898 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Fri, 2 Aug 2013 17:19:21 -0500 Subject: dymaxion --- .../demo/jsAMP-preview/css/player.css | 525 +++++++++++++++++++++ 1 file changed, 525 insertions(+) create mode 100755 docs/dymaxion/soundmanagerv297a-20101010/demo/jsAMP-preview/css/player.css (limited to 'docs/dymaxion/soundmanagerv297a-20101010/demo/jsAMP-preview/css/player.css') diff --git a/docs/dymaxion/soundmanagerv297a-20101010/demo/jsAMP-preview/css/player.css b/docs/dymaxion/soundmanagerv297a-20101010/demo/jsAMP-preview/css/player.css new file mode 100755 index 0000000..5c5907e --- /dev/null +++ b/docs/dymaxion/soundmanagerv297a-20101010/demo/jsAMP-preview/css/player.css @@ -0,0 +1,525 @@ +body { + font:normal 75% verdana,tahoma,arial,"sans serif"; + background:#000; + color:#ccc; +} + +/* + + GENERAL RANT AWARENESS NOTICE + ----------------------------- + You may see some complaining about Internet Explorer, PNG and opacity-related hacks. + Even the new (at time of writing, 12/2006) IE 7 has issues and other quirks. Too bad. + +*/ + +.sm2player { + position:absolute; + left:1.75em; + top:5.5em; + z-index:3; + padding:1px; + height:20px; + font:normal x-small/19px arial,verdana,tahoma,"sans serif"; + *line-height:18px; + color:#000; + zoom:1; +} + +.sm2player.altFont { + /* font tweaks for mac which has tighter spacing */ + letter-spacing:0px; +} + +.sm2player, +.sm2player .sm2playlist-box { +/* + width:302px; + width:360px; +*/ +} + +.sm2player .ui, +.sm2player .sm2playlist { +xfilter:alpha(opacity=90); /* Even IE 7 (still) sucks! */ + opacity:0.9; +} + +.sm2player .ui { + _filter:none; /* IE <7 sucks */ +} + +.sm2player.noOpacity .ui { + /* Safari (1.3.2 at least?) has render bugs with UI display + animated PNG progress bar when applying opacity */ + opacity:1; +} + +.sm2player .ui:hover { + opacity:1; + filter:alpha(opacity=100); +} + +.sm2player a:focus { + outline:none; +} + +.sm2player .left, +.sm2player .mid, +.sm2player .right { + position:relative; + float:left; + display:inline; + height:20px; + color:#fff; +} + +.sm2player .left { + width:15px; + background:transparent url(../image/skin-0-ui.png) 0px 0px no-repeat; + _background-image:url(../image/skin-0-ui.gif); /* IE <7 */ +} + +.sm2player .left .trigger, +.sm2player .left .trigger span { + display:block; + width:15px; + height:20px; +} + +.sm2player .left .trigger.pauseplay span { + background:transparent url(../image/sec-left-arr0.png) 5px 6px no-repeat; + _background-image:url(../image/sec-left-arr0.gif); + _background-position:0px 0px; +} + +.sm2player .left .trigger.pauseplay span.playing { + /* class applied while playing */ + background-image:url(../image/sec-left-pause.gif); + background-position:6px 7px; +} + +.sm2player .left .trigger:hover { + background:transparent url(../image/ui-highlight-2.png) 2px 0px no-repeat; + _background-image:url(../image/ui-highlight-2.gif); + /*_background-position:2px 2px;*/ +} + +.sm2player .mid { + position:relative; + width:223px; + _width:224px; + background:transparent url(../image/skin-0-ui.png) -14px 0px no-repeat; + _background-image:url(../image/skin-0-ui.gif); +} + +.sm2player .mid .info { + position:absolute; + left:0px; + top:0px; + width:100%; + height:20px; + overflow:hidden; + text-indent:2px; + z-index:2; + cursor:default; +} + +.sm2player .mid .progress { + position:relative; + display:block; + width:1px; + height:12px; + margin:4px 0px 0px 0px; + background:transparent url(../image/sec-mid-loaded.png) 0px 0px repeat-x; + _background-image:url(../image/sec-mid-loaded.gif); + background-color:#333; +} + +.sm2player .mid .progress.loading { + position:relative; + display:block; + width:1px; + border-right:1px solid #333; +} + +.sm2player .mid .slider { + position:absolute; + display:block; + width:12px; + height:12px; + left:0px; + top:0px; + margin-top:4px; + background:transparent url(../image/slider-1.png) 0px 0px no-repeat; + _background-image:url(../image/slider.gif); + z-index:1; /* swap between 1 and 2 to position on top */ + z-index:2; + opacity:0.90; + /* filter:alpha(opacity=90); IE7 can't apply opacity to PNGs without messing up alpha transparency. Boo urns. */ + _background-image:none; + _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/slider-1.png'); +} + +.sm2player .mid:hover .slider { + opacity:0.95; + filter:alpha(opacity=95); +} + +.sm2player .mid>.slider.active { + -moz-opacity:0.85; + filter:alpha(opacity=85); +} + +.sm2player .mid .text, +.sm2player .mid .default, +.sm2player .mid .seek, +.sm2player .mid .divider { + display:none; +} + +.sm2player .mid .caption { + *position:absolute; /* required for scroll positioning to work under IE */ + display:inline; + white-space:nowrap; + visibility:hidden; /* hidden by default */ +} + +.sm2player .mid .seek { + position:absolute; + left:0px; + top:0px; + text-indent:2px; +} + +.sm2player .right { + background:transparent url(../image/skin-0-ui.png) 100% 0px no-repeat; + _background-image:url(../image/skin-0-ui.gif); + margin-left:1px; + _margin-left:0px; /* IE <7 sucks. */ +} + +.sm2player .right .divider { + /* one-pixel visual divider between bar / cap (yep, this is a UI nit-pick.) */ + float:left; + display:inline; + width:1px; + height:20px; + overflow:hidden; + background:transparent url(../image/skin-0-ui.png) -1006px 0px no-repeat; + _background-image:url(../image/skin-0-ui.gif); + margin-left:-1px; + _display:none; /* IE <7 sucks. */ +} + +.sm2player .right .time { + float:left; + display:inline; + width:3em; + text-align:center; + margin:0px 1px 0px 3px; +} + +.sm2player .right .trigger { + float:left; + display:inline; + width:14px; + height:20px; +} + +.sm2player .right .trigger span { + display:block; + height:20px; +} + +.sm2player .right .trigger.prev { + margin-left:1px; +} + +.sm2player .right .trigger.s0 { + width:16px; +} + +.sm2player .right .trigger.s1 { + width:18px; +} + +.sm2player .right .trigger.s2 { + width:20px; +} + +.sm2player .right .trigger.s3 { + width:12px; +} + +.sm2player .right .trigger.s4 { + width:13px; +} + +.sm2player .right .trigger { + background:transparent; +} + +.sm2player .right .trigger.prev { +} + +.sm2player .right .trigger.dropdown { + width:14px; + margin-right:2px; +} + +.sm2player .right .trigger.dropdown span { + xwidth:14px; +} + +.sm2player .right .trigger span { + background:transparent url(../image/sec-right-arr0.png) 3px 7px no-repeat; + _background-image:url(../image/sec-right-arr0.gif); + _background-position:0px 0px; + _background-image:none; +} + +.sm2player .right .trigger.dropdown span { + _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/sec-right-arr0.png'); + _margin:7px 0px 0px 3px; + _height:13px; +} + +.sm2player .right .trigger.prev span { + background:transparent url(../image/btn-prev.png) 4px 6px no-repeat; + _background-image:url(../image/btn-prev.gif); +} + +.sm2player .right .trigger.next span { + background:transparent url(../image/btn-next.png) 3px 6px no-repeat; + _background-image:url(../image/btn-next.gif); +} + +.sm2player .right .trigger.loop span { + background:transparent url(../image/loop.png) 3px 5px no-repeat; + opacity:0.5; + filter:alpha(opacity=50); + _background-image:none; + _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/loop.png'); + _margin:5px 0px 0px 3px; + _height:15px; +} + +.sm2player .right .trigger.loop:hover>span { + opacity:0.75; + filter:alpha(opacity=75); +} + +.sm2player .right .trigger.loop.active>span { + /*background-image:url(../image/loop-light.png);*/ + opacity:1; + filter:none; +} + +.sm2player .right .trigger.shuffle span { + background:transparent url(../image/shuffle-1.png) 2px 5px no-repeat; + opacity:0.5; + filter:alpha(opacity=50); + _background-image:none; + _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/shuffle-1.png'); + _margin:5px 0px 0px 2px; + _height:15px; +} + +.sm2player .right .trigger.shuffle:hover>span { + opacity:0.75; + filter:alpha(opacity=75); +} + +.sm2player .right .trigger.shuffle.active>span { + opacity:1; + filter:none; +} + +.sm2player .right .trigger.mute span { + background:transparent url(../image/speaker.png) 3px 5px no-repeat; + _background-image:none; + _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/speaker.png'); + _margin:5px 0px 0px 3px; + _height:15px; +} + +.sm2player .right .trigger.mute:hover>span { + opacity:0.75; + filter:alpha(opacity=75); +} + +.sm2player .right .trigger.mute.active>span { + opacity:0.5; + filter:alpha(opacity=50); +} + +.sm2player .right .trigger.volume span { + background:transparent url(../image/volume.png) 0px 4px no-repeat; + _background-image:none; + _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop src='image/volume.png'); + _margin:4px 0px 0px 0px; + _height:16px; +} + +.sm2player .right .trigger:hover { + background:transparent url(../image/ui-highlight-2.png) -2px 0px no-repeat; + _background-image:url(../image/ui-highlight-2.gif); + /*_background-position:2px 2px;*/ +} + +.sm2playlist-box { + position:absolute; + /*width:256px;*/ + /*overflow:hidden;*/ + /*max-height:33.1em;*/ + left:1px; + top:22px; + overflow:auto; + margin-top:-4px; +} + +.sm2playlist { + position:relative; + /* zoom:1; stupid IE. */ + margin-top:-999em; /* hidden by default */ +} + +.sm2playlist .hd, +.sm2playlist .c { + position:relative; + height:3px; +} + +.sm2playlist .hd { + background:transparent url(../image/skin-0-ui.png) no-repeat 0px 0px; + _background-image:url(../image/skin-0.ui.gif); + margin-right:2px; +} + +.sm2playlist .hd .c { + /* not used? */ +} + +.sm2playlist .bd { + background:transparent url(../image/shade-left.png) repeat-y 0px 0px; + _background-image:none; + margin-right:2px; +} + +.sm2playlist ul { + list-style-type:none; + margin:0px; + padding:0px; + padding-right:4px; /* space for background */ + margin-right:-2px; + background:transparent url(../image/shade-right.png) repeat-y 100% 0px; + _background-image:none; + zoom:1; /* Even IE 7 needs this (!?) */ +} + +.sm2playlist ul li { + line-height:1.5em; +} + +.sm2playlist ul li a { + display:block; + background:transparent; + margin-left:2px; + margin-right:-2px; + color:#999; + text-indent:0.25em; + text-decoration:none; + width:100%; /* stupid IE 7. */ +} + +.sm2playlist ul li a span { + display:block; + background:#222; + padding:0.1em 0.5em; + border-top:1px solid #333; + border-bottom:1px solid #000; + /* genie animation test */ +/* + white-space:nowrap; + overflow:hidden; +*/ +} + +.sm2playlist ul li.alt a span { + background:#303030; + color:#c3c3c3; +} + +.sm2playlist ul li:first-child a span { + border-top:none; +} + +.sm2playlist ul li:last-child a span { + /*border-bottom:none;*/ +} + +.sm2playlist ul li a:hover span { + background-color:#444; + color:#fff; +} + +.sm2playlist ul li a:hover span { + border-color:transparent; + _border-color:#333; +} + +.sm2playlist ul li.highlight a { + background-color:#660000; +} + +.sm2playlist ul li.highlight a span { + background:#161616 url(../image/notreallyajaxandyouknowit-dark.gif) no-repeat right 50%; + border-color:#000; + color:#ff9999; +} + +.sm2playlist ul li.highlight a:hover { + background-color:#880000; + color:#fff; +} + +.sm2playlist ul li a:focus { + outline:none; +} + +.sm2playlist .ft { + background:transparent url(../image/skin-0-ui.png) no-repeat 0px 100%; + _background-image:url(../image/skin-0-ui.gif); + margin-right:2px; + height:2px; +} + +.sm2playlist .ft .c { + position:absolute; + right:0px; + bottom:0px; + background:transparent url(../image/skin-0-ui.png) no-repeat 100% 100%; + _background-image:url(../image/skin-0-ui.gif); + margin-left:3px; /* leave room for left cap */ + margin-right:-1px; + /* not needed */ + display:none; + +} + +#soundmanager-debug { + position:absolute; + position:fixed; + right:20px; + bottom:20px; + display:none; + font-size:xx-small; + height:20em; + overflow:auto; + /* background:transparent url(../image/whiteout.png); */ + background:#000; + padding:1em; + color:#fff; + filter:alpha(opacity=90); + opacity:0.9; +} -- cgit v1.2.3-70-g09d2