Skip to content

Commit

Permalink
Merge pull request #111 from EC-CUBE/dev
Browse files Browse the repository at this point in the history 
0.0.6 リリース分
  • Loading branch information
@mikakane
mikakane authored May 10, 2017
2 parents d68c746 + 297ba0f commit 1600fb5
Show file tree
Hide file tree
Showing 26 changed files with 712 additions and 41 deletions.
3 changes: 2 additions & 1 deletion .gitignore
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/node_modules
/public
!/public/assets/js/script.js
!/public/assets/js/script.js
.idea/
6 changes: 3 additions & 3 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,11 @@ dev ブランチは開発作業中の内容を取り込む ブランチです。

Styleguide On Heorku

[http://eccube3-styleguide-dev.herokuapp.com/](http://eccube3-styleguide.herokuapp.com/)
[http://eccube3-styleguide-dev.herokuapp.com/](http://eccube3-styleguide-dev.herokuapp.com/)

HTML Moc On Heroku

[http://eccube3-styleguide-dev.herokuapp.com/moc/](http://eccube3-styleguide.herokuapp.com/moc/)
[http://eccube3-styleguide-dev.herokuapp.com/moc/](http://eccube3-styleguide-dev.herokuapp.com/moc/)

モックページの実装状況等は、Project ページを確認してください。

Expand Down Expand Up @@ -84,4 +84,4 @@ $ npm start
````
$ npm i
$ npm run dev
````
````
32 changes: 31 additions & 1 deletion assets/js/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,11 @@ $(function(){
$(".ec-cartNavi").on("click",function(){
$(".ec-headerRole__cart").toggleClass("is_active")
})

})
$(function(){
$(".ec-cartNavi--cancel").on("click",function(){
$(".ec-headerRole__cart").toggleClass("is_active")
})
})

$(function(){
Expand All @@ -42,4 +46,30 @@ $(function(){
autoplay: true,
speed: 300
});
});


// Slick Slide
// TODO FIX CLASS NAME
$(function(){
$('.item_visual').slick({
dots: false,
arrows: false,
responsive: [
{
breakpoint: 768,
settings: {
dots: true
}
}]
})
});
$(function(){
$('.item_nav').slick({//サムネイル画像
dots: false,
arrows:false,
slidesToShow: 3,
focusOnSelect: true,
asNavFor: '.item_visual',//スライダー部分の要素を記述
})
});
61 changes: 61 additions & 0 deletions assets/scss/component/5.1.grid.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -247,3 +247,64 @@ Styleguide 5.1.8
}
}
}

/*
グリッドオプション
グリッドのセルに対して「左寄せ」「中央寄せ」「右寄せ」のオプションを付与することができます。
sg-wrapper:
<div class="ec-role">
<sg-wrapper-content/>
Styleguide 5.1.9
*/

/*
グリッドセルの左寄せ
.ec-gridに.ec-grid--leftを付与すると内包してるセルを左寄せにすることができます。
Markup:
.ec-grid4.ec-grid--left
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
Styleguide 5.1.10
*/
.ec-grid--left {
justify-content: flex-start;
}
/*
グリッドセルの右寄せ
.ec-gridに.ec-grid--leftを付与すると内包してるセルを左寄せにすることができます。
Markup:
.ec-grid4.ec-grid--right
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
Styleguide 5.1.11
*/
.ec-grid--right {
justify-content: flex-end;
}
/*
グリッドセルの中央寄せ
.ec-gridに.ec-grid--leftを付与すると内包してるセルを左寄せにすることができます。
Markup:
.ec-grid4.ec-grid--center
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
.ec-grid4__cell(style="background-color: rgba(86,61,124,.15);border: 1px solid rgba(86,61,124,.2);height:50px;") ec-grid4__cell
Styleguide 5.1.12
*/
.ec-grid--center {
justify-content: center
}
144 changes: 143 additions & 1 deletion assets/scss/component/7.3.cart.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -227,8 +227,150 @@ Styleguide 7.3.5
@include fadeIn;
display: block;
}
.ec-cartNaviIsset {
@include fadeIn;
display: block;
}
}

