Browse Source

More style tweaks to twitter and storify (more to come)

pull/127/head
Zach Wise 13 years ago
parent
commit
c27bdf8f56
  1. 20
      compiled/css/themes/dark.css
  2. 70
      compiled/css/timeline.css
  3. BIN
      compiled/css/timeline.png
  4. 2
      compiled/js/timeline-embed.js
  5. 6
      compiled/js/timeline-min.js
  6. 73
      compiled/js/timeline.js
  7. BIN
      source/gfx/timeline.psd
  8. 36
      source/js/VMM.Timeline.DataObj.js
  9. 17
      source/less/GFX.less
  10. 87
      source/less/VMM.Slider.less
  11. 2
      source/less/VMM.Timeline.less

20
compiled/css/themes/dark.css

@ -40,9 +40,10 @@
.vmm-timeline .vcard a:hover{text-decoration:none;}.vmm-timeline .vcard a:hover .fn{text-decoration:underline;}
.vmm-timeline .vcard .fn,.vmm-timeline .vcard .nickname{padding-left:42px;}
.vmm-timeline .vcard .fn{display:block;font-weight:bold;}
.vmm-timeline .vcard .nickname{margin-top:3px;display:block;color:#aaaaaa;}
.vmm-timeline .vcard .nickname{margin-top:1px;display:block;color:#aaaaaa;}
.vmm-timeline .vcard .avatar{float:left;display:block;width:32px;height:32px;}.vmm-timeline .vcard .avatar img{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}
.vmm-timeline .thumbnail{width:24px;height:24px;overflow:hidden;float:left;margin-right:1px;margin-top:6px;}
.vmm-timeline .thumbnail{width:24px;height:24px;overflow:hidden;float:left;margin:0;margin-right:1px;margin-top:6px;border:0;padding:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.vmm-timeline a.thumbnail:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.vmm-timeline .thumbnail.thumb-plaintext{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-280px -48px;}
.vmm-timeline .thumbnail.thumb-quote{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-232px -48px;}
.vmm-timeline .thumbnail.thumb-document{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-256px -48px;}
@ -57,9 +58,12 @@
.vmm-timeline .thumbnail.thumb-link{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-184px -72px;}
.vmm-timeline .thumbnail.thumb-wikipedia{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-184px -48px;}
.vmm-timeline .thumbnail.thumb-storify{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-328px -96px;}
.vmm-timeline .thumb-storify-full{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-280px -96px;width:48px;height:24px;}
.vmm-timeline .thumb-storify-full{height:12px;background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-280px -96px;width:48px;}
.vmm-timeline thumbnail.thumb-instagram{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-208px -96px;}
.vmm-timeline thumbnail.thumb-instagram-full{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-232px -96px;width:48px;height:24px;}
.vmm-timeline .thumbnail-inline{width:16px;height:14px;overflow:hidden;display:inline-block;margin-right:1px;margin-left:3px;margin-top:2px;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.vmm-timeline .twitter .thumbnail-inline{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-160px -96px;}
.vmm-timeline .storify .thumbnail-inline{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-184px -96px;}
.vmm-timeline .zFront{z-index:204;}
.slider{width:100%;height:100%;overflow:hidden;}.slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;width:100%;height:100%;text-align:center;display:block;background-color:#1a1a1a;}.slider .slider-container-mask .slider-container .slider-item-container{display:table-cell;vertical-align:middle;}
.slider img,.slider embed,.slider object,.slider video,.slider iframe{max-width:100%;}
@ -89,10 +93,6 @@
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);-ms-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container span.messege{display:block;vertical-align:middle;margin-left:auto;margin-right:auto;text-align:center;background:#1a1a1a;font-size:28px;font-weight:bold;text-transform:uppercase;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text{display:table;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container{display:table-cell;vertical-align:middle;font-size:15px;line-height:20px;color:#aaaaaa;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container p{margin-bottom:20px;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote blockquote{color:#aaaaaa;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote p,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#1a1a1a;color:#ffffff;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote .quote-mark,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote blockquote .quote-mark{color:#aaaaaa;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter .created-at,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote .created-at{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-256px -24px;width:24px;height:24px;overflow:hidden;margin-left:15px;display:inline-block;float:right;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter .created-at:hover,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote .created-at:hover{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia{font-size:15px;line-height:20px;text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia .wiki-source{margin-bottom:15px;font-size:13px;line-height:19px;font-style:italic;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia h4{border-bottom:1px solid #333333;margin-bottom:5px;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia h4 a{color:#ffffff;}
@ -104,6 +104,12 @@
.slider .slider-item .content .content-container .media .media-wrapper .credit{color:#999999;text-align:right;display:block;margin:0 auto;margin-top:6px;font-size:10px;line-height:13px;}
.slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#aaaaaa;font-size:11px;line-height:14px;text-rendering:optimizeLegibility;word-wrap:break-word;}
.slider .slider-item .content .media.text-media .media-wrapper .media-container{border:none;background-color:#1a1a1a;}
.slider .slider-item .content .created-at{width:24px;height:24px;overflow:hidden;margin-left:7.5px;margin-top:2px;display:inline-block;float:right;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.slider .slider-item .content .created-at:hover{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.slider .slider-item .content .storify .created-at{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-328px -96px;}
.slider .slider-item .content .twitter .created-at{background-image:url(themes/timeline-dark.png);background-repeat:no-repeat;background-position:-256px -24px;}
.slider .slider-item .content .twitter,.slider .slider-item .content .plain-text-quote,.slider .slider-item .content .storify{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .twitter blockquote,.slider .slider-item .content .plain-text-quote blockquote,.slider .slider-item .content .storify blockquote{color:#aaaaaa;}.slider .slider-item .content .twitter blockquote p,.slider .slider-item .content .plain-text-quote blockquote p,.slider .slider-item .content .storify blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#1a1a1a;color:#ffffff;}
.slider .slider-item .content .twitter blockquote .quote-mark,.slider .slider-item .content .plain-text-quote blockquote .quote-mark,.slider .slider-item .content .storify blockquote .quote-mark{color:#aaaaaa;}
.slider .slider-item .content-container.layout-text-media .text-media{border-top:1px solid #e3e3e3;padding-top:15px;padding-right:0;}
.slider .slider-item .content-container.layout-text-media.pad-left .text-media{padding-right:15px;padding-top:0;border-right:1px solid #e3e3e3;border-top:0px solid #e3e3e3;}
.slider .slider-item .content-container.layout-text{width:100%;}.slider .slider-item .content-container.layout-text .text{width:100%;max-width:100%;}.slider .slider-item .content-container.layout-text .text .container{display:block;vertical-align:middle;text-align:left;padding:0px;width:90%;text-align:left;margin-left:auto;margin-right:auto;}

70
compiled/css/timeline.css

@ -40,26 +40,30 @@
.vmm-timeline .vcard a:hover{text-decoration:none;}.vmm-timeline .vcard a:hover .fn{text-decoration:underline;}
.vmm-timeline .vcard .fn,.vmm-timeline .vcard .nickname{padding-left:42px;}
.vmm-timeline .vcard .fn{display:block;font-weight:bold;}
.vmm-timeline .vcard .nickname{margin-top:3px;display:block;color:#666666;}
.vmm-timeline .vcard .nickname{margin-top:1px;display:block;color:#666666;}
.vmm-timeline .vcard .avatar{float:left;display:block;width:32px;height:32px;}.vmm-timeline .vcard .avatar img{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}
.vmm-timeline .thumbnail{width:24px;height:24px;overflow:hidden;float:left;margin-right:1px;margin-top:6px;}
.vmm-timeline .thumbnail.thumb-plaintext{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-280px -48px;}
.vmm-timeline .thumbnail.thumb-quote{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-232px -48px;}
.vmm-timeline .thumbnail.thumb-document{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-256px -48px;}
.vmm-timeline .thumbnail.thumb-photo{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-280px -24px;border:0;}.vmm-timeline .thumbnail.thumb-photo img{border:0px none #cccccc !important;}
.vmm-timeline .thumbnail.thumb-twitter{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-256px -24px;}
.vmm-timeline .thumbnail.thumb-vimeo{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-328px -48px;}
.vmm-timeline .thumbnail.thumb-youtube{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-328px -72px;}
.vmm-timeline .thumbnail.thumb-video{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-328px -24px;}
.vmm-timeline .thumbnail.thumb-audio{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-304px -24px;}
.vmm-timeline .thumbnail.thumb-map{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-208px -48px;}
.vmm-timeline .thumbnail.thumb-website{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-232px -24px;}
.vmm-timeline .thumbnail.thumb-link{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-184px -72px;}
.vmm-timeline .thumbnail.thumb-wikipedia{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-184px -48px;}
.vmm-timeline .thumbnail.thumb-storify{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-328px -96px;}
.vmm-timeline .thumb-storify-full{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-280px -96px;width:48px;height:24px;}
.vmm-timeline thumbnail.thumb-instagram{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-208px -96px;}
.vmm-timeline thumbnail.thumb-instagram-full{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-232px -96px;width:48px;height:24px;}
.vmm-timeline .thumbnail{width:24px;height:24px;overflow:hidden;float:left;margin:0;margin-right:1px;margin-top:6px;border:0;padding:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.vmm-timeline a.thumbnail:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.vmm-timeline .thumbnail.thumb-plaintext{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-280px -48px;}
.vmm-timeline .thumbnail.thumb-quote{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-232px -48px;}
.vmm-timeline .thumbnail.thumb-document{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-256px -48px;}
.vmm-timeline .thumbnail.thumb-photo{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-280px -24px;border:0;}.vmm-timeline .thumbnail.thumb-photo img{border:0px none #cccccc !important;}
.vmm-timeline .thumbnail.thumb-twitter{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-256px -24px;}
.vmm-timeline .thumbnail.thumb-vimeo{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-328px -48px;}
.vmm-timeline .thumbnail.thumb-youtube{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-328px -72px;}
.vmm-timeline .thumbnail.thumb-video{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-328px -24px;}
.vmm-timeline .thumbnail.thumb-audio{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-304px -24px;}
.vmm-timeline .thumbnail.thumb-map{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-208px -48px;}
.vmm-timeline .thumbnail.thumb-website{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-232px -24px;}
.vmm-timeline .thumbnail.thumb-link{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-184px -72px;}
.vmm-timeline .thumbnail.thumb-wikipedia{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-184px -48px;}
.vmm-timeline .thumbnail.thumb-storify{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-328px -96px;}
.vmm-timeline .thumb-storify-full{height:12px;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-280px -96px;width:48px;}
.vmm-timeline thumbnail.thumb-instagram{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-208px -96px;}
.vmm-timeline thumbnail.thumb-instagram-full{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-232px -96px;width:48px;height:24px;}
.vmm-timeline .thumbnail-inline{width:16px;height:14px;overflow:hidden;display:inline-block;margin-right:1px;margin-left:3px;margin-top:2px;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.vmm-timeline .twitter .thumbnail-inline{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-160px -96px;}
.vmm-timeline .storify .thumbnail-inline{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-184px -96px;}
.vmm-timeline .zFront{z-index:204;}
.slider{width:100%;height:100%;overflow:hidden;}.slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;width:100%;height:100%;text-align:center;display:block;background-color:#ffffff;}.slider .slider-container-mask .slider-container .slider-item-container{display:table-cell;vertical-align:middle;}
.slider img,.slider embed,.slider object,.slider video,.slider iframe{max-width:100%;}
@ -70,10 +74,10 @@
.slider .nav-previous .date,.slider .nav-next .date{font-size:13px;line-height:13px;font-weight:bold;text-transform:uppercase;margin-bottom:5px;}
.slider .nav-previous .title,.slider .nav-next .title{font-size:11px;line-height:13px;}
.slider .nav-previous:hover,.slider .nav-next:hover{color:#333333;cursor:pointer;}
.slider .nav-previous{float:left;text-align:left;}.slider .nav-previous .icon{margin-left:15px;height:24px;background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-160px 0;width:24px;height:24px;overflow:hidden;}
.slider .nav-previous{float:left;text-align:left;}.slider .nav-previous .icon{margin-left:15px;height:24px;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-160px 0;width:24px;height:24px;overflow:hidden;}
.slider .nav-previous .date,.slider .nav-previous .title{text-align:left;padding-left:15px;}
.slider .nav-previous:hover .icon{margin-left:10px;}
.slider .nav-next{float:right;text-align:right;}.slider .nav-next .icon{margin-left:61px;background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-184px 0;width:24px;height:24px;height:24px;overflow:hidden;}
.slider .nav-next{float:right;text-align:right;}.slider .nav-next .icon{margin-left:61px;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-184px 0;width:24px;height:24px;height:24px;overflow:hidden;}
.slider .nav-next .date,.slider .nav-next .title{text-align:right;padding-right:15px;}
.slider .nav-next:hover .icon{margin-left:66px;}
.slider .slider-item{position:absolute;width:700px;height:100%;padding:0px;margin:0px;display:table;overflow-y:auto;}.slider .slider-item .content{display:table-cell;vertical-align:middle;}.slider .slider-item .content .pad-top .text .container{padding-top:15px;}
@ -89,10 +93,6 @@
.slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);-ms-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container span.messege{display:block;vertical-align:middle;margin-left:auto;margin-right:auto;text-align:center;background:#ffffff;font-size:28px;font-weight:bold;text-transform:uppercase;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text{display:table;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container{display:table-cell;vertical-align:middle;font-size:15px;line-height:20px;color:#666666;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container p{margin-bottom:20px;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote blockquote{color:#666666;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote p,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;color:#000000;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter blockquote .quote-mark,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote blockquote .quote-mark{color:#666666;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter .created-at,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote .created-at{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-256px -24px;width:24px;height:24px;overflow:hidden;margin-left:15px;display:inline-block;float:right;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .twitter .created-at:hover,.slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text-quote .created-at:hover{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia{font-size:15px;line-height:20px;text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia .wiki-source{margin-bottom:15px;font-size:13px;line-height:19px;font-style:italic;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia h4{border-bottom:1px solid #cccccc;margin-bottom:5px;}
.slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia h4 a{color:#000000;}
@ -104,6 +104,12 @@
.slider .slider-item .content .content-container .media .media-wrapper .credit{color:#999999;text-align:right;display:block;margin:0 auto;margin-top:6px;font-size:10px;line-height:13px;}
.slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#666666;font-size:11px;line-height:14px;text-rendering:optimizeLegibility;word-wrap:break-word;}
.slider .slider-item .content .media.text-media .media-wrapper .media-container{border:none;background-color:#ffffff;}
.slider .slider-item .content .created-at{width:24px;height:24px;overflow:hidden;margin-left:7.5px;margin-top:2px;display:inline-block;float:right;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.slider .slider-item .content .created-at:hover{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.slider .slider-item .content .storify .created-at{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-328px -96px;}
.slider .slider-item .content .twitter .created-at{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-256px -24px;}
.slider .slider-item .content .twitter,.slider .slider-item .content .plain-text-quote,.slider .slider-item .content .storify{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.slider .slider-item .content .twitter blockquote,.slider .slider-item .content .plain-text-quote blockquote,.slider .slider-item .content .storify blockquote{color:#666666;}.slider .slider-item .content .twitter blockquote p,.slider .slider-item .content .plain-text-quote blockquote p,.slider .slider-item .content .storify blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;color:#000000;}
.slider .slider-item .content .twitter blockquote .quote-mark,.slider .slider-item .content .plain-text-quote blockquote .quote-mark,.slider .slider-item .content .storify blockquote .quote-mark{color:#666666;}
.slider .slider-item .content-container.layout-text-media .text-media{border-top:1px solid #e3e3e3;padding-top:15px;padding-right:0;}
.slider .slider-item .content-container.layout-text-media.pad-left .text-media{padding-right:15px;padding-top:0;border-right:1px solid #e3e3e3;border-top:0px solid #e3e3e3;}
.slider .slider-item .content-container.layout-text{width:100%;}.slider .slider-item .content-container.layout-text .text{width:100%;max-width:100%;}.slider .slider-item .content-container.layout-text .text .container{display:block;vertical-align:middle;text-align:left;padding:0px;width:90%;text-align:left;margin-left:auto;margin-right:auto;}
@ -112,19 +118,19 @@
.slider .slider-item .content-container.layout-media .twitter,.slider .slider-item .content-container.layout-media .wikipedia{max-width:70%;}
.vmm-timeline .navigation{clear:both;cursor:move;width:100%;height:200px;border-top:1px solid #e3e3e3;position:relative;}.vmm-timeline .navigation .toolbar{position:absolute;top:45px;left:0px;z-index:202;background-color:#ffffff;border:1px solid #cccccc;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);}.vmm-timeline .navigation .toolbar .zoom-in,.vmm-timeline .navigation .toolbar .zoom-out,.vmm-timeline .navigation .toolbar .back-home{font-weight:normal;font-size:10px;line-height:20px;top:0px;z-index:202;width:18px;height:18px;color:#333333;text-align:center;font-weight:bold;border:1px solid #ffffff;padding:5px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vmm-timeline .navigation .toolbar .zoom-in:hover,.vmm-timeline .navigation .toolbar .zoom-out:hover,.vmm-timeline .navigation .toolbar .back-home:hover{color:#0088cc;cursor:pointer;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vmm-timeline .navigation .toolbar .zoom-in .icon{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .zoom-out .icon{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .back-home .icon{background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .zoom-in .icon{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .zoom-out .icon{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vmm-timeline .navigation .toolbar .back-home .icon{background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vmm-timeline .navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#e9e9e9;}.vmm-timeline .navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#ffffff;width:100%;height:49px;-webkit-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);-moz-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);}.vmm-timeline .navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#ffffff;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vmm-timeline .navigation .timenav-background .timenav-line{position:absolute;top:0px;left:50%;width:3px;height:150px;background:#0088cc;z-index:201;-webkit-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);}
.vmm-timeline .navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}
.vmm-timeline .navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}
.vmm-timeline .navigation .timenav-background .timenav-tag{height:50px;}.vmm-timeline .navigation .timenav-background .timenav-tag div{height:50px;display:table;}.vmm-timeline .navigation .timenav-background .timenav-tag div h3{display:table-cell;vertical-align:middle;padding-left:65px;font-size:15px;color:#9d9d9d;}
.vmm-timeline .navigation .timenav-background .timenav-tag-row-2{background:#f1f1f1;}
.vmm-timeline .navigation .timenav-background .timenav-tag-row-3{background:#e9e9e9;}
.vmm-timeline .navigation .timenav{position:absolute;top:0px;left:-250px;z-index:1;}.vmm-timeline .navigation .timenav .content{position:relative;}.vmm-timeline .navigation .timenav .content .marker.start{display:none;}
.vmm-timeline .navigation .timenav .content .marker.active .dot{background:#0088cc;z-index:200;}
.vmm-timeline .navigation .timenav .content .marker.active .line{z-index:199;background:#0088cc;width:1px;}.vmm-timeline .navigation .timenav .content .marker.active .line .event-line{background:#0088cc;filter:alpha(opacity=75);-khtml-opacity:0.75;-moz-opacity:0.75;opacity:0.75;}
.vmm-timeline .navigation .timenav .content .marker.active .flag{z-index:200;background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vmm-timeline .navigation .timenav .content .marker.active .flag .flag-content h3{color:#0088cc;}
.vmm-timeline .navigation .timenav .content .marker.active .flag{z-index:200;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vmm-timeline .navigation .timenav .content .marker.active .flag .flag-content h3{color:#0088cc;}
.vmm-timeline .navigation .timenav .content .marker.active .flag .flag-content .thumbnail{opacity:1;-moz-opacity:1;filter:alpha(opacity=100);}
.vmm-timeline .navigation .timenav .content .marker.active .flag.row1,.vmm-timeline .navigation .timenav .content .marker.active .flag.row2,.vmm-timeline .navigation .timenav .content .marker.active .flag.row3{z-index:200;}
.vmm-timeline .navigation .timenav .content .marker.active:hover{cursor:default;}.vmm-timeline .navigation .timenav .content .marker.active:hover .flag .flag-content h3{color:#0088cc;}
@ -132,10 +138,10 @@
.vmm-timeline .navigation .timenav .content .marker:hover .line{z-index:24;background:#999999;}
.vmm-timeline .navigation .timenav .content .marker{position:absolute;top:0px;left:150px;display:block;}.vmm-timeline .navigation .timenav .content .marker .dot{position:absolute;top:150px;left:0px;display:block;width:6px;height:6px;background:#333333;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;z-index:21;}
.vmm-timeline .navigation .timenav .content .marker .line{position:absolute;top:0px;left:3px;width:1px;height:150px;background:#cccccc;-moz-box-shadow:1px 0 0 #ffffff;-webkit-box-shadow:1px 0 0 #ffffff;box-shadow:1px 0 0 #ffffff;z-index:22;}.vmm-timeline .navigation .timenav .content .marker .line .event-line{position:absolute;z-index:22;left:0px;height:1px;width:1px;background:#0088cc;filter:alpha(opacity=15);-khtml-opacity:0.15;-moz-opacity:0.15;opacity:0.15;}
.vmm-timeline .navigation .timenav .content .marker .flag{position:absolute;top:15px;left:3px;padding:0px;display:block;z-index:23;width:153px;height:56px;background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:0 0;width:153px;height:53px;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content{padding:0px 7px 2px 6px;overflow:hidden;height:36px;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content h3{font-weight:bold;font-size:15px;line-height:20px;font-size:11px;line-height:11px;color:#999999;margin-top:5px;margin-bottom:2px;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content h3 small{display:none;}
.vmm-timeline .navigation .timenav .content .marker .flag{position:absolute;top:15px;left:3px;padding:0px;display:block;z-index:23;width:153px;height:56px;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:0 0;width:153px;height:53px;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content{padding:0px 7px 2px 6px;overflow:hidden;height:36px;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content h3{font-weight:bold;font-size:15px;line-height:20px;font-size:11px;line-height:11px;color:#999999;margin-top:5px;margin-bottom:2px;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content h3 small{display:none;}
.vmm-timeline .navigation .timenav .content .marker .flag .flag-content h4{display:none;font-weight:normal;font-size:15px;line-height:20px;margin-top:5px;font-size:10px;line-height:10px;color:#aaaaaa;}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content h4 small{display:none;}
.vmm-timeline .navigation .timenav .content .marker .flag .flag-content .thumbnail{margin-bottom:15px;margin-right:3px;opacity:0.5;-moz-opacity:0.5;filter:alpha(opacity=50);}.vmm-timeline .navigation .timenav .content .marker .flag .flag-content .thumbnail img{width:22px;height:22px;max-height:none;max-width:none;border:0;border:1px solid #999999;padding:0;margin:0;}
.vmm-timeline .navigation .timenav .content .marker .flag:hover{cursor:pointer;background-image:url(timeline.png?v2.2);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vmm-timeline .navigation .timenav .content .marker .flag:hover .flag-content h3{color:#333333;}
.vmm-timeline .navigation .timenav .content .marker .flag:hover{cursor:pointer;background-image:url(timeline.png?v2.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vmm-timeline .navigation .timenav .content .marker .flag:hover .flag-content h3{color:#333333;}
.vmm-timeline .navigation .timenav .content .marker .flag:hover .flag-content h4{color:#aaaaaa;}
.vmm-timeline .navigation .timenav .content .marker .flag:hover .flag-content .thumbnail{opacity:1;-moz-opacity:1;filter:alpha(opacity=100);}
.vmm-timeline .navigation .timenav .content .marker .flag.row1{z-index:25;top:48px;}

BIN
compiled/css/timeline.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 14 KiB

2
compiled/js/timeline-embed.js

File diff suppressed because one or more lines are too long

6
compiled/js/timeline-min.js vendored

File diff suppressed because one or more lines are too long

73
compiled/js/timeline.js

@ -2380,13 +2380,13 @@ if(typeof VMM != 'undefined' && typeof VMM.ExternalAPI == 'undefined') {
//td = td.replace(/(#([\w]+))/g,"<a href='http://twitter.com/#search?q=%23$2' target='_blank'>$1</a>");
twit += td;
twit += "</p></blockquote>";
twit += " <a href='https://twitter.com/" + d.user.screen_name + "/status/" + d.id_str + "' target='_blank' alt='link to original tweet' title='link to original tweet'>" + "<span class='created-at'></span>" + " </a>";
//twit += " <a href='https://twitter.com/" + d.user.screen_name + "/status/" + d.id_str + "' target='_blank' alt='link to original tweet' title='link to original tweet'>" + "<span class='created-at'></span>" + " </a>";
twit += "<div class='vcard author'>";
twit += "<a class='screen-name url' href='https://twitter.com/" + d.user.screen_name + "' data-screen-name='" + d.user.screen_name + "' target='_blank'>";
twit += "<span class='avatar'><img src=' " + d.user.profile_image_url + "' alt=''></span>";
twit += "<span class='fn'>" + d.user.name + "</span>";
twit += "<span class='nickname'>@" + d.user.screen_name + "</span>";
twit += "<span class='nickname'>@" + d.user.screen_name + "<span class='thumbnail-inline'></span></span>";
twit += "</a>";
twit += "</div>";
@ -2805,14 +2805,15 @@ if(typeof VMM != 'undefined' && typeof VMM.ExternalAPI == 'undefined') {
wikipedia: {
get: function(url, id) {
var api_obj = {url: url, id: id};
get: function(url, id, lang) {
var api_obj = {url: url, id: id, lang: lang};
VMM.master_config.wikipedia.que.push(api_obj);
VMM.master_config.wikipedia.active = true;
},
create: function(api_obj) {
var the_url = "http://" + VMM.master_config.language.api.wikipedia + ".wikipedia.org/w/api.php?action=query&prop=extracts&redirects=&titles=" + api_obj.url + "&exintro=1&format=json&callback=?";
var the_url = "http://" + api_obj.lang + ".wikipedia.org/w/api.php?action=query&prop=extracts&redirects=&titles=" + api_obj.url + "&exintro=1&format=json&callback=?";
if ( VMM.Browser.browser == "Explorer" && parseInt(VMM.Browser.version, 10) >= 7 && window.XDomainRequest) {
var temp_text = "<h4><a href='http://" + VMM.master_config.language.api.wikipedia + ".wikipedia.org/wiki/" + api_obj.url + "' target='_blank'>" + api_obj.url + "</a></h4>";
temp_text += "<span class='wiki-source'>" + VMM.master_config.language.messages.wikipedia + "</span>";
@ -2822,12 +2823,21 @@ if(typeof VMM != 'undefined' && typeof VMM.ExternalAPI == 'undefined') {
VMM.getJSON(the_url, function(d) {
if (d.query) {
var wiki_extract = VMM.Util.getObjectAttributeByIndex(d.query.pages, 0).extract;
var wiki_title = VMM.Util.getObjectAttributeByIndex(d.query.pages, 0).title;
var _wiki = "";
var wiki_text = "";
var wiki_text_array = wiki_extract.split("<p>");
var wiki_number_of_paragraphs = 1;
var wiki_extract,
wiki_title,
_wiki = "",
wiki_text = "",
wiki_number_of_paragraphs = 1,
wiki_text_array = [];
wiki_extract = VMM.Util.getObjectAttributeByIndex(d.query.pages, 0).extract;
wiki_title = VMM.Util.getObjectAttributeByIndex(d.query.pages, 0).title;
if (wiki_extract.match("<p>")) {
wiki_text_array = wiki_extract.split("<p>");
} else {
wiki_text_array.push(wiki_extract);
}
for(var i = 0; i < wiki_text_array.length; i++) {
if (i+1 <= wiki_number_of_paragraphs && i+1 < wiki_text_array.length) {
@ -3153,7 +3163,7 @@ if(typeof VMM != 'undefined' && typeof VMM.MediaElement == 'undefined') {
_id = "wikipedia_" + VMM.Util.unique_ID(7);
mediaElem = "<div class='wikipedia' id='" + _id + "'><span class='messege'><p>Loading Wikipedia</p></span></div>";
isTextMedia = true;
VMM.ExternalAPI.wikipedia.get(m.id, _id);
VMM.ExternalAPI.wikipedia.get(m.id, _id, m.lang);
// STORIFY
} else if (m.type == "storify") {
isTextMedia = true;
@ -3273,7 +3283,8 @@ if(typeof VMM != 'undefined' && typeof VMM.MediaType == 'undefined') {
media.type = "wikipedia";
//media.id = d.split("wiki\/")[1];
var wiki_id = d.split("wiki\/")[1].split("#")[0].replace("_", " ");
media.id = VMM.Util.toTitleCase(wiki_id).replace(" ", "%20");
media.id = wiki_id.replace(" ", "%20");
media.lang = d.split("//")[1].split(".wikipedia")[0];
success = true;
} else if (d.indexOf('http://') == 0) {
media.type = "website";
@ -7802,17 +7813,29 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
//d.permalink
var tt = "";
var t_name = d.content.author.username;
var t_nickname = "";
if (typeof d.content.author.name != 'undefined') {
t_name = d.content.author.name;
t_nickname = d.content.author.username + "&nbsp;";
}
if (typeof d.content.description != 'undefined' && d.content.description != null) {
tt += d.content.description;
}
tt += "<div class='storify'><div class='vcard author'><a class='screen-name url' href='" + d.content.author.permalink + "' target='_blank'>";
tt += "<div class='storify'>"
//tt += " <a href='" + d.content.permalink + "' target='_blank' alt='link to original story' title='link to original story'>" + "<span class='created-at'></span>" + " </a>";
tt += "<div class='vcard author'><a class='screen-name url' href='" + d.content.author.permalink + "' target='_blank'>";
tt += "<span class='avatar'><img src='" + d.content.author.avatar + "' style='max-width: 32px; max-height: 32px;'></span>"
tt += "<span class='fn'>" + d.content.author.username + "</span>";
tt += "<span class='nickname'><div class='thumb-storify-full'></div></span>";
tt += "<span class='fn'>" + t_name + "</span>";
tt += "<span class='nickname'>" + t_nickname + "<span class='thumbnail-inline'></span></span>";
tt += "</a>";
//tt += "<span class='nickname'>" + d.content.author.stats.stories + " Stories</span>";
//tt += "<span class='nickname'>" + d.content.author.stats.subscribers + " Subscribers</span>";
tt += "</div></div>";
tt += "</div>"
tt += "</div>";
_data_obj.timeline.text = tt;
_data_obj.timeline.asset.media = d.content.thumbnail;
@ -7901,11 +7924,21 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
} else if (dd.type == "text") {
if (dd.permalink.match("storify")) {
is_text = true;
var asset_text = "<div class='storify'><blockquote><p>" + dd.data.text.replace(/<\s*\/?\s*b\s*.*?>/g,"") + "</p></blockquote>";
var d_name = d.content.author.username;
var d_nickname = "";
if (typeof dd.attribution.name != 'undefined') {
t_name = dd.attribution.name;
t_nickname = dd.attribution.username + "&nbsp;";
}
var asset_text = "<div class='storify'>"
asset_text += "<blockquote><p>" + dd.data.text.replace(/<\s*\/?\s*b\s*.*?>/g,"") + "</p></blockquote>";
//asset_text += " <a href='" + dd.attribution.href + "' target='_blank' alt='link to author' title='link to author'>" + "<span class='created-at'></span>" + " </a>";
asset_text += "<div class='vcard author'><a class='screen-name url' href='" + dd.attribution.href + "' target='_blank'>";
asset_text += "<span class='avatar'><img src='" + dd.attribution.thumbnail + "' style='max-width: 32px; max-height: 32px;'></span>"
asset_text += "<span class='fn'>" + dd.attribution.username + "</span>";
asset_text += "<span class='nickname'><div class='thumb-storify-full'></div></span>";
asset_text += "<span class='fn'>" + t_name + "</span>";
asset_text += "<span class='nickname'>" + t_nickname + "<span class='thumbnail-inline'></span></span>";
asset_text += "</a></div></div>";
_date.text = asset_text;

BIN
source/gfx/timeline.psd

Binary file not shown.

36
source/js/VMM.Timeline.DataObj.js

@ -245,17 +245,29 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
//d.permalink
var tt = "";
var t_name = d.content.author.username;
var t_nickname = "";
if (typeof d.content.author.name != 'undefined') {
t_name = d.content.author.name;
t_nickname = d.content.author.username + "&nbsp;";
}
if (typeof d.content.description != 'undefined' && d.content.description != null) {
tt += d.content.description;
}
tt += "<div class='storify'><div class='vcard author'><a class='screen-name url' href='" + d.content.author.permalink + "' target='_blank'>";
tt += "<div class='storify'>"
//tt += " <a href='" + d.content.permalink + "' target='_blank' alt='link to original story' title='link to original story'>" + "<span class='created-at'></span>" + " </a>";
tt += "<div class='vcard author'><a class='screen-name url' href='" + d.content.author.permalink + "' target='_blank'>";
tt += "<span class='avatar'><img src='" + d.content.author.avatar + "' style='max-width: 32px; max-height: 32px;'></span>"
tt += "<span class='fn'>" + d.content.author.username + "</span>";
tt += "<span class='nickname'><div class='thumb-storify-full'></div></span>";
tt += "<span class='fn'>" + t_name + "</span>";
tt += "<span class='nickname'>" + t_nickname + "<span class='thumbnail-inline'></span></span>";
tt += "</a>";
//tt += "<span class='nickname'>" + d.content.author.stats.stories + " Stories</span>";
//tt += "<span class='nickname'>" + d.content.author.stats.subscribers + " Subscribers</span>";
tt += "</div></div>";
tt += "</div>"
tt += "</div>";
_data_obj.timeline.text = tt;
_data_obj.timeline.asset.media = d.content.thumbnail;
@ -344,11 +356,21 @@ if(typeof VMM.Timeline != 'undefined' && typeof VMM.Timeline.DataObj == 'undefin
} else if (dd.type == "text") {
if (dd.permalink.match("storify")) {
is_text = true;
var asset_text = "<div class='storify'><blockquote><p>" + dd.data.text.replace(/<\s*\/?\s*b\s*.*?>/g,"") + "</p></blockquote>";
var d_name = d.content.author.username;
var d_nickname = "";
if (typeof dd.attribution.name != 'undefined') {
t_name = dd.attribution.name;
t_nickname = dd.attribution.username + "&nbsp;";
}
var asset_text = "<div class='storify'>"
asset_text += "<blockquote><p>" + dd.data.text.replace(/<\s*\/?\s*b\s*.*?>/g,"") + "</p></blockquote>";
//asset_text += " <a href='" + dd.attribution.href + "' target='_blank' alt='link to author' title='link to author'>" + "<span class='created-at'></span>" + " </a>";
asset_text += "<div class='vcard author'><a class='screen-name url' href='" + dd.attribution.href + "' target='_blank'>";
asset_text += "<span class='avatar'><img src='" + dd.attribution.thumbnail + "' style='max-width: 32px; max-height: 32px;'></span>"
asset_text += "<span class='fn'>" + dd.attribution.username + "</span>";
asset_text += "<span class='nickname'><div class='thumb-storify-full'></div></span>";
asset_text += "<span class='fn'>" + t_name + "</span>";
asset_text += "<span class='nickname'>" + t_nickname + "<span class='thumbnail-inline'></span></span>";
asset_text += "</a></div></div>";
_date.text = asset_text;

17
source/less/GFX.less

@ -112,11 +112,15 @@
/* Thumbnail Icons (Extra)
----------------------------------------------------------------- */
.icon-wikipedia() {
.icon-twitter-inline() {
.base-sprite();
background-repeat:no-repeat;
background-position: -184px -48px;
background-position: -160px -96px;
}
.icon-storify-inline() {
.base-sprite();
background-repeat:no-repeat;
background-position: -184px -96px;
}
.icon-storify() {
.base-sprite();
@ -128,7 +132,12 @@
background-repeat:no-repeat;
background-position: -280px -96px;
width:@base-thumb*2;
height:@base-thumb;
//height:12px;
}
.icon-wikipedia() {
.base-sprite();
background-repeat:no-repeat;
background-position: -184px -48px;
}
.icon-instagram() {
.base-sprite();

87
source/less/VMM.Slider.less

@ -296,44 +296,9 @@
}
}
}
.twitter, .plain-text-quote {
text-align:left;
margin-left: auto;
margin-right: auto;
margin-bottom:@base-space;
clear:both;
blockquote {
//font-size: @base-font;
//line-height: @base-line;
color:@color-feature-description;
p {
font-size: 28px;
line-height: 36px;
margin-bottom: 6px;
padding-top: 10px;
background-color:@white;
color:@color-feature-title;
//margin-left:10px;
}
.quote-mark {
color:@color-dark-third;
}
}
.created-at {
.icon-twitter();
width:24px;
height:24px;
overflow:hidden;
margin-left:@base-space;
display:inline-block;
float:right;
.opacity(25);
}
.created-at:hover {
.opacity(100);
}
}
.wikipedia {
font-size: @base-font;
line-height: @base-line;
@ -449,6 +414,54 @@
}
}
}
.created-at {
width:24px;
height:24px;
overflow:hidden;
margin-left:@base-space/2;
margin-top:2px;
display:inline-block;
float:right;
.opacity(25);
}
.created-at:hover {
.opacity(100);
}
.storify {
.created-at {
.icon-storify();
}
}
.twitter {
.created-at {
.icon-twitter();
}
}
.twitter, .plain-text-quote, .storify {
text-align:left;
margin-left: auto;
margin-right: auto;
margin-bottom:@base-space;
clear:both;
blockquote {
//font-size: @base-font;
//line-height: @base-line;
color:@color-feature-description;
p {
font-size: 28px;
line-height: 36px;
margin-bottom: 6px;
padding-top: 10px;
background-color:@white;
color:@color-feature-title;
}
.quote-mark {
color:@color-dark-third;
}
}
}
}

2
source/less/VMM.Timeline.less

@ -21,7 +21,7 @@
----------------------------------------------------- */
//GFX
.base-sprite() {
background-image: url(timeline.png?v2.2);
background-image: url(timeline.png?v2.4);
}
// COLORS
@color-base: #FFF;

Loading…
Cancel
Save