Project modals wip.
This commit is contained in:
parent
0dcf836149
commit
05d00703c6
File diff suppressed because one or more lines are too long
BIN
img/project-6-cover.png
Normal file
BIN
img/project-6-cover.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 136 KiB |
35
index.html
35
index.html
@ -18,15 +18,15 @@
|
|||||||
<span aria-hidden="true"></span>
|
<span aria-hidden="true"></span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div id="navbarBasicExample" class="navbar-menu">
|
<div class="navbar-menu">
|
||||||
<div class="navbar-end">
|
<div class="navbar-end">
|
||||||
<div class="navbar-item">
|
<div class="navbar-item">
|
||||||
<a href="https://github.com/mmacneil" class="icon is-large">
|
<a href="https://github.com/mmacneil" class="icon is-large has-text-light">
|
||||||
<i class="fab fa-2x fa-github"></i>
|
<i class="fab fa-2x fa-github"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="navbar-item">
|
<div class="navbar-item">
|
||||||
<a href="https://fullstackmark.com" class="icon is-large">
|
<a href="https://fullstackmark.com" class="icon is-large has-text-light">
|
||||||
<i class="fas fa-2x fa-globe"></i>
|
<i class="fas fa-2x fa-globe"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
@ -50,7 +50,7 @@
|
|||||||
Mark Macneil
|
Mark Macneil
|
||||||
</h1>
|
</h1>
|
||||||
<h2 class="subtitle">
|
<h2 class="subtitle">
|
||||||
FullStack .NET Developer, Halifax, NS
|
FullStack .NET guy, Halifax, NS
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -126,7 +126,7 @@
|
|||||||
<p class="title">Project</p>
|
<p class="title">Project</p>
|
||||||
<p class="subtitle">Client</p>
|
<p class="subtitle">Client</p>
|
||||||
<figure class="image is-4by3">
|
<figure class="image is-4by3">
|
||||||
<img src="img/project-1-cover.png">
|
<img class="modal-trigger" data-target="project-1-modal" src="img/project-1-cover.png">
|
||||||
</figure>
|
</figure>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
@ -178,10 +178,10 @@
|
|||||||
|
|
||||||
<div class="tile is-parent">
|
<div class="tile is-parent">
|
||||||
<article class="tile is-child notification">
|
<article class="tile is-child notification">
|
||||||
<p class="title">Middle tile</p>
|
<p class="title">Project</p>
|
||||||
<p class="subtitle">With an image</p>
|
<p class="subtitle">Client</p>
|
||||||
<figure class="image is-4by3">
|
<figure class="image is-4by3">
|
||||||
<img src="https://bulma.io/images/placeholders/640x480.png">
|
<img src="img/project-6-cover.png">
|
||||||
</figure>
|
</figure>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
@ -191,6 +191,23 @@
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<div id="project-1-modal" class="modal">
|
||||||
|
<div class="modal-background"></div>
|
||||||
|
<div class="modal-card">
|
||||||
|
<header class="modal-card-head">
|
||||||
|
<p class="modal-card-title">Modal title</p>
|
||||||
|
<button class="delete" aria-label="close"></button>
|
||||||
|
</header>
|
||||||
|
<section class="modal-card-body">
|
||||||
|
<!-- Content ... -->
|
||||||
|
</section>
|
||||||
|
<footer class="modal-card-foot">
|
||||||
|
<button class="button is-success">Save changes</button>
|
||||||
|
<button class="button">Cancel</button>
|
||||||
|
</footer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- <h1 class="title">
|
<!-- <h1 class="title">
|
||||||
Bulma
|
Bulma
|
||||||
</h1>
|
</h1>
|
||||||
@ -219,6 +236,8 @@
|
|||||||
<a class="button is-primary">Primary</a>
|
<a class="button is-primary">Primary</a>
|
||||||
<a class="button is-link">Link</a>
|
<a class="button is-link">Link</a>
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
||||||
|
<script src="js/bundle.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
@ -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){}]);
|
!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){}]);
|
Loading…
Reference in New Issue
Block a user