/*
カートナビゲーションのポップアップ(商品詳細)
ex [カートページ　ナビゲーション部分](http://demo3.ec-cube.net/cart)
Markup:
div(style="height:350px;")
// 上記のdivはスタイルガイド都合上、高さをもたせるため設置(mocでは不要)
.is_active
.ec-cartNavi
.ec-cartNavi__icon
svg(viewbox="0 0 360 360")
path(d="M345,78.032v101.817c0,3.183-1.06,6-3.173,8.452c-2.116,2.455-4.828,3.877-8.132,4.275l-207.043,24.261 c0.13,0.93,0.427,2.355,0.893,4.275c0.461,1.925,0.858,3.68,1.189,5.271c0.329,1.591,0.496,3.051,0.496,4.375 c0,2.121-1.586,6.362-4.759,12.727h182.452c3.437,0,6.411,1.262,8.924,3.778c2.51,2.52,3.768,5.503,3.768,8.948 c0,3.45-1.258,6.433-3.768,8.949c-2.513,2.52-5.487,3.778-8.924,3.778H103.847c-3.44,0-6.416-1.259-8.925-3.778 c-2.513-2.517-3.768-5.499-3.768-8.949c0-1.854,0.724-4.475,2.181-7.854c1.453-3.381,3.402-7.325,5.85-11.833 c2.445-4.506,3.798-7.026,4.065-7.557L68.149,65.305H27.693c-3.44,0-6.415-1.26-8.924-3.779C16.255,59.008,15,56.026,15,52.577 c0-3.445,1.254-6.428,3.768-8.949c2.51-2.516,5.484-3.777,8.924-3.777h50.77c2.113,0,3.997,0.432,5.651,1.291 c1.651,0.864,2.975,1.891,3.966,3.082c0.993,1.195,1.851,2.82,2.58,4.873c0.724,2.058,1.22,3.813,1.486,5.27 c0.264,1.463,0.626,3.416,1.091,5.867c0.461,2.455,0.759,4.146,0.893,5.072h238.179c3.437,0,6.41,1.262,8.924,3.777 C343.742,71.602,345,74.586,345,78.032z M134.487,276.397c4.957,4.972,7.437,10.972,7.437,17.998 c0,7.025-2.479,13.025-7.437,17.997c-4.958,4.972-10.942,7.458-17.949,7.458c-7.008,0-12.989-2.486-17.947-7.458 c-4.959-4.972-7.437-10.972-7.437-17.997c0-7.026,2.478-13.026,7.437-17.998c4.958-4.971,10.938-7.457,17.947-7.457 C123.544,268.94,129.529,271.426,134.487,276.397z M312.178,276.397c4.958,4.972,7.437,10.972,7.437,17.998 c0,7.025-2.479,13.025-7.437,17.997c-4.957,4.972-10.941,7.458-17.947,7.458c-7.009,0-12.99-2.486-17.947-7.458 c-4.958-4.972-7.437-10.972-7.437-17.997c0-7.026,2.479-13.026,7.437-17.998c4.957-4.971,10.938-7.457,17.947-7.457 C301.237,268.94,307.221,271.426,312.178,276.397z")
.ec-cartNavi__iconClose
svg(viewbox="0 0 360 360")
path(d="M337.572,293.77L223.65,179.85L337.572,65.928c3.547-3.546,3.163-9.678-0.855-13.7l-29.095-29.093 c-4.022-4.021-10.153-4.402-13.7-0.856L180,136.199L66.08,22.279c-3.547-3.547-9.681-3.165-13.702,0.856L23.286,52.228 c-4.02,4.022-4.404,10.154-0.857,13.7L136.35,179.85L22.429,293.77c-3.547,3.545-3.163,9.678,0.857,13.701l29.093,29.092 c4.021,4.023,10.155,4.406,13.702,0.857L180,223.499L293.92,337.42c3.548,3.549,9.679,3.166,13.701-0.857l29.095-29.092 C340.735,303.448,341.121,297.315,337.572,293.77z")
.ec-cartNavi__badge 1
.ec-cartNavi__label
| 合計
.ec-cartNavi__price ¥1920
+b.ec-cartNaviIsset
+e.cart
+e.cartImage
img(src='http://demo3.ec-cube.net/upload/save_image/0701104933_5593472d8d179.jpeg')
+e.cartContent
+e.cartContentTitle ミニテーブル
+e.cartContentPrice ¥ 12,960
+e.cartContentTax 税込
+e.cartContentNumber 数量：1
+e.action
a.ec-blockBtn--action(href="/moc/guest/cart1") カートへ進む
a.ec-blockBtn.ec-cartNavi--cancel キャンセル
Styleguide 7.3.6
*/
.ec-cartNaviIsset {
display: none;
min-width: 256px;
max-width:256px;
text-align: center;
background: #f3f3f3;
box-sizing: border-box;
padding: 16px;
z-index: 3;
position: absolute;
@include fadeOut;
& &__cart {
@include clearfix;
border-bottom: 1px solid #E8E8E8;
margin-bottom: 16px;
padding-bottom: 32px;
}
& &__cartImage {
float: left;
width: 50%;
img {
width: 100%;
}
}
& &__cartContent {
float: right;
width: 50%;
padding-left: 16px;
text-align:left;
box-sizing:border-box;
}
& &__action {
.ec-blockBtn--action {
color:#fff;
margin-bottom: 8px;
}
}
& &__cartContentTitle {
margin-bottom: 8px;
}
& &__cartContentPrice {
font-weight: bold;
}
& &__cartContentTax {
display: inline-block;
font-size: 12px;
font-weight: normal;
margin-left: 5px;
}
& &__cartContentNumber {
font-size: 14px;
}
}



