footer-section
Basic footer section with RWD.
props
- There are three modes for RWD:
desktop
,tablet
andmobile
. desktopOnlyPanelKeys
: define which panels will only display ondesktop
mode.mobilePanelKeys
: define which panels will be allowed onmobile
mode.maxRwdMode
: define the largest mode package will use, ex: set totablet
will disabledesktop
mode.
children
There are two kinds of panel avaliable: main
panel and links
panel.
main panel
- Main panel will be displayed on every RWD modes.
- Pass
data-main_panel={true}
prop to put child component in main panel. - Pass
data-(logo|app|copyright)={true}
prop can display child as (logo|app|copyright) layout.
<!-- logo child --> 運動讓生活更有趣 <!-- app child --> pb+TV App立即下載 <!-- copyright child --> © 2016-2017 pbplus. All Right Reserved
links panel
- Pass
data-links_panel={true}
prop to put child component in links panel. - Pass
data-panel_key={KEY}
prop to put child components with sameKEY
in a links panel. - Children with
data-panel_header={true}
prop will be the header of the links panel.
<!-- header child of panel {0} --> Services 平台服務 <!-- child of panel {0} which will be skyblue on mouse hover --> TV直播 運動賽事、pb+自製節目及更多活動精彩直播 <!-- child of panel {2} with icon --> pb+運動平台 官方粉絲團
Start demo server
cd tmp/npm installnpm start # will listen on http://localhost:300