diff --git a/src/dist/css/main.bundle.css b/src/dist/css/main.bundle.css index 2ffb9b6..55011db 100644 --- a/src/dist/css/main.bundle.css +++ b/src/dist/css/main.bundle.css @@ -1,4 +1,4 @@ -@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700,900);.card-gap{margin-top:1.75rem} +@import url(https://fonts.googleapis.com/css?family=Lato:300,400,700,900);.card-gap{margin-top:1.75rem}.modal-trigger{cursor:pointer} /*! bulma.io v0.7.5 | MIT License | github.com/jgthms/bulma */@keyframes spinAround{0%{transform:rotate(0deg)}to{transform:rotate(359deg)}}.breadcrumb,.button,.delete,.file,.is-unselectable,.modal-close,.pagination-ellipsis,.pagination-link,.pagination-next,.pagination-previous,.tabs{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.navbar-link:not(.is-arrowless):after,.select:not(.is-multiple):not(.is-loading):after{border:3px solid transparent;border-radius:2px;border-right:0;border-top:0;content:" ";display:block;height:.625em;margin-top:-.4375em;pointer-events:none;position:absolute;top:50%;transform:rotate(-45deg);transform-origin:center;width:.625em}.block:not(:last-child),.box:not(:last-child),.breadcrumb:not(:last-child),.content:not(:last-child),.highlight:not(:last-child),.level:not(:last-child),.list:not(:last-child),.message:not(:last-child),.notification:not(:last-child),.progress:not(:last-child),.subtitle:not(:last-child),.table-container:not(:last-child),.table:not(:last-child),.tabs:not(:last-child),.title:not(:last-child){margin-bottom:1.5rem}.delete,.modal-close{-moz-appearance:none;-webkit-appearance:none;background-color:rgba(51,51,51,.2);border:none;border-radius:290486px;cursor:pointer;pointer-events:auto;display:inline-block;flex-grow:0;flex-shrink:0;font-size:0;height:20px;max-height:20px;max-width:20px;min-height:20px;min-width:20px;outline:none;position:relative;vertical-align:top;width:20px}.delete:after,.delete:before,.modal-close:after,.modal-close:before{background-color:#fff;content:"";display:block;left:50%;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%) rotate(45deg);transform-origin:center center}.delete:before,.modal-close:before{height:2px;width:50%}.delete:after,.modal-close:after{height:50%;width:2px}.delete:focus,.delete:hover,.modal-close:focus,.modal-close:hover{background-color:rgba(51,51,51,.3)}.delete:active,.modal-close:active{background-color:rgba(51,51,51,.4)}.is-small.delete,.is-small.modal-close{height:16px;max-height:16px;max-width:16px;min-height:16px;min-width:16px;width:16px}.is-medium.delete,.is-medium.modal-close{height:24px;max-height:24px;max-width:24px;min-height:24px;min-width:24px;width:24px}.is-large.delete,.is-large.modal-close{height:32px;max-height:32px;max-width:32px;min-height:32px;min-width:32px;width:32px}.button.is-loading:after,.control.is-loading:after,.loader,.select.is-loading:after{animation:spinAround .5s linear infinite;border-radius:290486px;border-color:transparent transparent #dbdbdb #dbdbdb;border-style:solid;border-width:2px;content:"";display:block;height:1em;position:relative;width:1em}.hero-video,.image.is-1by1 .has-ratio,.image.is-1by1 img,.image.is-1by2 .has-ratio,.image.is-1by2 img,.image.is-1by3 .has-ratio,.image.is-1by3 img,.image.is-2by1 .has-ratio,.image.is-2by1 img,.image.is-2by3 .has-ratio,.image.is-2by3 img,.image.is-3by1 .has-ratio,.image.is-3by1 img,.image.is-3by2 .has-ratio,.image.is-3by2 img,.image.is-3by4 .has-ratio,.image.is-3by4 img,.image.is-3by5 .has-ratio,.image.is-3by5 img,.image.is-4by3 .has-ratio,.image.is-4by3 img,.image.is-4by5 .has-ratio,.image.is-4by5 img,.image.is-5by3 .has-ratio,.image.is-5by3 img,.image.is-5by4 .has-ratio,.image.is-5by4 img,.image.is-9by16 .has-ratio,.image.is-9by16 img,.image.is-16by9 .has-ratio,.image.is-16by9 img,.image.is-square .has-ratio,.image.is-square img,.is-overlay,.modal,.modal-background{bottom:0;left:0;position:absolute;right:0;top:0}.button,.file-cta,.file-name,.input,.pagination-ellipsis,.pagination-link,.pagination-next,.pagination-previous,.select select,.textarea{-moz-appearance:none;-webkit-appearance:none;align-items:center;border:2px solid transparent;border-radius:4px;box-shadow:none;display:inline-flex;font-size:1rem;height:2.25em;justify-content:flex-start;line-height:1.5;padding:calc(.375em - 2px) calc(.625em - 2px);position:relative;vertical-align:top}.button:active,.button:focus,.file-cta:active,.file-cta:focus,.file-name:active,.file-name:focus,.input:active,.input:focus,.is-active.button,.is-active.file-cta,.is-active.file-name,.is-active.input,.is-active.pagination-ellipsis,.is-active.pagination-link,.is-active.pagination-next,.is-active.pagination-previous,.is-active.textarea,.is-focused.button,.is-focused.file-cta,.is-focused.file-name,.is-focused.input,.is-focused.pagination-ellipsis,.is-focused.pagination-link,.is-focused.pagination-next,.is-focused.pagination-previous,.is-focused.textarea,.pagination-ellipsis:active,.pagination-ellipsis:focus,.pagination-link:active,.pagination-link:focus,.pagination-next:active,.pagination-next:focus,.pagination-previous:active,.pagination-previous:focus,.select select.is-active,.select select.is-focused,.select select:active,.select select:focus,.textarea:active,.textarea:focus{outline:none}.button[disabled],.file-cta[disabled],.file-name[disabled],.input[disabled],.pagination-ellipsis[disabled],.pagination-link[disabled],.pagination-next[disabled],.pagination-previous[disabled],.select fieldset[disabled] select,.select select[disabled],.textarea[disabled],fieldset[disabled] .button,fieldset[disabled] .file-cta,fieldset[disabled] .file-name,fieldset[disabled] .input,fieldset[disabled] .pagination-ellipsis,fieldset[disabled] .pagination-link,fieldset[disabled] .pagination-next,fieldset[disabled] .pagination-previous,fieldset[disabled] .select select,fieldset[disabled] .textarea{cursor:not-allowed} diff --git a/src/dist/img/project-6-cover.png b/src/dist/img/project-6-cover.png new file mode 100644 index 0000000..2867339 Binary files /dev/null and b/src/dist/img/project-6-cover.png differ diff --git a/src/dist/index.html b/src/dist/index.html index cec6082..74187b0 100644 --- a/src/dist/index.html +++ b/src/dist/index.html @@ -18,15 +18,15 @@ - @@ -178,10 +178,10 @@
-

Middle tile

-

With an image

+

Project

+

Client

- +
@@ -191,6 +191,23 @@ + + + + \ No newline at end of file diff --git a/src/dist/js/bundle.js b/src/dist/js/bundle.js index 3f43fcf..e904818 100644 --- a/src/dist/js/bundle.js +++ b/src/dist/js/bundle.js @@ -1 +1 @@ -!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){n(1)},function(e,t,n){}]); \ No newline at end of file +!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="",n(n.s=0)}([function(e,t,n){n(1);var r=document.documentElement,o=u(".modal"),c=u(".modal-trigger"),i=u(".modal-card-head .delete, .modal-card-foot .button");function u(e){return Array.prototype.slice.call(document.querySelectorAll(e),0)}c.length>0&&c.forEach(function(e){e.addEventListener("click",function(){!function(e){var t=document.getElementById(e);r.classList.add("is-clipped"),t.classList.add("is-active")}(e.dataset.target)})}),i.length>0&&i.forEach(function(e){e.addEventListener("click",function(){r.classList.remove("is-clipped"),o.forEach(function(e){e.classList.remove("is-active")})})})},function(e,t,n){}]); \ No newline at end of file diff --git a/src/src/index.js b/src/src/index.js index cfe6c1e..f58eae2 100644 --- a/src/src/index.js +++ b/src/src/index.js @@ -1 +1,45 @@ -require('./styles.scss'); \ No newline at end of file +require('./styles.scss'); + + +// Modals + +var rootEl = document.documentElement; +var $modals = getAll('.modal'); +var $modalTriggers = getAll('.modal-trigger'); +var $modalCloses = getAll('.modal-card-head .delete, .modal-card-foot .button'); + +if ($modalTriggers.length > 0) { + $modalTriggers.forEach(function ($el) { + $el.addEventListener('click', function () { + var target = $el.dataset.target; + openModal(target); + }); + }); +} + +if ($modalCloses.length > 0) { + $modalCloses.forEach(function ($el) { + $el.addEventListener('click', function () { + closeModals(); + }); + }); +} + +function openModal(target) { + var $target = document.getElementById(target); + rootEl.classList.add('is-clipped'); + $target.classList.add('is-active'); +} + +function closeModals() { + rootEl.classList.remove('is-clipped'); + $modals.forEach(function ($el) { + $el.classList.remove('is-active'); + }); +} + +// Functions + +function getAll(selector) { + return Array.prototype.slice.call(document.querySelectorAll(selector), 0); +} \ No newline at end of file diff --git a/src/src/styles.scss b/src/src/styles.scss index d571f6f..138cca0 100644 --- a/src/src/styles.scss +++ b/src/src/styles.scss @@ -30,6 +30,7 @@ $input-shadow: none; /* Styles */ .card-gap {margin-top:1.75rem} +.modal-trigger { cursor: pointer; } @import "~bulma/bulma"; // - import everything;