/*
カートナビゲーションのポップアップ(商品なし)
ex [カートページ　ナビゲーション部分](http://demo3.ec-cube.net/cart)
Markup:
div(style="height:170px;")
// 上記のdivはスタイルガイド都合上、高さをもたせるため設置(mocでは不要)
.is_active
.ec-cartNavi
.ec-cartNavi__icon
svg(viewbox="0 0 360 360")
path(d="M345,78.032v101.817c0,3.183-1.06,6-3.173,8.452c-2.116,2.455-4.828,3.877-8.132,4.275l-207.043,24.261 c0.13,0.93,0.427,2.355,0.893,4.275c0.461,1.925,0.858,3.68,1.189,5.271c0.329,1.591,0.496,3.051,0.496,4.375 c0,2.121-1.586,6.362-4.759,12.727h182.452c3.437,0,6.411,1.262,8.924,3.778c2.51,2.52,3.768,5.503,3.768,8.948 c0,3.45-1.258,6.433-3.768,8.949c-2.513,2.52-5.487,3.778-8.924,3.778H103.847c-3.44,0-6.416-1.259-8.925-3.778 c-2.513-2.517-3.768-5.499-3.768-8.949c0-1.854,0.724-4.475,2.181-7.854c1.453-3.381,3.402-7.325,5.85-11.833 c2.445-4.506,3.798-7.026,4.065-7.557L68.149,65.305H27.693c-3.44,0-6.415-1.26-8.924-3.779C16.255,59.008,15,56.026,15,52.577 c0-3.445,1.254-6.428,3.768-8.949c2.51-2.516,5.484-3.777,8.924-3.777h50.77c2.113,0,3.997,0.432,5.651,1.291 c1.651,0.864,2.975,1.891,3.966,3.082c0.993,1.195,1.851,2.82,2.58,4.873c0.724,2.058,1.22,3.813,1.486,5.27 c0.264,1.463,0.626,3.416,1.091,5.867c0.461,2.455,0.759,4.146,0.893,5.072h238.179c3.437,0,6.41,1.262,8.924,3.777 C343.742,71.602,345,74.586,345,78.032z M134.487,276.397c4.957,4.972,7.437,10.972,7.437,17.998 c0,7.025-2.479,13.025-7.437,17.997c-4.958,4.972-10.942,7.458-17.949,7.458c-7.008,0-12.989-2.486-17.947-7.458 c-4.959-4.972-7.437-10.972-7.437-17.997c0-7.026,2.478-13.026,7.437-17.998c4.958-4.971,10.938-7.457,17.947-7.457 C123.544,268.94,129.529,271.426,134.487,276.397z M312.178,276.397c4.958,4.972,7.437,10.972,7.437,17.998 c0,7.025-2.479,13.025-7.437,17.997c-4.957,4.972-10.941,7.458-17.947,7.458c-7.009,0-12.99-2.486-17.947-7.458 c-4.958-4.972-7.437-10.972-7.437-17.997c0-7.026,2.479-13.026,7.437-17.998c4.957-4.971,10.938-7.457,17.947-7.457 C301.237,268.94,307.221,271.426,312.178,276.397z")
.ec-cartNavi__iconClose
svg(viewbox="0 0 360 360")
path(d="M337.572,293.77L223.65,179.85L337.572,65.928c3.547-3.546,3.163-9.678-0.855-13.7l-29.095-29.093 c-4.022-4.021-10.153-4.402-13.7-0.856L180,136.199L66.08,22.279c-3.547-3.547-9.681-3.165-13.702,0.856L23.286,52.228 c-4.02,4.022-4.404,10.154-0.857,13.7L136.35,179.85L22.429,293.77c-3.547,3.545-3.163,9.678,0.857,13.701l29.093,29.092 c4.021,4.023,10.155,4.406,13.702,0.857L180,223.499L293.92,337.42c3.548,3.549,9.679,3.166,13.701-0.857l29.095-29.092 C340.735,303.448,341.121,297.315,337.572,293.77z")
.ec-cartNavi__badge 1
.ec-cartNavi__label
| 合計
.ec-cartNavi__price ¥1920
.ec-cartNaviNull
.ec-cartNaviNull__message
p 現在カート内に
br
| 商品がございません。
//+b.ec-cartNaviIsset
// +e.cart
// +e.cartImage
// img(src='http://demo3.ec-cube.net/upload/save_image/0701104933_5593472d8d179.jpeg')
// +e.cartContent
// +e.cartContentTitle ミニテーブル
// +e.cartContentPrice ¥ 12,960
// +e.cartContentTax 税込
// +e.cartContentNumber 数量：1
// +e.action
// a.ec-blockBtn--action(href="/moc/guest/cart1") カートへ進む
// a.ec-blockBtn キャンセル
sg-wrapper:
<div class="ec-role">
<sg-wrapper-content/>
</div>
Styleguide 7.3.7
*/

