From 59a13afb8e6689df1b73cf340b9b66fc8873231b Mon Sep 17 00:00:00 2001 From: hudsoncliff Date: Thu, 25 Jul 2019 00:04:44 +0900 Subject: [PATCH] =?UTF-8?q?gulp=E3=81=AE=E3=82=BF=E3=82=B9=E3=82=AF?= =?UTF-8?q?=E3=83=A9=E3=83=B3=E3=83=8A=E3=83=BC=E3=82=92=E5=B0=8E=E5=85=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 10 ++++++++++ docs/style.css | 2 +- gulpfile.js | 30 ++++++++++++++++++++++++++++++ package.json | 7 +++++++ 4 files changed, 48 insertions(+), 1 deletion(-) create mode 100644 gulpfile.js diff --git a/README.md b/README.md index 6c7147a..9daf5de 100644 --- a/README.md +++ b/README.md @@ -53,6 +53,16 @@ npm start npm run build:style ``` +1. gulpで監視 +``` +gulp watch +``` + +2. gulpでビルド +``` +gulp css +``` + sass/style.scss → docs/style.css にコンパイルされる。 ローカルサイトで、スタイルが反映されていれば、無事に成功! diff --git a/docs/style.css b/docs/style.css index a66f2f9..074896b 100644 --- a/docs/style.css +++ b/docs/style.css @@ -1 +1 @@ -html{font-size:16px}html[lang="ja"] body,html[lang="ja"] button,html[lang="ja"] input,html[lang="ja"] select,html[lang="ja"] textarea,html[lang="ja"] h1,html[lang="ja"] h2,html[lang="ja"] h3,html[lang="ja"] h4,html[lang="ja"] h5,html[lang="ja"] h6,html[lang="ja"] a,html[lang="ja"] table,html[lang="ja"] .site-title{font-family:Noto Sans JP, Hiragino Kaku Gothic Pro, Meiryo, sans-serif}.entry-content .sponcer-title-heading{text-align:center;display:flex;justify-content:center;align-items:center;padding-left:0;font-size:2.4rem}.entry-content .sponcer-title-heading::before,.entry-content .sponcer-title-heading::after{content:"";display:block;height:1px;flex-grow:1;background:#cccccc;width:auto;position:inherit;border-radius:0}.entry-content .sponcer-title-heading::before{margin-right:0.5em}.entry-content .sponcer-title-heading::after{margin-left:0.5em}.wcorg-sponsors [class^="wcorg-sponsor-level-"]{margin-bottom:60px;display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start}.wcorg-sponsors [class^="wcorg-sponsor-level-"] h2{text-align:center;padding:0 0 10px 0;font-size:2rem;position:inherit;width:100%;margin:0 0 30px 0}.wcorg-sponsors [class^="wcorg-sponsor-level-"] h2::before{content:"";position:inherit;display:block;margin:0 auto;width:60px;height:60px;transform:none;background-color:transparent;background-size:100% auto;background-repeat:no-repeat;background-position:center center}.wcorg-sponsors [class^="wcorg-sponsor-level-"] h2::after{content:"";display:block;width:120px;height:2px;background:#cccccc;margin:10px auto 0 auto}.wcorg-sponsors [class^="wcorg-sponsor-level-"] .wcorg-sponsor{text-align:center}.wcorg-sponsors [class^="wcorg-sponsor-level-"] .wcorg-sponsor .wcorg-sponsor-description{display:block;margin:0 auto 1em auto;width:90%}.wcorg-sponsors [class^="wcorg-sponsor-level-"] .wcorg-sponsor .wcorg-sponsor-description a{border:none;transition:all 0.2s ease}.wcorg-sponsors [class^="wcorg-sponsor-level-"] .wcorg-sponsor .wcorg-sponsor-description a img{max-width:100%;height:auto;max-height:80px;width:auto}.wcorg-sponsors [class^="wcorg-sponsor-level-"] .wcorg-sponsor .wcorg-sponsor-description a:hover{opacity:0.8}.wcorg-sponsors .wcorg-sponsor-level-gold h2{color:#ffb74a}.wcorg-sponsors .wcorg-sponsor-level-gold h2::before{background-image:url("https://2019.tokyo.wordcamp.org/files/2019/07/gold.png")}.wcorg-sponsors .wcorg-sponsor-level-gold h2::after{background:#ffb74a}.wcorg-sponsors .wcorg-sponsor-level-gold .wcorg-sponsor{width:100%}.wcorg-sponsors .wcorg-sponsor-level-silver h2{color:#c4bfc4}.wcorg-sponsors .wcorg-sponsor-level-silver h2::before{background-image:url("https://2019.tokyo.wordcamp.org/files/2019/07/silver.png")}.wcorg-sponsors .wcorg-sponsor-level-silver h2::after{background:#c4bfc4}.wcorg-sponsors .wcorg-sponsor-level-silver .wcorg-sponsor{width:50%}.wcorg-sponsors .wcorg-sponsor-level-bronze h2{color:#9e5318}.wcorg-sponsors .wcorg-sponsor-level-bronze h2::before{background-image:url("https://2019.tokyo.wordcamp.org/files/2019/07/bronze.png")}.wcorg-sponsors .wcorg-sponsor-level-bronze h2::after{background:#9e5318}.wcorg-sponsors .wcorg-sponsor-level-bronze .wcorg-sponsor{width:33.3%}.wcorg-sponsors .wcorg-sponsor-level-green h2{color:#69b74b}.wcorg-sponsors .wcorg-sponsor-level-green h2::before{background-image:url("https://2019.tokyo.wordcamp.org/files/2019/07/green.png")}.wcorg-sponsors .wcorg-sponsor-level-green h2::after{background:#69b74b}.wcorg-sponsors .wcorg-sponsor-level-green .wcorg-sponsor{width:25%}.wcorg-sponsors .wcorg-sponsor-level-in-kind h2{color:#666666}.wcorg-sponsors .wcorg-sponsor-level-in-kind h2::before{background-image:url("https://2019.tokyo.wordcamp.org/files/2019/07/inkind.png")}.wcorg-sponsors .wcorg-sponsor-level-in-kind h2::after{background:#666666}.wcorg-sponsors .wcorg-sponsor-level-in-kind .wcorg-sponsor{width:25%}body{color:#333}.entry .entry-content>*{margin-left:auto;margin-right:auto}.alignfull .wp-block-column{padding:20px}.themeword{font-size:1.4em}.aligncenter{display:block;margin:0 auto}.alignright{float:right}.alignleft{float:left}.main-navigation{position:fixed;top:0;left:0;width:100%;min-height:40px;background-color:rgba(255,255,255,0.95);margin-top:0;z-index:10;border-bottom:1px solid #eeeeee}.main-navigation .main-menu>li{color:#289563;line-height:1.6 !important}.main-navigation .main-menu>li.menu-item-has-children{line-height:1.6}.main-navigation .main-menu>li.menu-item-has-children .submenu-expand{vertical-align:middle;height:53px;box-sizing:border-box;margin-top:-1px;margin-right:0 !important;border-radius:0}.main-navigation .main-menu>li.menu-item-has-children .submenu-expand:hover{background:#289563;color:#fff}.main-navigation .main-menu>li.menu-item-has-children:hover a,.main-navigation .main-menu>li.menu-item-has-children:hover .submenu-expand{background:#289563;color:#fff !important}.main-navigation .menu-item>a{display:inline-block;font-size:0.9rem;letter-spacing:0.02em;color:#289563 !important;padding:15px;height:53px;margin-right:0 !important;transition:all 0.3s ease}.main-navigation .menu-item>a:hover{background-color:#289563;color:#fff !important}.main-navigation .sub-menu{background:rgba(40,149,99,0.9)}.main-navigation .sub-menu .menu-item>a{color:#ffffff !important}.main-navigation .sub-menu>li>a:not(.submenu-eexpand):hover{background:rgba(214,157,18,0.9)}.main-navigation .sub-menu>li .menu-item-link-return{font-size:16px;font-weight:bold;line-height:2}.main-navigation .sub-menu>li.mobile-parent-nav-menu-item svg{top:0.4rem}.main-navigation .menu-item-has-children.off-canvas .sub-menu{background:rgba(40,149,99,0.9)}.main-navigation .menu-item-has-children.off-canvas .sub-menu>li{color:#ffffff;border-bottom:1px solid rgba(255,255,255,0.2)}.main-navigation .menu-item-has-children.off-canvas .sub-menu>li>a{color:#ffffff !important}@media only screen and (max-width: 480px){.main-navigation .menu-item>a{padding:15px 0 15px 1em}}.site-description{display:none}body .site-header{padding:80px 0;background:url("https://2019.tokyo.wordcamp.org/files/2019/07/keyvisual_sp.jpg") repeat-x;background-size:auto 150%;position:relative;display:block}body .site-header::after{content:"";display:block;position:absolute;width:100%;height:20px;left:0;bottom:-2px;background:url("https://2019.tokyo.wordcamp.org/files/2019/06/wave.png") repeat-x;background-size:auto 100%}body .site-header.featured-image{display:block;overflow:inherit;text-shadow:none;background-color:#f5f5f5;background-repeat:repeat;background-size:inherit;min-height:inherit;margin-bottom:0}body .site-header.featured-image::after{content:"";display:block;position:absolute;width:100%;height:20px;left:0;bottom:-2px;top:inherit;background:url("https://2019.tokyo.wordcamp.org/files/2019/06/wave.png") repeat-x;background-size:auto 100%;transition:none;opacity:1}body .site-header.featured-image .site-featured-image{display:none}body .site-header .site-branding-container .site-branding .site-title{position:relative;display:flex;flex-direction:column;align-items:center}body .site-header .site-branding-container .site-branding .site-title>a{order:1;display:block;width:80%;max-width:480px;height:22vmax;max-height:240px;background:#fff url("https://2019.tokyo.wordcamp.org/files/2019/06/wctokyo_logo_web.png");background-repeat:no-repeat;background-position:center center;background-size:80% auto;text-indent:-9999px;border-radius:10px}body.home .site-header{padding:90px 0 80px 0;min-height:90vh;background-size:auto 100%;animation:bgscroll 60s linear infinite;transform:translate3d(0, 0, 0);display:flex;justify-content:center;align-items:center}body.home .site-header .site-branding-container{width:90vw;height:90vw;max-width:720px;max-height:720px;background:#ffffff;border-radius:50%;display:flex;justify-content:center;align-items:center}body.home .site-header .site-branding-container .site-branding{margin:0}body.home .site-header .site-branding-container .site-branding .site-title{width:70vw;max-width:680px;height:auto;display:block}body.home .site-header .site-branding-container .site-branding .site-title>a{width:100%;margin:0 auto;animation:fadeIn 3s, fadeOut 3s 5s forwards;background:url("https://2019.tokyo.wordcamp.org/files/2019/06/wctokyo_logo_web.png") no-repeat;background-size:100% auto;border-radius:0;background-position:center center}@media only screen and (min-width: 768px){body .site-header{background-image:url("https://2019.tokyo.wordcamp.org/files/2019/07/keyvisual_bg.jpg")}body .site-header::after{animation:bgscroll 26s linear infinite}body .featured-image .site-title{display:flex}body.home .site-header .site-branding-container{width:55vw;height:55vw;max-width:720px;max-height:720px}body.home .site-header .site-branding-container .site-branding .site-title{width:40vw}}.sticky-post{display:none}.entry-header{margin-bottom:40px !important;padding-top:30px}.entry-header::after{content:"";width:20px;height:5px;border-radius:10px;background-color:#289563;position:absolute;top:0;left:50%;transform:translateX(-50%) rotate(-55deg)}.entry-title{position:relative;text-align:center;padding-bottom:0.95em;font-size:1.8rem;line-height:1.4;letter-spacing:0.05em}.entry-title::before{display:none !important}.entry-title::after{color:#ccc;letter-spacing:0.18em;position:absolute;left:50%;transform:translateX(-50%);bottom:0;font-size:0.5em;font-weight:800}.post-397 .entry-title::after{content:"OUTLINE"}.post-358 .entry-title::after{content:"ROADMAP"}.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,.entry-content h5,.entry-content h6{margin:2em 0 1em}.entry-content h1{font-size:2rem}.entry-content h2{position:relative;font-size:1.6rem;padding-left:1em}.entry-content h2::before{position:absolute;top:50%;left:0;transform:translateY(-50%);width:0.5em;height:0.5em;margin:0;background-color:#289563;border-radius:50%}.entry-content h3{font-size:1.3rem}.entry-content h3::before{content:"-";color:#289563;margin-right:0.3em;line-height:1.8}.entry-content h4{font-size:1.05rem;border-left:3px dotted #289563;padding-left:0.3em}.entry-content h5,.entry-content h6{font-size:1rem}.entry-content .themeTitle{font-size:2rem;color:#289563}.entry-content .themeTitle::before{display:none}.entry-content p{font-size:1rem;line-height:2}.entry-content .has-small-font-size{font-size:0.85rem !important}.entry-content a{color:#d69d12;border-bottom:1px dotted #d69d12;text-decoration:none !important}.entry-content table th,.entry-content table td{font-size:0.9rem;border-color:#eee !important;border-width:2px;padding:10px}.entry-content table tr:nth-child(odd) td{background:#f6f6f6}.entry-content table tr:first-child td{background:#289563;color:#ffffff;text-align:center;padding:15px}.entry-content table tr td:first-child{text-align:center}.author-bio .author-description{display:none}#colophon .widget-column{display:block}#colophon .widget-column .widget{margin-right:auto;margin-left:auto;margin-bottom:60px;width:100%;max-width:100%;display:flex;flex-flow:column;align-items:center}#colophon .widget-column .widget .widget-title{display:inline-block;font-size:1.4rem;font-style:italic;letter-spacing:0.05em;font-weight:bold;padding:0 4px 0.4em;border-bottom:3px solid #289563}#colophon .widget-column .widget .widget-title::before{display:none}@media only screen and (min-width: 768px){#colophon .widget-column .widget{margin-bottom:80px;max-width:calc(3 * 1rem) calc(10% + 60px) calc(1rem / 2)}}.sponsor-level{display:flex;flex-wrap:wrap;justify-content:center;width:100%}.sponsor-level-title{width:100%;min-width:100%;font-size:1.3rem;letter-spacing:0.1em;text-align:center;margin:3em 0 1em;display:flex;justify-content:center;align-items:center}.sponsor-level-title::before,.sponsor-level-title::after{content:"";height:1px;width:100%;display:block;background:#333;flex:1}.sponsor-level-title::before{margin-right:0.5em}.sponsor-level-title::after{margin-left:0.5em}.sponsor-level.gold .sponsor-level-title{color:#ffb74a}.sponsor-level.gold .sponsor-level-title::before,.sponsor-level.gold .sponsor-level-title::after{background:#ffb74a}.sponsor-level.silver .sponsor-level-title{color:#c4bfc4}.sponsor-level.silver .sponsor-level-title::before,.sponsor-level.silver .sponsor-level-title::after{background:#c4bfc4}.sponsor-level.bronze .sponsor-level-title{color:#9e5318}.sponsor-level.bronze .sponsor-level-title::before,.sponsor-level.bronze .sponsor-level-title::after{background:#9e5318}.sponsor-level.green .sponsor-level-title{color:#69b74b}.sponsor-level.green .sponsor-level-title::before,.sponsor-level.green .sponsor-level-title::after{background:#69b74b}.sponsor-logo{padding-bottom:0 !important;border:1px solid #fff;display:flex !important;justify-content:center;align-items:center}.sponsor-logo:hover{border:1px solid #eee}.sponsor-logo img{padding:20px}.sponsor-level.gold .sponsor-logo{flex:0 1 100%}.sponsor-level .sponsor-logo{flex:0 1 50%}@media only screen and (min-width: 768px){.sponsor-level.gold .sponsor-logo{flex:0 1 50%}.sponsor-level.silver .sponsor-logo{flex:0 1 50%}.sponsor-level.bronze .sponsor-logo{flex:0 1 33%}.sponsor-level.green .sponsor-logo{flex:0 1 25%}.sponsor-level.in-kind .sponsor-logo{flex:0 1 25%}}.jetpack-social-widget-list{text-align:center}#icon-twitter{fill:#1da1f2}#icon-facebook{fill:#3c5a99}#colophon .site-info{margin:0 !important;text-align:center;padding:60px 20px;font-size:0.9rem;background-color:#289563;color:#fff !important;display:block;border-top:10px solid #d69d12}#colophon .site-info a{color:#ffffff}#colophon .site-info a:hover{color:#f1c65d;text-decoration:underline}#colophon .footer-navigation{margin-top:20px;display:block}#colophon .footer-navigation .footer-menu li{display:block;text-align:left;border-bottom:1px solid rgba(255,255,255,0.2)}#colophon .footer-navigation .footer-menu li a{padding:8px 0;display:block}@media only screen and (min-width: 768px){#colophon .footer-navigation .footer-menu li{display:inline-block}}button,input[type="submit"]{background:#edb62e;border-color:#d69d12;color:#373737;text-shadow:none}.wccsp-header{background:#edb62e;background:linear-gradient(45deg, #d69d12, #edb62e);background:no-repeat url("/files/2019/04/tokyotower_dark.jpg"),linear-gradient(45deg, #d69d12, #edb62e);background-size:cover;background-position:40% 50%;position:relative}.wccsp-header:after{content:"Coming Soon!";position:absolute;font-family:"Courier New", Courier, monospace;font-weight:700;top:2em;left:1em;transform:rotate(-10deg)}.wccsp-header h1{font-weight:700}h2.wccsp-dates{font-weight:700}#wccsp-introduction .coming-soon__box{border:0.2em solid #edb62e;padding:21px;display:block}.coming-soon__box__item{display:block;margin-bottom:18px;line-height:1.85em;padding-bottom:18px;border-bottom:1px solid #edb62e}.coming-soon__box__item:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0}.coming-soon__ttl{display:block;font-size:18px;line-height:1.2em;margin-bottom:0.5em;color:#735410}.coming-soon__body{display:block;padding-left:1em;font-size:18px;line-height:1.5em}.coming-soon__body+.coming-soon__body{margin-top:18px}.coming-soon__numb{font-size:28px;font-weight:700}.coming-soon__texts{font-size:18px;display:block;margin:2em auto;line-height:1.75em}.coming-soon__date{line-height:1.75em}.coming-soon__venue{font-size:14px}.coming-soon__venue strong{font-size:20px;margin-bottom:0.5em;display:inline-block}@media only screen and (max-width: 40em){body{font-size:18px}button,input[type="submit"]{font-size:12px;line-height:1.2em}.coming-soon__ttl{font-size:14px}.coming-soon__body{padding-left:0}.coming-soon__numb{font-size:24px}.coming-soon__date{font-size:16px}.coming-soon__venue{line-height:1.4em}.coming-soon__venue strong{line-height:1.25em}.wccsp-header{background-position:20% 80%}}@media only screen and (min-width: 90.063em){.wccsp-header{background-attachment:fixed;background-position:bottom}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes bgscroll{0%{background-position:0 0}100%{background-position:100% 0}}.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):hover>.sub-menu.hidden-links{display:none}.main-navigation .main-menu .menu-item-has-children.off-canvas .sub-menu.expanded-true{top:48px}#post-397 h2{margin-top:0;padding-left:0;font-size:2.1em;word-wrap:break-word}#post-397 h2:before{display:none}.site-logo{display:none}@media only screen and (min-width: 1168px){.entry .entry-content .wp-block-image .aligncenter{margin:auto}}@media only screen and (min-width: 768px){.entry .entry-content .wp-block-image .aligncenter{margin:auto}.entry .entry-content>*.aligncenter{margin-right:auto;margin-left:auto}}.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background){background-color:#edb62e;color:#333}.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background):hover{background-color:#f1c65d}.post-navigation .post-title{color:#289563}.entry-content .wp-block-cover h2{margin:auto}.entry-content .wp-block-cover h2:before{display:none}.image-filters-enabled .entry .post-thumbnail{display:none} +@charset "UTF-8";html{font-size:16px}html[lang=ja] .site-title,html[lang=ja] a,html[lang=ja] body,html[lang=ja] button,html[lang=ja] h1,html[lang=ja] h2,html[lang=ja] h3,html[lang=ja] h4,html[lang=ja] h5,html[lang=ja] h6,html[lang=ja] input,html[lang=ja] select,html[lang=ja] table,html[lang=ja] textarea{font-family:Noto Sans JP,Hiragino Kaku Gothic Pro,Meiryo,sans-serif}.entry-content .sponcer-title-heading{text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-left:0;font-size:2.4rem}.entry-content .sponcer-title-heading::after,.entry-content .sponcer-title-heading::before{content:"";display:block;height:1px;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;background:#ccc;width:auto;position:inherit;border-radius:0}.entry-content .sponcer-title-heading::before{margin-right:.5em}.entry-content .sponcer-title-heading::after{margin-left:.5em}.wcorg-sponsors [class^=wcorg-sponsor-level-]{margin-bottom:60px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}.wcorg-sponsors [class^=wcorg-sponsor-level-] h2{text-align:center;padding:0 0 10px 0;font-size:2rem;position:inherit;width:100%;margin:0 0 30px 0}.wcorg-sponsors [class^=wcorg-sponsor-level-] h2::before{content:"";position:inherit;display:block;margin:0 auto;width:60px;height:60px;-webkit-transform:none;transform:none;background-color:transparent;background-size:100% auto;background-repeat:no-repeat;background-position:center center}.wcorg-sponsors [class^=wcorg-sponsor-level-] h2::after{content:"";display:block;width:120px;height:2px;background:#ccc;margin:10px auto 0 auto}.wcorg-sponsors [class^=wcorg-sponsor-level-] .wcorg-sponsor{text-align:center}.wcorg-sponsors [class^=wcorg-sponsor-level-] .wcorg-sponsor .wcorg-sponsor-description{display:block;margin:0 auto 1em auto;width:90%}.wcorg-sponsors [class^=wcorg-sponsor-level-] .wcorg-sponsor .wcorg-sponsor-description a{border:none;-webkit-transition:all .2s ease;transition:all .2s ease}.wcorg-sponsors [class^=wcorg-sponsor-level-] .wcorg-sponsor .wcorg-sponsor-description a img{max-width:100%;height:auto;max-height:80px;width:auto}.wcorg-sponsors [class^=wcorg-sponsor-level-] .wcorg-sponsor .wcorg-sponsor-description a:hover{opacity:.8}.wcorg-sponsors .wcorg-sponsor-level-gold h2{color:#ffb74a}.wcorg-sponsors .wcorg-sponsor-level-gold h2::before{background-image:url(https://2019.tokyo.wordcamp.org/files/2019/07/gold.png)}.wcorg-sponsors .wcorg-sponsor-level-gold h2::after{background:#ffb74a}.wcorg-sponsors .wcorg-sponsor-level-gold .wcorg-sponsor{width:100%}.wcorg-sponsors .wcorg-sponsor-level-silver h2{color:#c4bfc4}.wcorg-sponsors .wcorg-sponsor-level-silver h2::before{background-image:url(https://2019.tokyo.wordcamp.org/files/2019/07/silver.png)}.wcorg-sponsors .wcorg-sponsor-level-silver h2::after{background:#c4bfc4}.wcorg-sponsors .wcorg-sponsor-level-silver .wcorg-sponsor{width:50%}.wcorg-sponsors .wcorg-sponsor-level-bronze h2{color:#9e5318}.wcorg-sponsors .wcorg-sponsor-level-bronze h2::before{background-image:url(https://2019.tokyo.wordcamp.org/files/2019/07/bronze.png)}.wcorg-sponsors .wcorg-sponsor-level-bronze h2::after{background:#9e5318}.wcorg-sponsors .wcorg-sponsor-level-bronze .wcorg-sponsor{width:33.3%}.wcorg-sponsors .wcorg-sponsor-level-green h2{color:#69b74b}.wcorg-sponsors .wcorg-sponsor-level-green h2::before{background-image:url(https://2019.tokyo.wordcamp.org/files/2019/07/green.png)}.wcorg-sponsors .wcorg-sponsor-level-green h2::after{background:#69b74b}.wcorg-sponsors .wcorg-sponsor-level-green .wcorg-sponsor{width:25%}.wcorg-sponsors .wcorg-sponsor-level-in-kind h2{color:#666}.wcorg-sponsors .wcorg-sponsor-level-in-kind h2::before{background-image:url(https://2019.tokyo.wordcamp.org/files/2019/07/inkind.png)}.wcorg-sponsors .wcorg-sponsor-level-in-kind h2::after{background:#666}.wcorg-sponsors .wcorg-sponsor-level-in-kind .wcorg-sponsor{width:25%}body{color:#333}.entry .entry-content>*{margin-left:auto;margin-right:auto}.alignfull .wp-block-column{padding:20px}.themeword{font-size:1.4em}.aligncenter{display:block;margin:0 auto}.alignright{float:right}.alignleft{float:left}.main-navigation{position:fixed;top:0;left:0;width:100%;min-height:40px;background-color:rgba(255, 255, 255, .95);margin-top:0;z-index:10;border-bottom:1px solid #eee}.main-navigation .main-menu>li{color:#289563;line-height:1.6!important}.main-navigation .main-menu>li.menu-item-has-children{line-height:1.6}.main-navigation .main-menu>li.menu-item-has-children .submenu-expand{vertical-align:middle;height:53px;-webkit-box-sizing:border-box;box-sizing:border-box;margin-top:-1px;margin-right:0!important;border-radius:0}.main-navigation .main-menu>li.menu-item-has-children .submenu-expand:hover{background:#289563;color:#fff}.main-navigation .main-menu>li.menu-item-has-children:hover .submenu-expand,.main-navigation .main-menu>li.menu-item-has-children:hover a{background:#289563;color:#fff!important}.main-navigation .menu-item>a{display:inline-block;font-size:.9rem;letter-spacing:.02em;color:#289563!important;padding:15px;height:53px;margin-right:0!important;-webkit-transition:all .3s ease;transition:all .3s ease}.main-navigation .menu-item>a:hover{background-color:#289563;color:#fff!important}.main-navigation .sub-menu{background:rgba(40, 149, 99, .9)}.main-navigation .sub-menu .menu-item>a{color:#fff!important}.main-navigation .sub-menu>li>a:not(.submenu-eexpand):hover{background:rgba(214, 157, 18, .9)}.main-navigation .sub-menu>li .menu-item-link-return{font-size:16px;font-weight:700;line-height:2}.main-navigation .sub-menu>li.mobile-parent-nav-menu-item svg{top:.4rem}.main-navigation .menu-item-has-children.off-canvas .sub-menu{background:rgba(40, 149, 99, .9)}.main-navigation .menu-item-has-children.off-canvas .sub-menu>li{color:#fff;border-bottom:1px solid rgba(255, 255, 255, .2)}.main-navigation .menu-item-has-children.off-canvas .sub-menu>li>a{color:#fff!important}@media only screen and (max-width:480px){.main-navigation .menu-item>a{padding:15px 0 15px 1em}}.site-description{display:none}body .site-header{padding:80px 0;background:url(https://2019.tokyo.wordcamp.org/files/2019/07/keyvisual_sp.jpg) repeat-x;background-size:auto 150%;position:relative;display:block}body .site-header::after{content:"";display:block;position:absolute;width:100%;height:20px;left:0;bottom:-2px;background:url(https://2019.tokyo.wordcamp.org/files/2019/06/wave.png) repeat-x;background-size:auto 100%}body .site-header.featured-image{display:block;overflow:inherit;text-shadow:none;background-color:#f5f5f5;background-repeat:repeat;background-size:inherit;min-height:inherit;margin-bottom:0}body .site-header.featured-image::after{content:"";display:block;position:absolute;width:100%;height:20px;left:0;bottom:-2px;top:inherit;background:url(https://2019.tokyo.wordcamp.org/files/2019/06/wave.png) repeat-x;background-size:auto 100%;-webkit-transition:none;transition:none;opacity:1}body .site-header.featured-image .site-featured-image{display:none}body .site-header .site-branding-container .site-branding .site-title{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}body .site-header .site-branding-container .site-branding .site-title>a{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;display:block;width:80%;max-width:480px;height:22vmax;max-height:240px;background:#fff url(https://2019.tokyo.wordcamp.org/files/2019/06/wctokyo_logo_web.png);background-repeat:no-repeat;background-position:center center;background-size:80% auto;text-indent:-9999px;border-radius:10px}body.home .site-header{padding:90px 0 80px 0;min-height:90vh;background-size:auto 100%;-webkit-animation:bgscroll 60s linear infinite;animation:bgscroll 60s linear infinite;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}body.home .site-header .site-branding-container{width:90vw;height:90vw;max-width:720px;max-height:720px;background:#fff;border-radius:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}body.home .site-header .site-branding-container .site-branding{margin:0}body.home .site-header .site-branding-container .site-branding .site-title{width:70vw;max-width:680px;height:auto;display:block}body.home .site-header .site-branding-container .site-branding .site-title>a{width:100%;margin:0 auto;-webkit-animation:fadeIn 3s,fadeOut 3s 5s forwards;animation:fadeIn 3s,fadeOut 3s 5s forwards;background:url(https://2019.tokyo.wordcamp.org/files/2019/06/wctokyo_logo_web.png) no-repeat;background-size:100% auto;border-radius:0;background-position:center center}@media only screen and (min-width:768px){body .site-header{background-image:url(https://2019.tokyo.wordcamp.org/files/2019/07/keyvisual_bg.jpg)}body .site-header::after{-webkit-animation:bgscroll 26s linear infinite;animation:bgscroll 26s linear infinite}body .featured-image .site-title{display:-webkit-box;display:-ms-flexbox;display:flex}body.home .site-header .site-branding-container{width:55vw;height:55vw;max-width:720px;max-height:720px}body.home .site-header .site-branding-container .site-branding .site-title{width:40vw}}.sticky-post{display:none}.entry-header{margin-bottom:40px!important;padding-top:30px}.entry-header::after{content:"";width:20px;height:5px;border-radius:10px;background-color:#289563;position:absolute;top:0;left:50%;-webkit-transform:translateX(-50%) rotate(-55deg);transform:translateX(-50%) rotate(-55deg)}.entry-title{position:relative;text-align:center;padding-bottom:.95em;font-size:1.8rem;line-height:1.4;letter-spacing:.05em}.entry-title::before{display:none!important}.entry-title::after{color:#ccc;letter-spacing:.18em;position:absolute;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);bottom:0;font-size:.5em;font-weight:800}.post-397 .entry-title::after{content:"OUTLINE"}.post-358 .entry-title::after{content:"ROADMAP"}.entry-content h1,.entry-content h2,.entry-content h3,.entry-content h4,.entry-content h5,.entry-content h6{margin:2em 0 1em}.entry-content h1{font-size:2rem}.entry-content h2{position:relative;font-size:1.6rem;padding-left:1em}.entry-content h2::before{position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:.5em;height:.5em;margin:0;background-color:#289563;border-radius:50%}.entry-content h3{font-size:1.3rem}.entry-content h3::before{content:"-";color:#289563;margin-right:.3em;line-height:1.8}.entry-content h4{font-size:1.05rem;border-left:3px dotted #289563;padding-left:.3em}.entry-content h5,.entry-content h6{font-size:1rem}.entry-content .themeTitle{font-size:2rem;color:#289563}.entry-content .themeTitle::before{display:none}.entry-content p{font-size:1rem;line-height:2}.entry-content .has-small-font-size{font-size:.85rem!important}.entry-content a{color:#d69d12;border-bottom:1px dotted #d69d12;text-decoration:none!important}.entry-content table td,.entry-content table th{font-size:.9rem;border-color:#eee!important;border-width:2px;padding:10px}.entry-content table tr:nth-child(odd) td{background:#f6f6f6}.entry-content table tr:first-child td{background:#289563;color:#fff;text-align:center;padding:15px}.entry-content table tr td:first-child{text-align:center}.author-bio .author-description{display:none}#colophon .widget-column{display:block}#colophon .widget-column .widget{margin-right:auto;margin-left:auto;margin-bottom:60px;width:100%;max-width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}#colophon .widget-column .widget .widget-title{display:inline-block;font-size:1.4rem;font-style:italic;letter-spacing:.05em;font-weight:700;padding:0 4px .4em;border-bottom:3px solid #289563}#colophon .widget-column .widget .widget-title::before{display:none}@media only screen and (min-width:768px){#colophon .widget-column .widget{margin-bottom:80px;max-width:3rem calc(10% + 60px) 0.5rem}}.sponsor-level{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:100%}.sponsor-level-title{width:100%;min-width:100%;font-size:1.3rem;letter-spacing:.1em;text-align:center;margin:3em 0 1em;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.sponsor-level-title::after,.sponsor-level-title::before{content:"";height:1px;width:100%;display:block;background:#333;-webkit-box-flex:1;-ms-flex:1;flex:1}.sponsor-level-title::before{margin-right:.5em}.sponsor-level-title::after{margin-left:.5em}.sponsor-level.gold .sponsor-level-title{color:#ffb74a}.sponsor-level.gold .sponsor-level-title::after,.sponsor-level.gold .sponsor-level-title::before{background:#ffb74a}.sponsor-level.silver .sponsor-level-title{color:#c4bfc4}.sponsor-level.silver .sponsor-level-title::after,.sponsor-level.silver .sponsor-level-title::before{background:#c4bfc4}.sponsor-level.bronze .sponsor-level-title{color:#9e5318}.sponsor-level.bronze .sponsor-level-title::after,.sponsor-level.bronze .sponsor-level-title::before{background:#9e5318}.sponsor-level.green .sponsor-level-title{color:#69b74b}.sponsor-level.green .sponsor-level-title::after,.sponsor-level.green .sponsor-level-title::before{background:#69b74b}.sponsor-logo{padding-bottom:0!important;border:1px solid #fff;display:-webkit-box!important;display:-ms-flexbox!important;display:flex!important;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.sponsor-logo:hover{border:1px solid #eee}.sponsor-logo img{padding:20px}.sponsor-level.gold .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 100%;flex:0 1 100%}.sponsor-level .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 50%;flex:0 1 50%}@media only screen and (min-width:768px){.sponsor-level.gold .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 50%;flex:0 1 50%}.sponsor-level.silver .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 50%;flex:0 1 50%}.sponsor-level.bronze .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 33%;flex:0 1 33%}.sponsor-level.green .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 25%;flex:0 1 25%}.sponsor-level.in-kind .sponsor-logo{-webkit-box-flex:0;-ms-flex:0 1 25%;flex:0 1 25%}}.jetpack-social-widget-list{text-align:center}#icon-twitter{fill:#1da1f2}#icon-facebook{fill:#3c5a99}#colophon .site-info{margin:0!important;text-align:center;padding:60px 20px;font-size:.9rem;background-color:#289563;color:#fff!important;display:block;border-top:10px solid #d69d12}#colophon .site-info a{color:#fff}#colophon .site-info a:hover{color:#f1c65d;text-decoration:underline}#colophon .footer-navigation{margin-top:20px;display:block}#colophon .footer-navigation .footer-menu li{display:block;text-align:left;border-bottom:1px solid rgba(255, 255, 255, .2)}#colophon .footer-navigation .footer-menu li a{padding:8px 0;display:block}@media only screen and (min-width:768px){#colophon .footer-navigation .footer-menu li{display:inline-block}}button,input[type=submit]{background:#edb62e;border-color:#d69d12;color:#373737;text-shadow:none}.wccsp-header{background:#edb62e;background:linear-gradient(45deg,#d69d12,#edb62e);background:no-repeat url(/files/2019/04/tokyotower_dark.jpg),linear-gradient(45deg,#d69d12,#edb62e);background-size:cover;background-position:40% 50%;position:relative}.wccsp-header:after{content:"Coming Soon!";position:absolute;font-family:"Courier New",Courier,monospace;font-weight:700;top:2em;left:1em;-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}.wccsp-header h1{font-weight:700}h2.wccsp-dates{font-weight:700}#wccsp-introduction .coming-soon__box{border:.2em solid #edb62e;padding:21px;display:block}.coming-soon__box__item{display:block;margin-bottom:18px;line-height:1.85em;padding-bottom:18px;border-bottom:1px solid #edb62e}.coming-soon__box__item:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0}.coming-soon__ttl{display:block;font-size:18px;line-height:1.2em;margin-bottom:.5em;color:#735410}.coming-soon__body{display:block;padding-left:1em;font-size:18px;line-height:1.5em}.coming-soon__body+.coming-soon__body{margin-top:18px}.coming-soon__numb{font-size:28px;font-weight:700}.coming-soon__texts{font-size:18px;display:block;margin:2em auto;line-height:1.75em}.coming-soon__date{line-height:1.75em}.coming-soon__venue{font-size:14px}.coming-soon__venue strong{font-size:20px;margin-bottom:.5em;display:inline-block}@media only screen and (max-width:40em){body{font-size:18px}button,input[type=submit]{font-size:12px;line-height:1.2em}.coming-soon__ttl{font-size:14px}.coming-soon__body{padding-left:0}.coming-soon__numb{font-size:24px}.coming-soon__date{font-size:16px}.coming-soon__venue{line-height:1.4em}.coming-soon__venue strong{line-height:1.25em}.wccsp-header{background-position:20% 80%}}@media only screen and (min-width:90.063em){.wccsp-header{background-attachment:fixed;background-position:bottom}}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes bgscroll{0%{background-position:0 0}100%{background-position:100% 0}}@keyframes bgscroll{0%{background-position:0 0}100%{background-position:100% 0}}.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):hover>.sub-menu.hidden-links{display:none}.main-navigation .main-menu .menu-item-has-children.off-canvas .sub-menu.expanded-true{top:48px}#post-397 h2{margin-top:0;padding-left:0;font-size:2.1em;word-wrap:break-word}#post-397 h2:before{display:none}.site-logo{display:none}@media only screen and (min-width:1168px){.entry .entry-content .wp-block-image .aligncenter{margin:auto}}@media only screen and (min-width:768px){.entry .entry-content .wp-block-image .aligncenter{margin:auto}.entry .entry-content>.aligncenter{margin-right:auto;margin-left:auto}}.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background){background-color:#edb62e;color:#333}.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background):hover{background-color:#f1c65d}.post-navigation .post-title{color:#289563}.entry-content .wp-block-cover h2{margin:auto}.entry-content .wp-block-cover h2:before{display:none}.image-filters-enabled .entry .post-thumbnail{display:none} \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..52eab0a --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,30 @@ +var gulp = require('gulp'), + sass = require('gulp-sass'), + cleanCss = require('gulp-clean-css'), + postcss = require('gulp-postcss'), + cssnext = require('postcss-cssnext'), + paths = { + themeRoot: './', + src: 'sass/', + assets: 'docs/', + img: 'img/', + }; + +gulp.task('css', function(){ + var processors = [ + cssnext({browsers: ['last 2 version']}) + ]; + return gulp.src(paths.src + '**/*.scss') + .pipe(sass().on('error', sass.logError)) + .pipe(cleanCss({debug: true}, (details) => { + console.log(`${details.name}: ${details.stats.originalSize}`); + console.log(`${details.name}: ${details.stats.minifiedSize}`); + })) + .pipe(postcss(processors)) + .pipe(gulp.dest(paths.assets)); +}); + +//watching task +gulp.task('watch', function(){ + gulp.watch([paths.src + '**/*.scss'], gulp.task('css')); +}); \ No newline at end of file diff --git a/package.json b/package.json index 1343423..47f1546 100644 --- a/package.json +++ b/package.json @@ -10,9 +10,16 @@ "@wordpress/browserslist-config": "^2.2.2", "autoprefixer": "^9.1.5", "chokidar-cli": "^1.2.1", + "gulp": "^4.0.2", + "gulp-autoprefixer": "^6.1.0", + "gulp-clean-css": "^4.2.0", + "gulp-plumber": "^1.2.1", + "gulp-postcss": "^8.0.0", + "gulp-sass": "^4.0.2", "node-sass": "^4.9.3", "npm-run-all": "^4.1.5", "postcss-cli": "^6.0.1", + "postcss-cssnext": "^3.1.0", "postcss-focus-within": "^3.0.0", "rtlcss": "^2.4.0" },