From 5fb63895a1078729ca42981380014caa1d3e17dc Mon Sep 17 00:00:00 2001 From: Leander Hutton Date: Sun, 2 Jan 2022 21:52:32 -0500 Subject: [PATCH] Added colorbox --- static/css/colorbox.css | 50 +++++++++++ static/css/images/controls.png | Bin 0 -> 503 bytes static/css/images/loading.gif | Bin 0 -> 6244 bytes static/css/justifiedGallery.min.css | 102 +++++++++++++++++++++++ static/js/jquery.colorbox-min.js | 6 ++ static/js/jquery.justifiedGallery.min.js | 8 ++ static/js/jquery.min.js | 2 + static/js/load-colorbox.js | 7 ++ templates/base.html | 4 + templates/base.html.old | 85 +++++++++++++++++++ templates/landing.html.old | 83 ++++++++++++++++++ templates/portfolio.html.old | 84 +++++++++++++++++++ 12 files changed, 431 insertions(+) create mode 100644 static/css/colorbox.css create mode 100644 static/css/images/controls.png create mode 100644 static/css/images/loading.gif create mode 100644 static/css/justifiedGallery.min.css create mode 100644 static/js/jquery.colorbox-min.js create mode 100644 static/js/jquery.justifiedGallery.min.js create mode 100644 static/js/jquery.min.js create mode 100644 static/js/load-colorbox.js create mode 100644 templates/base.html.old create mode 100644 templates/landing.html.old create mode 100644 templates/portfolio.html.old diff --git a/static/css/colorbox.css b/static/css/colorbox.css new file mode 100644 index 0000000..208b8ee --- /dev/null +++ b/static/css/colorbox.css @@ -0,0 +1,50 @@ +/* + Colorbox Core Style: + The following CSS is consistent between example themes and should not be altered. +*/ +#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);} +#cboxWrapper {max-width:none;} +#cboxOverlay{position:fixed; width:100%; height:100%;} +#cboxMiddleLeft, #cboxBottomLeft{clear:left;} +#cboxContent{position:relative;} +#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} +#cboxTitle{margin:0;} +#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} +#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} +.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} +.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;} +#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} + +/* + User Style: + Change the following styles to modify the appearance of Colorbox. They are + ordered & tabbed in a way that represents the nesting of the generated HTML. +*/ +#cboxOverlay{background:#fff; opacity: 0.9; filter: alpha(opacity = 90);} +#colorbox{outline:0;} + #cboxContent{margin-top:32px; overflow:visible; background:#000;} + .cboxIframe{background:#fff;} + #cboxError{padding:50px; border:1px solid #ccc;} + #cboxLoadedContent{background:#000; padding:1px;} + #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;} + #cboxLoadingOverlay{background:#000;} + #cboxTitle{position:absolute; top:-22px; left:0; color:#000;} + #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;} + + /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */ + #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(images/controls.png) no-repeat 0 0;} + + /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */ + #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} + + #cboxPrevious{background-position:0px 0px; right:44px;} + #cboxPrevious:hover{background-position:0px -25px;} + #cboxNext{background-position:-25px 0px; right:22px;} + #cboxNext:hover{background-position:-25px -25px;} + #cboxClose{background-position:-50px 0px; right:0;} + #cboxClose:hover{background-position:-50px -25px;} + .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;} + .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;} + .cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;} + .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;} + .cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;} diff --git a/static/css/images/controls.png b/static/css/images/controls.png new file mode 100644 index 0000000000000000000000000000000000000000..36f5269929f735d3d3d14424f03fd7f3010045c7 GIT binary patch literal 503 zcmVQvGG};B5A2d>; z`je}=1^Jhm`qW>d=5@(X;wfqp5zC7xY5KLHsKHI)ugz!V^z|WQ5G@grgb<^mpB`H} zW~d_aZoY|?qhnAH9ubM?Q+{M8B1Eja$*vFiawj$>< zcl;^3jy`qk{QLUWuSQZQ=j@%)I5_6g@dSx z);f7w8#O&GAZlPy__Uae1XCY6Ako4ARxAK3dN9z^Aww0Bck@k7Ia&vGG5}z${g5Ad z{MiD4x|{48%9o(%@R3Gz2PL<@OID4C8ZWh$*srh9)Zg$ybRA6W*4^*xOTRAkPN%^q zZ-Ek=bK*L>?9gA*5*_QWl5aNqSGE@Kn002ovPDHLkV1k`%>Zt$# literal 0 HcmV?d00001 diff --git a/static/css/images/loading.gif b/static/css/images/loading.gif new file mode 100644 index 0000000000000000000000000000000000000000..a32df5c0881b563e18f3660758009a4aec47a5a0 GIT binary patch literal 6244 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 literal 0 HcmV?d00001 diff --git a/static/css/justifiedGallery.min.css b/static/css/justifiedGallery.min.css new file mode 100644 index 0000000..8b753dc --- /dev/null +++ b/static/css/justifiedGallery.min.css @@ -0,0 +1,102 @@ +/*! + * justifiedGallery - v3.7.0 + * http://miromannino.github.io/Justified-Gallery/ + * Copyright (c) 2018 Miro Mannino + * Licensed under the MIT license. + */ +.justified-gallery { + width: 100%; + position: relative; + overflow: hidden; +} +.justified-gallery > a, +.justified-gallery > div, +.justified-gallery > figure { + position: absolute; + display: inline-block; + overflow: hidden; + /* background: #888888; To have gray placeholders while the gallery is loading with waitThumbnailsLoad = false */ + filter: "alpha(opacity=10)"; + opacity: 0.1; + margin: 0; + padding: 0; +} +.justified-gallery > a > img, +.justified-gallery > div > img, +.justified-gallery > figure > img, +.justified-gallery > a > a > img, +.justified-gallery > div > a > img, +.justified-gallery > figure > a > img { + position: absolute; + top: 50%; + left: 50%; + margin: 0; + padding: 0; + border: none; + filter: "alpha(opacity=0)"; + opacity: 0; +} +.justified-gallery > a > .caption, +.justified-gallery > div > .caption, +.justified-gallery > figure > .caption { + display: none; + position: absolute; + bottom: 0; + padding: 5px; + background-color: #000000; + left: 0; + right: 0; + margin: 0; + color: white; + font-size: 12px; + font-weight: 300; + font-family: sans-serif; +} +.justified-gallery > a > .caption.caption-visible, +.justified-gallery > div > .caption.caption-visible, +.justified-gallery > figure > .caption.caption-visible { + display: initial; + filter: "alpha(opacity=70)"; + opacity: 0.7; + -webkit-transition: opacity 500ms ease-in; + -moz-transition: opacity 500ms ease-in; + -o-transition: opacity 500ms ease-in; + transition: opacity 500ms ease-in; +} +.justified-gallery > .entry-visible { + filter: "alpha(opacity=100)"; + opacity: 1; + background: none; +} +.justified-gallery > .entry-visible > img, +.justified-gallery > .entry-visible > a > img { + filter: "alpha(opacity=100)"; + opacity: 1; + -webkit-transition: opacity 500ms ease-in; + -moz-transition: opacity 500ms ease-in; + -o-transition: opacity 500ms ease-in; + transition: opacity 500ms ease-in; +} +.justified-gallery > .jg-filtered { + display: none; +} +.justified-gallery > .spinner { + position: absolute; + bottom: 0; + margin-left: -24px; + padding: 10px 0 10px 0; + left: 50%; + filter: "alpha(opacity=100)"; + opacity: 1; + overflow: initial; +} +.justified-gallery > .spinner > span { + display: inline-block; + filter: "alpha(opacity=0)"; + opacity: 0; + width: 8px; + height: 8px; + margin: 0 4px 0 4px; + background-color: #000; + border-radius: 6px; +} diff --git a/static/js/jquery.colorbox-min.js b/static/js/jquery.colorbox-min.js new file mode 100644 index 0000000..b5109a2 --- /dev/null +++ b/static/js/jquery.colorbox-min.js @@ -0,0 +1,6 @@ +/*! + Colorbox 1.6.4 + license: MIT + http://www.jacklmoore.com/colorbox +*/ +(function(t,e,i){function n(i,n,o){var r=e.createElement(i);return n&&(r.id=Z+n),o&&(r.style.cssText=o),t(r)}function o(){return i.innerHeight?i.innerHeight:t(i).height()}function r(e,i){i!==Object(i)&&(i={}),this.cache={},this.el=e,this.value=function(e){var n;return void 0===this.cache[e]&&(n=t(this.el).attr("data-cbox-"+e),void 0!==n?this.cache[e]=n:void 0!==i[e]?this.cache[e]=i[e]:void 0!==X[e]&&(this.cache[e]=X[e])),this.cache[e]},this.get=function(e){var i=this.value(e);return t.isFunction(i)?i.call(this.el,this):i}}function h(t){var e=W.length,i=(A+t)%e;return 0>i?e+i:i}function a(t,e){return Math.round((/%/.test(t)?("x"===e?E.width():o())/100:1)*parseInt(t,10))}function s(t,e){return t.get("photo")||t.get("photoRegex").test(e)}function l(t,e){return t.get("retinaUrl")&&i.devicePixelRatio>1?e.replace(t.get("photoRegex"),t.get("retinaSuffix")):e}function d(t){"contains"in x[0]&&!x[0].contains(t.target)&&t.target!==v[0]&&(t.stopPropagation(),x.focus())}function c(t){c.str!==t&&(x.add(v).removeClass(c.str).addClass(t),c.str=t)}function g(e){A=0,e&&e!==!1&&"nofollow"!==e?(W=t("."+te).filter(function(){var i=t.data(this,Y),n=new r(this,i);return n.get("rel")===e}),A=W.index(_.el),-1===A&&(W=W.add(_.el),A=W.length-1)):W=t(_.el)}function u(i){t(e).trigger(i),ae.triggerHandler(i)}function f(i){var o;if(!G){if(o=t(i).data(Y),_=new r(i,o),g(_.get("rel")),!U){U=$=!0,c(_.get("className")),x.css({visibility:"hidden",display:"block",opacity:""}),I=n(se,"LoadedContent","width:0; height:0; overflow:hidden; visibility:hidden"),b.css({width:"",height:""}).append(I),j=T.height()+k.height()+b.outerHeight(!0)-b.height(),D=C.width()+H.width()+b.outerWidth(!0)-b.width(),N=I.outerHeight(!0),z=I.outerWidth(!0);var h=a(_.get("initialWidth"),"x"),s=a(_.get("initialHeight"),"y"),l=_.get("maxWidth"),f=_.get("maxHeight");_.w=Math.max((l!==!1?Math.min(h,a(l,"x")):h)-z-D,0),_.h=Math.max((f!==!1?Math.min(s,a(f,"y")):s)-N-j,0),I.css({width:"",height:_.h}),J.position(),u(ee),_.get("onOpen"),O.add(F).hide(),x.focus(),_.get("trapFocus")&&e.addEventListener&&(e.addEventListener("focus",d,!0),ae.one(re,function(){e.removeEventListener("focus",d,!0)})),_.get("returnFocus")&&ae.one(re,function(){t(_.el).focus()})}var p=parseFloat(_.get("opacity"));v.css({opacity:p===p?p:"",cursor:_.get("overlayClose")?"pointer":"",visibility:"visible"}).show(),_.get("closeButton")?B.html(_.get("close")).appendTo(b):B.appendTo("
"),w()}}function p(){x||(V=!1,E=t(i),x=n(se).attr({id:Y,"class":t.support.opacity===!1?Z+"IE":"",role:"dialog",tabindex:"-1"}).hide(),v=n(se,"Overlay").hide(),L=t([n(se,"LoadingOverlay")[0],n(se,"LoadingGraphic")[0]]),y=n(se,"Wrapper"),b=n(se,"Content").append(F=n(se,"Title"),R=n(se,"Current"),P=t('