/*
総計
Expand All @@ -238,7 +380,7 @@ Markup:
include /assets/tmpl/elements/7.3.cart.pug
+ec-totalBox
Styleguide 7.3.6
Styleguide 7.3.8
*/
.ec-totalBox{
background:#F3F3F3;
Expand Down
20 changes: 18 additions & 2 deletions assets/scss/component/9.1.mypage.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,22 @@ Styleguide 9.1.1
}
}

/*
マイページ（お気に入り機能無効）
マイページで表示するメニューリストです。
ul を利用したリスト要素で記述します。
ex [マイページ　メニューリスト部分](http://demo3.ec-cube.net/mypage)
Markup:
include /assets/tmpl/elements/9.1.mypage.pug
+ec-navlist_noFavorite
Styleguide 9.1.2
*/

/*
Welcome メッセージ
Expand All @@ -76,7 +92,7 @@ Markup:
include /assets/tmpl/elements/9.1.mypage.pug
+ec-welcomeMsg
Styleguide 9.1.2
Styleguide 9.1.3
*/
.ec-welcomeMsg{
@include mypageContainer;
Expand All @@ -98,7 +114,7 @@ Markup:
include /assets/tmpl/elements/9.1.mypage.pug
+ec-favorite
Styleguide 9.1.3
Styleguide 9.1.4
*/
.ec-favoriteRole{
& &__header {
Expand Down
1 change: 1 addition & 0 deletions assets/scss/mixins/btn.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,6 +33,7 @@ $btn-border-radius-base: 0px;
@include button-size($padding-base-vertical, $padding-base-horizontal, $font-size-base, $line-height-base, $btn-border-radius-base);
@include user-select(none);
padding: 10px 16px;
text-decoration: none;

&,
&:active,
Expand Down
2 changes: 1 addition & 1 deletion assets/scss/project/11.3.headerNavi.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ Styleguide 11.3.1
& &__keyword{
float: none;
height: 50px;
padding: 0 40px 0 18px;
padding: 0 35px 0 18px;
border-bottom: 1px solid #ccc;
position: relative;
margin-left: 2%;
Expand Down
29 changes: 29 additions & 0 deletions assets/scss/project/12.1.slider.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,5 +19,34 @@ Styleguide 12.1
padding: 0;
list-style: none;
}
}
.ec-sliderItemRole{
@include container;
margin-bottom: 24px;
ul{
padding: 0;
list-style: none;
}
.item_nav {
display: none;
@include media_desktop {
display: flex;
justify-content: space-between;
margin-bottom: 0;
}

}
.slideThumb{
margin-bottom: 25px;
opacity: .8;
&:focus {
outline: none;
}
&:hover {
opacity: 1;
}
img {
width: 80%;
}
}
}
Loading

0 comments on commit 1600fb5

Please sign in to comment.