Skip to content

Yutaka Kobayashi / jsStudy

Go to a project
Commit c639920c by Yutaka Kobayashi
Options

閉じるボタンをpタグに変更

1 parent fb6bdbed
Inline Side-by-side
Showing with 26 additions and 15 deletions
develop/.tmp/assets/js/home.js
......@@ -15,7 +15,7 @@
\*******************************/
/***/ (function() {
eval("class Home {\n constructor() {\n this.modal();\n this.fadeIn();\n }\n\n modal() {\n const body = document.getElementsByTagName(\"body\")[0];\n const btn = document.querySelectorAll(\".novelList__button\");\n const modalBack = document.querySelector(\".modalBackground\");\n const modal = document.querySelectorAll(\".modal\");\n const closeBtn = document.querySelector(\".modal__button\");\n\n // モーダルを表示する\n for (let i = 0; i < btn.length; i++) {\n btn[i].addEventListener(\"click\", addOpen);\n function addOpen(e) {\n e.preventDefault();\n body.classList.add(\"open\");\n modalBack.classList.add(\"open\");\n modal[i].classList.add(\"open\");\n }\n }\n\n // モーダルを非表示にする\n closeBtn.addEventListener(\"click\", function () {\n body.classList.remove(\"open\");\n modalBack.classList.remove(\"open\");\n for (let i = 0; i < modal.length; i++) {\n modal[i].classList.remove(\"open\");\n }\n });\n\n function menuClick() {\n const menus = document.getElementsByClassName(\"close\");\n body.classList.remove(\"open\");\n modalBack.classList.remove(\"open\");\n const hogeElements = document.querySelectorAll(\".modal\");\n\n hogeElements.forEach((item) => {\n item.classList.remove(\"open\");\n });\n }\n\n const menus = document.getElementsByClassName(\"close\");\n for (let i = 0; i < menus.length; i++) {\n menus[i].addEventListener(\"click\", menuClick, false);\n }\n }\n\n // フェードイン\n fadeIn() {\n function scroll_effect() {\n var element = document.getElementsByClassName(\"scrollUp\");\n if (!element) return;\n\n var scrollY = window.pageYOffset;\n var windowHeight = window.innerHeight;\n var showTiming = 200;\n for (var i = 0; i < element.length; i++) {\n var elementClientRect = element[i].getBoundingClientRect();\n var elementY = scrollY + elementClientRect.top;\n if (scrollY > elementY - windowHeight + showTiming) {\n element[i].classList.add(\"is-show\");\n }\n }\n }\n window.addEventListener(\"scroll\", scroll_effect);\n }\n}\n\nwindow.addEventListener(\"DOMContentLoaded\", () => {\n new Home();\n});\n\n\n//# sourceURL=webpack://static-boilerplate/./src/assets/js/home.js?");
eval("class Home {\n constructor() {\n this.modal();\n this.fadeIn();\n }\n\n modal() {\n const body = document.getElementsByTagName(\"body\")[0];\n const btn = document.querySelectorAll(\".novelList__button\");\n const modalBack = document.querySelector(\".modalBackground\");\n const modal = document.querySelectorAll(\".modal\");\n const closeBtn = document.querySelector(\".modal__button\");\n\n // モーダルを表示する\n for (let i = 0; i < btn.length; i++) {\n btn[i].addEventListener(\"click\", addOpen);\n function addOpen(e) {\n e.preventDefault();\n body.classList.add(\"open\");\n modalBack.classList.add(\"open\");\n modal[i].classList.add(\"open\");\n }\n }\n\n // モーダルを非表示にする\n closeBtn.addEventListener(\"click\", function () {\n body.classList.remove(\"open\");\n modalBack.classList.remove(\"open\");\n for (let i = 0; i < modal.length; i++) {\n modal[i].classList.remove(\"open\");\n }\n });\n\n function menuClick() {\n const menus = document.getElementsByClassName(\"close\");\n body.classList.remove(\"open\");\n modalBack.classList.remove(\"open\");\n const hogeElements = document.querySelectorAll(\".modal\");\n\n hogeElements.forEach((item) => {\n item.classList.remove(\"open\");\n });\n }\n\n const menus = document.getElementsByClassName(\"close\");\n for (let i = 0; i < menus.length; i++) {\n menus[i].addEventListener(\"click\", menuClick, false);\n }\n\n const menus02 = document.getElementsByClassName(\"modal__button\");\n for (let i = 0; i < menus.length; i++) {\n menus02[i].addEventListener(\"click\", menuClick, false);\n }\n }\n\n // フェードイン\n fadeIn() {\n function scroll_effect() {\n var element = document.getElementsByClassName(\"scrollUp\");\n if (!element) return;\n\n var scrollY = window.pageYOffset;\n var windowHeight = window.innerHeight;\n var showTiming = 200;\n for (var i = 0; i < element.length; i++) {\n var elementClientRect = element[i].getBoundingClientRect();\n var elementY = scrollY + elementClientRect.top;\n if (scrollY > elementY - windowHeight + showTiming) {\n element[i].classList.add(\"is-show\");\n }\n }\n }\n window.addEventListener(\"scroll\", scroll_effect);\n }\n}\n\nwindow.addEventListener(\"DOMContentLoaded\", () => {\n new Home();\n});\n\n\n//# sourceURL=webpack://static-boilerplate/./src/assets/js/home.js?");
/***/ })
......
develop/.tmp/assets/styles/dist/modal.min.css
.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#0b0b0b;opacity:.8;filter:alpha(opacity=80)}.mfp-hide{display:none !important}.btn{width:200px;margin-left:20px}.btn__link{display:block;font-size:18px;text-align:center;background-color:#fff;color:#333;text-decoration:none;border:2px solid #333;border-radius:5px}.btn__text{display:block;padding:7px 5px}.modalBackground{width:100%;height:100vh;background-color:rgba(0,0,0,.6);position:fixed;top:0;left:0;opacity:0;visibility:hidden}.modal{background-color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:0;visibility:hidden;transition:opacity .3s;text-align:center;max-width:700px}.modal.open{opacity:1;visibility:inherit}.modalInner{padding:45px 172px 50px;position:relative}.close{width:25px;height:25px;position:absolute;top:-36px;right:0;cursor:pointer}.close__line{width:4px;height:25px;background-color:#fff;border-radius:2px}.close__line.--type01{display:inline-block;transform:rotate(45deg)}.close__line.--type02{position:absolute;top:0;left:40%;display:inline-block;transform:rotate(-45deg)}body.open{height:100vh;overflow-y:hidden}.modalBackground.open{opacity:1;visibility:inherit}.modal__title{font-size:20px;margin-bottom:30px;font-weight:800;text-align:center}.modal__text{text-align:left;line-height:1.7}.modal__button{background:#f8f8f8;padding:15px 100px;border-radius:50px;display:inline-block;margin-top:35px}/*# sourceMappingURL=modal.min.css.map */
.mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#0b0b0b;opacity:.8;filter:alpha(opacity=80)}.mfp-hide{display:none !important}.btn{width:200px;margin-left:20px}.btn__link{display:block;font-size:18px;text-align:center;background-color:#fff;color:#333;text-decoration:none;border:2px solid #333;border-radius:5px}.btn__text{display:block;padding:7px 5px}.modalBackground{width:100%;height:100vh;background-color:rgba(0,0,0,.6);position:fixed;top:0;left:0;opacity:0;visibility:hidden}.modal{background-color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);opacity:0;visibility:hidden;transition:opacity .3s;text-align:center;max-width:700px}.modal.open{opacity:1;visibility:inherit}.modalInner{padding:45px 172px 50px;position:relative}.close{width:25px;height:25px;position:absolute;top:-36px;right:0;cursor:pointer}.close__line{width:4px;height:25px;background-color:#fff;border-radius:2px}.close__line.--type01{display:inline-block;transform:rotate(45deg)}.close__line.--type02{position:absolute;top:0;left:40%;display:inline-block;transform:rotate(-45deg)}body.open{height:100vh;overflow-y:hidden}.modalBackground.open{opacity:1;visibility:inherit}.modal__title{font-size:20px;margin-bottom:30px;font-weight:800;text-align:center}.modal__text{text-align:left;line-height:1.7}.modal__button{background:#f8f8f8;padding:15px 100px;border-radius:50px;display:inline-block;margin-top:35px;cursor:pointer}/*# sourceMappingURL=modal.min.css.map */
develop/.tmp/assets/styles/dist/modal.min.css.map
{"version":3,"sourceRoot":"","sources":["../../../../src/assets/styles/dist/modal.min.scss"],"names":[],"mappings":"AACA,QACE,MACA,OACA,WACA,YACA,aACA,gBACA,eACA,mBACA,WACA,yBAGF,UACE,wBAIF,KACE,YACA,iBAGF,WACE,cACA,eACA,kBACA,sBACA,WACA,qBACA,sBACA,kBAGF,WACE,cACA,gBAIF,iBACE,WACA,aACA,gCACA,eACA,MACA,OACA,UACA,kBAGF,OACE,sBACA,kBACA,QACA,SACA,gCACA,UACA,kBACA,uBACA,kBACA,gBAEA,YACE,UACA,mBAIJ,YACE,wBACA,kBAIF,OACE,WACA,YACA,kBACA,UACA,QACA,eAGF,aACE,UACA,YACA,sBACA,kBAEA,sBACE,qBACA,wBAGF,sBACE,kBACA,MACA,SACA,qBACA,yBAKJ,UACE,aACA,kBAGF,sBACE,UACA,mBAGF,cACE,eACA,mBACA,gBACA,kBAGF,aACE,gBACA,gBAGF,eACE,mBACA,mBACA,mBACA,qBACA","file":"modal.min.css"}
\ No newline at end of file
{"version":3,"sourceRoot":"","sources":["../../../../src/assets/styles/dist/modal.min.scss"],"names":[],"mappings":"AACA,QACE,MACA,OACA,WACA,YACA,aACA,gBACA,eACA,mBACA,WACA,yBAGF,UACE,wBAIF,KACE,YACA,iBAGF,WACE,cACA,eACA,kBACA,sBACA,WACA,qBACA,sBACA,kBAGF,WACE,cACA,gBAIF,iBACE,WACA,aACA,gCACA,eACA,MACA,OACA,UACA,kBAGF,OACE,sBACA,kBACA,QACA,SACA,gCACA,UACA,kBACA,uBACA,kBACA,gBAEA,YACE,UACA,mBAIJ,YACE,wBACA,kBAIF,OACE,WACA,YACA,kBACA,UACA,QACA,eAGF,aACE,UACA,YACA,sBACA,kBAEA,sBACE,qBACA,wBAGF,sBACE,kBACA,MACA,SACA,qBACA,yBAKJ,UACE,aACA,kBAGF,sBACE,UACA,mBAGF,cACE,eACA,mBACA,gBACA,kBAGF,aACE,gBACA,gBAGF,eACE,mBACA,mBACA,mBACA,qBACA,gBACA","file":"modal.min.css"}
\ No newline at end of file
develop/.tmp/assets/styles/home.min.css
@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700&display=swap";:root{--colorPrimary: #0f68b7;--colorSub: #fff2c4}/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */*,::before,::after{box-sizing:border-box;border-style:solid;border-width:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0}main{display:block}p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}ul,ol{margin:0;padding:0;list-style:none}dt{font-weight:bold}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace,monospace;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{-webkit-text-decoration:underline dotted;-moz-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}svg,img,embed,object,iframe{vertical-align:bottom}button,input,optgroup,select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}button,[type=button],[type=reset],[type=submit]{cursor:pointer}button:disabled,[type=button]:disabled,[type=reset]:disabled,[type=submit]:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}option{padding:0}fieldset{margin:0;padding:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type=number]{-moz-appearance:textfield}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit;border-collapse:collapse}caption{text-align:left}td,th{vertical-align:top;padding:0}th{text-align:left;font-weight:bold}body{background:#f8f8f8;font-family:"Noto Sans JP",sans-serif}.content{text-align:center;padding-top:110px}.contentWrap{margin-bottom:100px}.contentBox{background:#fff;padding:53px 170px 66px 170px;display:inline-block;margin-right:auto;margin-left:auto}.contentBox.--music{letter-spacing:.1em;line-height:1.4}.novelTitle{font-size:28px;font-weight:800;text-align:center;margin-bottom:50px;letter-spacing:.1em}.novelList{width:700px;font-weight:800;margin:auto;letter-spacing:2.5px}.novelList__content{text-align:left;letter-spacing:.05em}.novelList__item{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:30px 0;border-bottom:1px solid #ededed}.novelList__item:first-child{padding-top:0}.novelList__title{font-size:20px;margin-bottom:10px}.novelList__author{font-size:16px}.novelList__button{font-size:14px;padding:18px 60px;border-radius:39px;border:2.5px solid #232323;letter-spacing:.1em}.musicTitle{font-size:28px;font-weight:800;margin-bottom:40px;padding-bottom:30px;border-bottom:1px solid #ededed}.musicList__item:not(:last-child){margin-bottom:60px}.albumTitle{font-size:28px;font-weight:800;margin-bottom:25px}.albumList{font-size:18px;font-weight:800;counter-reset:number}.albumList__item:before{counter-increment:number;content:counter(number) ". "}.scrollUp{opacity:0;visibility:hidden;-webkit-transform:translateY(50px);transform:translateY(50px);transition:all 1s}.scrollUp.is-show{opacity:1;visibility:visible;-webkit-transform:translateY(0px);transform:translateY(0px)}@media screen and (min-width: 801px){.onlySP{display:none !important}.onlySP{display:none !important}.contentBox{min-width:1040px}}@media screen and (max-width: 800px){.onlyPC{display:none !important}.onlyPC{display:none !important}}
@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@500;700&display=swap";:root{--colorPrimary: #0f68b7;--colorSub: #fff2c4}/*! destyle.css v4.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */*,::before,::after{box-sizing:border-box;border-style:solid;border-width:0}html{line-height:1.15;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{margin:0}main{display:block}p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}ul,ol{margin:0;padding:0;list-style:none}dt{font-weight:bold}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace,monospace;font-size:inherit}address{font-style:inherit}a{background-color:transparent;text-decoration:none;color:inherit}abbr[title]{-webkit-text-decoration:underline dotted;-moz-text-decoration:underline dotted;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}svg,img,embed,object,iframe{vertical-align:bottom}button,input,optgroup,select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}button,[type=button],[type=reset],[type=submit]{cursor:pointer}button:disabled,[type=button]:disabled,[type=reset]:disabled,[type=submit]:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}option{padding:0}fieldset{margin:0;padding:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type=number]{-moz-appearance:textfield}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit;border-collapse:collapse}caption{text-align:left}td,th{vertical-align:top;padding:0}th{text-align:left;font-weight:bold}body{background:#f8f8f8;font-family:"Noto Sans JP",sans-serif}.content{text-align:center;padding-top:110px}.contentWrap{margin-bottom:100px}.contentBox{background:#fff;padding:53px 170px 66px 170px;display:inline-block;margin-right:auto;margin-left:auto}.contentBox.--music{letter-spacing:.1em;line-height:1.4;position:relative;z-index:-1}.novelTitle{font-size:28px;font-weight:800;text-align:center;margin-bottom:50px;letter-spacing:.1em}.novelList{width:700px;font-weight:800;margin:auto;letter-spacing:2.5px}.novelList__content{text-align:left;letter-spacing:.05em}.novelList__item{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:30px 0;border-bottom:1px solid #ededed}.novelList__item:first-child{padding-top:0}.novelList__title{font-size:20px;margin-bottom:10px}.novelList__author{font-size:16px}.novelList__button{font-size:14px;padding:18px 60px;border-radius:39px;border:2.5px solid #232323;letter-spacing:.1em}.musicTitle{font-size:28px;font-weight:800;margin-bottom:40px;padding-bottom:30px;border-bottom:1px solid #ededed}.musicList__item:not(:last-child){margin-bottom:60px}.albumTitle{font-size:28px;font-weight:800;margin-bottom:25px}.albumList{font-size:18px;font-weight:800;counter-reset:number}.albumList__item:before{counter-increment:number;content:counter(number) ". "}.scrollUp{opacity:0;visibility:hidden;-webkit-transform:translateY(50px);transform:translateY(50px);transition:all 1s}.scrollUp.is-show{opacity:1;visibility:visible;-webkit-transform:translateY(0px);transform:translateY(0px)}@media screen and (min-width: 801px){.onlySP{display:none !important}.onlySP{display:none !important}.contentBox{min-width:1040px}}@media screen and (max-width: 800px){.onlyPC{display:none !important}.onlyPC{display:none !important}}
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hc3NldHMvc3R5bGVzL2hvbWUubWluLnNjc3MiLCIuLi8uLi8uLi9zcmMvYXNzZXRzL3N0eWxlcy91dGlscy9fdmFyaWFibGVzLnNjc3MiLCIuLi8uLi8uLi9zcmMvYXNzZXRzL3N0eWxlcy9iYXNlL19iYXNlLnNjc3MiLCIuLi8uLi8uLi9zcmMvYXNzZXRzL3N0eWxlcy91dGlscy9fbWl4aW5zLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR1Esd0ZBQUEsQ0NRUixNQUNFLHVCQUFBLENBQ0EsbUJBQUEsQ0NURixxRkFBQSxDQUtBLG1CQUdFLHFCQUFBLENBQ0Esa0JBQUEsQ0FDQSxjQUFBLENBWUYsS0FDRSxnQkFBQSxDQUNBLDZCQUFBLENBQ0EsdUNBQUEsQ0FVRixLQUNFLFFBQUEsQ0FPRixLQUNFLGFBQUEsQ0FNRixxREFTRSxRQUFBLENBTUYsa0JBTUUsaUJBQUEsQ0FDQSxtQkFBQSxDQUNBLFFBQUEsQ0FNRixNQUVFLFFBQUEsQ0FDQSxTQUFBLENBQ0EsZUFBQSxDQU1GLEdBQ0UsZ0JBQUEsQ0FHRixHQUNFLGFBQUEsQ0FXRixHQUNFLHNCQUFBLENBQ0EsUUFBQSxDQUNBLGdCQUFBLENBQ0Esb0JBQUEsQ0FDQSxRQUFBLENBQ0EsVUFBQSxDQUNBLGFBQUEsQ0FRRixJQUNFLCtCQUFBLENBQ0EsaUJBQUEsQ0FHRixRQUNFLGtCQUFBLENBVUYsRUFDRSw0QkFBQSxDQUNBLG9CQUFBLENBQ0EsYUFBQSxDQVFGLFlBQ0Usd0NBQUEsQ0FBQSxxQ0FBQSxDQUFBLGdDQUFBLENBT0YsU0FFRSxrQkFBQSxDQVFGLGNBR0UsK0JBQUEsQ0FDQSxpQkFBQSxDQU9GLE1BQ0UsYUFBQSxDQVFGLFFBRUUsYUFBQSxDQUNBLGFBQUEsQ0FDQSxpQkFBQSxDQUNBLHVCQUFBLENBR0YsSUFDRSxjQUFBLENBR0YsSUFDRSxVQUFBLENBVUYsNEJBS0UscUJBQUEsQ0FZRixzQ0FLRSx1QkFBQSxDQUNBLG9CQUFBLENBQUEsZUFBQSxDQUNBLHFCQUFBLENBQ0EsYUFBQSxDQUNBLFlBQUEsQ0FDQSxzQkFBQSxDQUNBLFNBQUEsQ0FDQSxRQUFBLENBQ0EsZUFBQSxDQUNBLGtCQUFBLENBQ0Esc0JBQUEsQ0FPRixnREFJRSxjQUFBLENBR0Ysb0ZBSUUsY0FBQSxDQU9GLGdCQUNFLFlBQUEsQ0FHRixnQkFDRSxlQUFBLENBT0YsT0FDRSxTQUFBLENBT0YsU0FDRSxRQUFBLENBQ0EsU0FBQSxDQUNBLFdBQUEsQ0FHRixPQUNFLFNBQUEsQ0FPRixTQUNFLHVCQUFBLENBT0YsU0FDRSxhQUFBLENBT0Ysa0ZBRUUsV0FBQSxDQU9GLGNBQ0UsbUJBQUEsQ0FPRix5Q0FDRSx1QkFBQSxDQVFGLDZCQUNFLHlCQUFBLENBQ0EsWUFBQSxDQU1GLGNBQ0UseUJBQUEsQ0FPRixXQUNFLGNBQUEsQ0FVRixRQUNFLGFBQUEsQ0FPRixRQUNFLGlCQUFBLENBT0Ysd0JBQ0UsWUFBQSxDQVVGLE1BQ0Usb0JBQUEsQ0FDQSx3QkFBQSxDQUdGLFFBQ0UsZUFBQSxDQUdGLE1BRUUsa0JBQUEsQ0FDQSxTQUFBLENBR0YsR0FDRSxlQUFBLENBQ0EsZ0JBQUEsQ0YzWkYsS0FDRSxrQkFBQSxDQUNBLHFDQUFBLENBR0YsU0FDRSxpQkFBQSxDQUNBLGlCQUFBLENBR0YsYUFDRSxtQkFBQSxDQUdGLFlBQ0UsZUFBQSxDQUNBLDZCQUFBLENBQ0Esb0JBQUEsQ0FDQSxpQkFBQSxDQUNBLGdCQUFBLENBTUEsb0JBQ0UsbUJBQUEsQ0FDQSxlQUFBLENBSUosWUFDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLGlCQUFBLENBQ0Esa0JBQUEsQ0FDQSxtQkFBQSxDQUdGLFdBQ0UsV0FBQSxDQUNBLGVBQUEsQ0FDQSxXQUFBLENBQ0Esb0JBQUEsQ0FHRixvQkFDRSxlQUFBLENBQ0Esb0JBQUEsQ0FHRixpQkFDRSxvQkFBQSxDQUFBLG1CQUFBLENBQUEsWUFBQSxDQUNBLHFDQUFBLENBQUEscUJBQUEsQ0FBQSw2QkFBQSxDQUNBLGNBQUEsQ0FDQSwrQkFBQSxDQUVBLDZCQUNFLGFBQUEsQ0FJSixrQkFDRSxjQUFBLENBQ0Esa0JBQUEsQ0FHRixtQkFDRSxjQUFBLENBR0YsbUJBQ0UsY0FBQSxDQUNBLGlCQUFBLENBQ0Esa0JBQUEsQ0FDQSwwQkFBQSxDQUNBLG1CQUFBLENBR0YsWUFDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLGtCQUFBLENBQ0EsbUJBQUEsQ0FDQSwrQkFBQSxDQUlBLGtDQUNFLGtCQUFBLENBSUosWUFDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLGtCQUFBLENBR0YsV0FDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLG9CQUFBLENBSUEsd0JBQ0Usd0JBQUEsQ0FDQSw0QkFBQSxDQUlKLFVBQ0UsU0FBQSxDQUNBLGlCQUFBLENBQ0Esa0NBQUEsQ0FBQSwwQkFBQSxDQUNBLGlCQUFBLENBR0Ysa0JBQ0UsU0FBQSxDQUNBLGtCQUFBLENBQ0EsaUNBQUEsQ0FBQSx5QkFBQSxDRzlIRixxQ0FDRSxRQUNFLHVCQUFBLENBREYsUUFDRSx1QkFBQSxDSGdCSixZQVFJLGdCQUFBLENHeEJBLENBSUoscUNBQ0UsUUFDRSx1QkFBQSxDQURGLFFBQ0UsdUJBQUEsQ0FBQSIsImZpbGUiOiJob21lLm1pbi5jc3MifQ== */
\ No newline at end of file
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hc3NldHMvc3R5bGVzL2hvbWUubWluLnNjc3MiLCIuLi8uLi8uLi9zcmMvYXNzZXRzL3N0eWxlcy91dGlscy9fdmFyaWFibGVzLnNjc3MiLCIuLi8uLi8uLi9zcmMvYXNzZXRzL3N0eWxlcy9iYXNlL19iYXNlLnNjc3MiLCIuLi8uLi8uLi9zcmMvYXNzZXRzL3N0eWxlcy91dGlscy9fbWl4aW5zLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR1Esd0ZBQUEsQ0NRUixNQUNFLHVCQUFBLENBQ0EsbUJBQUEsQ0NURixxRkFBQSxDQUtBLG1CQUdFLHFCQUFBLENBQ0Esa0JBQUEsQ0FDQSxjQUFBLENBWUYsS0FDRSxnQkFBQSxDQUNBLDZCQUFBLENBQ0EsdUNBQUEsQ0FVRixLQUNFLFFBQUEsQ0FPRixLQUNFLGFBQUEsQ0FNRixxREFTRSxRQUFBLENBTUYsa0JBTUUsaUJBQUEsQ0FDQSxtQkFBQSxDQUNBLFFBQUEsQ0FNRixNQUVFLFFBQUEsQ0FDQSxTQUFBLENBQ0EsZUFBQSxDQU1GLEdBQ0UsZ0JBQUEsQ0FHRixHQUNFLGFBQUEsQ0FXRixHQUNFLHNCQUFBLENBQ0EsUUFBQSxDQUNBLGdCQUFBLENBQ0Esb0JBQUEsQ0FDQSxRQUFBLENBQ0EsVUFBQSxDQUNBLGFBQUEsQ0FRRixJQUNFLCtCQUFBLENBQ0EsaUJBQUEsQ0FHRixRQUNFLGtCQUFBLENBVUYsRUFDRSw0QkFBQSxDQUNBLG9CQUFBLENBQ0EsYUFBQSxDQVFGLFlBQ0Usd0NBQUEsQ0FBQSxxQ0FBQSxDQUFBLGdDQUFBLENBT0YsU0FFRSxrQkFBQSxDQVFGLGNBR0UsK0JBQUEsQ0FDQSxpQkFBQSxDQU9GLE1BQ0UsYUFBQSxDQVFGLFFBRUUsYUFBQSxDQUNBLGFBQUEsQ0FDQSxpQkFBQSxDQUNBLHVCQUFBLENBR0YsSUFDRSxjQUFBLENBR0YsSUFDRSxVQUFBLENBVUYsNEJBS0UscUJBQUEsQ0FZRixzQ0FLRSx1QkFBQSxDQUNBLG9CQUFBLENBQUEsZUFBQSxDQUNBLHFCQUFBLENBQ0EsYUFBQSxDQUNBLFlBQUEsQ0FDQSxzQkFBQSxDQUNBLFNBQUEsQ0FDQSxRQUFBLENBQ0EsZUFBQSxDQUNBLGtCQUFBLENBQ0Esc0JBQUEsQ0FPRixnREFJRSxjQUFBLENBR0Ysb0ZBSUUsY0FBQSxDQU9GLGdCQUNFLFlBQUEsQ0FHRixnQkFDRSxlQUFBLENBT0YsT0FDRSxTQUFBLENBT0YsU0FDRSxRQUFBLENBQ0EsU0FBQSxDQUNBLFdBQUEsQ0FHRixPQUNFLFNBQUEsQ0FPRixTQUNFLHVCQUFBLENBT0YsU0FDRSxhQUFBLENBT0Ysa0ZBRUUsV0FBQSxDQU9GLGNBQ0UsbUJBQUEsQ0FPRix5Q0FDRSx1QkFBQSxDQVFGLDZCQUNFLHlCQUFBLENBQ0EsWUFBQSxDQU1GLGNBQ0UseUJBQUEsQ0FPRixXQUNFLGNBQUEsQ0FVRixRQUNFLGFBQUEsQ0FPRixRQUNFLGlCQUFBLENBT0Ysd0JBQ0UsWUFBQSxDQVVGLE1BQ0Usb0JBQUEsQ0FDQSx3QkFBQSxDQUdGLFFBQ0UsZUFBQSxDQUdGLE1BRUUsa0JBQUEsQ0FDQSxTQUFBLENBR0YsR0FDRSxlQUFBLENBQ0EsZ0JBQUEsQ0YzWkYsS0FDRSxrQkFBQSxDQUNBLHFDQUFBLENBR0YsU0FDRSxpQkFBQSxDQUNBLGlCQUFBLENBR0YsYUFDRSxtQkFBQSxDQUdGLFlBQ0UsZUFBQSxDQUNBLDZCQUFBLENBQ0Esb0JBQUEsQ0FDQSxpQkFBQSxDQUNBLGdCQUFBLENBTUEsb0JBQ0UsbUJBQUEsQ0FDQSxlQUFBLENBQ0EsaUJBQUEsQ0FDQSxVQUFBLENBSUosWUFDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLGlCQUFBLENBQ0Esa0JBQUEsQ0FDQSxtQkFBQSxDQUdGLFdBQ0UsV0FBQSxDQUNBLGVBQUEsQ0FDQSxXQUFBLENBQ0Esb0JBQUEsQ0FHRixvQkFDRSxlQUFBLENBQ0Esb0JBQUEsQ0FHRixpQkFDRSxvQkFBQSxDQUFBLG1CQUFBLENBQUEsWUFBQSxDQUNBLHFDQUFBLENBQUEscUJBQUEsQ0FBQSw2QkFBQSxDQUNBLGNBQUEsQ0FDQSwrQkFBQSxDQUVBLDZCQUNFLGFBQUEsQ0FJSixrQkFDRSxjQUFBLENBQ0Esa0JBQUEsQ0FHRixtQkFDRSxjQUFBLENBR0YsbUJBQ0UsY0FBQSxDQUNBLGlCQUFBLENBQ0Esa0JBQUEsQ0FDQSwwQkFBQSxDQUNBLG1CQUFBLENBR0YsWUFDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLGtCQUFBLENBQ0EsbUJBQUEsQ0FDQSwrQkFBQSxDQUlBLGtDQUNFLGtCQUFBLENBSUosWUFDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLGtCQUFBLENBR0YsV0FDRSxjQUFBLENBQ0EsZUFBQSxDQUNBLG9CQUFBLENBSUEsd0JBQ0Usd0JBQUEsQ0FDQSw0QkFBQSxDQUlKLFVBQ0UsU0FBQSxDQUNBLGlCQUFBLENBQ0Esa0NBQUEsQ0FBQSwwQkFBQSxDQUNBLGlCQUFBLENBR0Ysa0JBQ0UsU0FBQSxDQUNBLGtCQUFBLENBQ0EsaUNBQUEsQ0FBQSx5QkFBQSxDR2hJRixxQ0FDRSxRQUNFLHVCQUFBLENBREYsUUFDRSx1QkFBQSxDSGdCSixZQVFJLGdCQUFBLENHeEJBLENBSUoscUNBQ0UsUUFDRSx1QkFBQSxDQURGLFFBQ0UsdUJBQUEsQ0FBQSIsImZpbGUiOiJob21lLm1pbi5jc3MifQ== */
\ No newline at end of file
develop/.tmp/assets/styles/home.min.css.map
{"version":3,"sourceRoot":"","sources":["../../../src/assets/styles/home.min.scss","../../../src/assets/styles/utils/_mixins.scss","../../../src/assets/styles/utils/_variables.scss","../../../src/assets/styles/base/_base.scss"],"names":[],"mappings":"AAGQ,yFCFR,qCACE,QACE,yBAIJ,qCACE,QACE,yBARJ,qCACE,QACE,yBAIJ,qCACE,QACE,yBCEJ,MACE,wBACA,oBCTF,sFAKA,mBAGE,sBACA,mBACA,eAYF,KACE,iBACA,8BACA,wCAUF,KACE,SAOF,KACE,cAMF,qDASE,SAMF,kBAME,kBACA,oBACA,SAMF,MAEE,SACA,UACA,gBAMF,GACE,iBAGF,GACE,cAWF,GACE,uBACA,SACA,iBACA,qBACA,SACA,WACA,cAQF,IACE,gCACA,kBAGF,QACE,mBAUF,EACE,6BACA,qBACA,cAQF,YACE,iCAOF,SAEE,mBAQF,cAGE,gCACA,kBAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,4BAKE,sBAYF,sCAKE,wBACA,gBACA,sBACA,cACA,aACA,uBACA,UACA,SACA,gBACA,mBACA,uBAOF,gDAIE,eAGF,oFAIE,eAOF,gBACE,aAGF,gBACE,gBAOF,OACE,UAOF,SACE,SACA,UACA,YAGF,OACE,UAOF,SACE,wBAOF,SACE,cAOF,kFAEE,YAOF,cACE,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAMF,cACE,0BAOF,WACE,eAUF,QACE,cAOF,QACE,kBAOF,wBACE,aAUF,MACE,qBACA,yBAGF,QACE,gBAGF,MAEE,mBACA,UAGF,GACE,gBACA,iBH3ZF,KACE,mBACA,sCAGF,SACE,kBACA,kBAGF,aACE,oBAGF,YACE,gBACA,8BACA,qBACA,kBACA,iBCgBA,qCDrBF,YAQI,kBAGF,oBACE,oBACA,gBAIJ,YACE,eACA,gBACA,kBACA,mBACA,oBAGF,WACE,YACA,gBACA,YACA,qBAGF,oBACE,gBACA,qBAGF,iBACE,aACA,8BACA,eACA,gCAEA,6BACE,cAIJ,kBACE,eACA,mBAGF,mBACE,eAGF,mBACE,eACA,kBACA,mBACA,2BACA,oBAGF,YACE,eACA,gBACA,mBACA,oBACA,gCAIA,kCACE,mBAIJ,YACE,eACA,gBACA,mBAGF,WACE,eACA,gBACA,qBAIA,wBACE,yBACA,6BAIJ,UACE,UACA,kBACA,2BACA,kBAGF,kBACE,UACA,mBACA","file":"home.min.css"}
\ No newline at end of file
{"version":3,"sourceRoot":"","sources":["../../../src/assets/styles/home.min.scss","../../../src/assets/styles/utils/_mixins.scss","../../../src/assets/styles/utils/_variables.scss","../../../src/assets/styles/base/_base.scss"],"names":[],"mappings":"AAGQ,yFCFR,qCACE,QACE,yBAIJ,qCACE,QACE,yBARJ,qCACE,QACE,yBAIJ,qCACE,QACE,yBCEJ,MACE,wBACA,oBCTF,sFAKA,mBAGE,sBACA,mBACA,eAYF,KACE,iBACA,8BACA,wCAUF,KACE,SAOF,KACE,cAMF,qDASE,SAMF,kBAME,kBACA,oBACA,SAMF,MAEE,SACA,UACA,gBAMF,GACE,iBAGF,GACE,cAWF,GACE,uBACA,SACA,iBACA,qBACA,SACA,WACA,cAQF,IACE,gCACA,kBAGF,QACE,mBAUF,EACE,6BACA,qBACA,cAQF,YACE,iCAOF,SAEE,mBAQF,cAGE,gCACA,kBAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,4BAKE,sBAYF,sCAKE,wBACA,gBACA,sBACA,cACA,aACA,uBACA,UACA,SACA,gBACA,mBACA,uBAOF,gDAIE,eAGF,oFAIE,eAOF,gBACE,aAGF,gBACE,gBAOF,OACE,UAOF,SACE,SACA,UACA,YAGF,OACE,UAOF,SACE,wBAOF,SACE,cAOF,kFAEE,YAOF,cACE,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAMF,cACE,0BAOF,WACE,eAUF,QACE,cAOF,QACE,kBAOF,wBACE,aAUF,MACE,qBACA,yBAGF,QACE,gBAGF,MAEE,mBACA,UAGF,GACE,gBACA,iBH3ZF,KACE,mBACA,sCAGF,SACE,kBACA,kBAGF,aACE,oBAGF,YACE,gBACA,8BACA,qBACA,kBACA,iBCgBA,qCDrBF,YAQI,kBAGF,oBACE,oBACA,gBACA,kBACA,WAIJ,YACE,eACA,gBACA,kBACA,mBACA,oBAGF,WACE,YACA,gBACA,YACA,qBAGF,oBACE,gBACA,qBAGF,iBACE,aACA,8BACA,eACA,gCAEA,6BACE,cAIJ,kBACE,eACA,mBAGF,mBACE,eAGF,mBACE,eACA,kBACA,mBACA,2BACA,oBAGF,YACE,eACA,gBACA,mBACA,oBACA,gCAIA,kCACE,mBAIJ,YACE,eACA,gBACA,mBAGF,WACE,eACA,gBACA,qBAIA,wBACE,yBACA,6BAIJ,UACE,UACA,kBACA,2BACA,kBAGF,kBACE,UACA,mBACA","file":"home.min.css"}
\ No newline at end of file
develop/.tmp/index.html
......@@ -30,7 +30,8 @@
<div class="modal">
<div class="modalInner">
<h2 class="modal__title">吾輩は猫である</h2>
<p class="modal__text">吾輩わがはいは猫である。名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。</p><a class="modal__button" href="">閉じる</a>
<p class="modal__text">吾輩わがはいは猫である。名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。</p>
<p class="modal__button">閉じる</p>
<div class="close">
<div class="close__line --type01"></div>
<div class="close__line --type02"></div>
......@@ -40,7 +41,8 @@
<div class="modal">
<div class="modalInner">
<h2 class="modal__title">銀河鉄道の夜</h2>
<p class="modal__text">「ではみなさんは、そういうふうに川だと云いわれたり、乳の流れたあとだと云われたりしていたこのぼんやりと白いものがほんとうは何かご承知ですか。」先生は、黒板に吊つるした大きな黒い星座の図の、上から下へ白くけぶった銀河帯のようなところを指さしながら、みんなに問といをかけました。</p><a class="modal__button" href="">閉じる</a>
<p class="modal__text">「ではみなさんは、そういうふうに川だと云いわれたり、乳の流れたあとだと云われたりしていたこのぼんやりと白いものがほんとうは何かご承知ですか。」先生は、黒板に吊つるした大きな黒い星座の図の、上から下へ白くけぶった銀河帯のようなところを指さしながら、みんなに問といをかけました。</p>
<p class="modal__button">閉じる</p>
<div class="close">
<div class="close__line --type01"></div>
<div class="close__line --type02"></div>
......@@ -50,7 +52,8 @@
<div class="modal">
<div class="modalInner">
<h2 class="modal__title">風の歌を聴け</h2>
<p class="modal__text">「完璧な文章などといったものは存在しない。完璧な絶望が存在しないようにね。」僕が大学生のころ偶然に知り合ったある作家は僕に向ってそう言った。僕がその本当の意味を理解できたのはずっと後のことだったが、少くともそれをある種の慰めとしてとることも可能であった。</p><a class="modal__button" href="">閉じる</a>
<p class="modal__text">「完璧な文章などといったものは存在しない。完璧な絶望が存在しないようにね。」僕が大学生のころ偶然に知り合ったある作家は僕に向ってそう言った。僕がその本当の意味を理解できたのはずっと後のことだったが、少くともそれをある種の慰めとしてとることも可能であった。</p>
<p class="modal__button">閉じる</p>
<div class="close">
<div class="close__line --type01"></div>
<div class="close__line --type02"></div>
......
develop/src/assets/js/home.js
......@@ -46,6 +46,11 @@ class Home {
for (let i = 0; i < menus.length; i++) {
menus[i].addEventListener("click", menuClick, false);
}
const menus02 = document.getElementsByClassName("modal__button");
for (let i = 0; i < menus.length; i++) {
menus02[i].addEventListener("click", menuClick, false);
}
}
// フェードイン
......
develop/src/assets/styles/dist/modal.min.scss
......@@ -132,4 +132,5 @@ body.open {
border-radius: 50px;
display: inline-block;
margin-top: 35px;
cursor: pointer;
}
develop/src/assets/styles/home.min.scss
......@@ -31,6 +31,8 @@ body {
&.--music {
letter-spacing: 0.1em;
line-height: 1.4;
position: relative;
z-index: -1;
}
}
......
develop/src/html/index.pug
......@@ -8,7 +8,7 @@ block main
.modalInner
h2.modal__title 吾輩は猫である
p.modal__text 吾輩わがはいは猫である。名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。
a(href="").modal__button 閉じる
p.modal__button 閉じる
.close
.close__line.--type01
.close__line.--type02
......@@ -17,7 +17,7 @@ block main
.modalInner
h2.modal__title 銀河鉄道の夜
p.modal__text 「ではみなさんは、そういうふうに川だと云いわれたり、乳の流れたあとだと云われたりしていたこのぼんやりと白いものがほんとうは何かご承知ですか。」先生は、黒板に吊つるした大きな黒い星座の図の、上から下へ白くけぶった銀河帯のようなところを指さしながら、みんなに問といをかけました。
a(href="").modal__button 閉じる
p.modal__button 閉じる
.close
.close__line.--type01
.close__line.--type02
......@@ -26,7 +26,7 @@ block main
.modalInner
h2.modal__title 風の歌を聴け
p.modal__text 「完璧な文章などといったものは存在しない。完璧な絶望が存在しないようにね。」僕が大学生のころ偶然に知り合ったある作家は僕に向ってそう言った。僕がその本当の意味を理解できたのはずっと後のことだったが、少くともそれをある種の慰めとしてとることも可能であった。
a(href="").modal__button 閉じる
p.modal__button 閉じる
.close
.close__line.--type01
.close__line.--type02
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!