omi-cli - update weui template
This commit is contained in:
张磊
parent
6731358986
commit
07e9d2cb0b
|
|
@ -1,8 +0,0 @@
|
|||
import { render } from 'omi'
|
||||
import './assets/index.css'
|
||||
import './elements/hello'
|
||||
import registerServiceWorker from './assets/register-service-worker'
|
||||
import store from './store/admin-store'
|
||||
|
||||
render(<hello-element />, '#root', store)
|
||||
registerServiceWorker()
|
||||
|
|
@ -1,117 +0,0 @@
|
|||
// In production, we register a service worker to serve assets from local cache.
|
||||
|
||||
// This lets the app load faster on subsequent visits in production, and gives
|
||||
// it offline capabilities. However, it also means that developers (and users)
|
||||
// will only see deployed updates on the "N+1" visit to a page, since previously
|
||||
// cached resources are updated in the background.
|
||||
|
||||
// To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
|
||||
// This link also includes instructions on opting out of this behavior.
|
||||
|
||||
const isLocalhost = Boolean(
|
||||
window.location.hostname === 'localhost' ||
|
||||
// [::1] is the IPv6 localhost address.
|
||||
window.location.hostname === '[::1]' ||
|
||||
// 127.0.0.1/8 is considered localhost for IPv4.
|
||||
window.location.hostname.match(
|
||||
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
|
||||
)
|
||||
)
|
||||
|
||||
export default function register() {
|
||||
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
|
||||
// The URL constructor is available in all browsers that support SW.
|
||||
const publicUrl = new URL(process.env.PUBLIC_URL, window.location)
|
||||
if (publicUrl.origin !== window.location.origin) {
|
||||
// Our service worker won't work if PUBLIC_URL is on a different origin
|
||||
// from what our page is served on. This might happen if a CDN is used to
|
||||
// serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
|
||||
return
|
||||
}
|
||||
|
||||
window.addEventListener('load', () => {
|
||||
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`
|
||||
|
||||
if (isLocalhost) {
|
||||
// This is running on localhost. Lets check if a service worker still exists or not.
|
||||
checkValidServiceWorker(swUrl)
|
||||
|
||||
// Add some additional logging to localhost, pointing developers to the
|
||||
// service worker/PWA documentation.
|
||||
navigator.serviceWorker.ready.then(() => {
|
||||
console.log(
|
||||
'This web app is being served cache-first by a service ' +
|
||||
'worker. To learn more, visit https://goo.gl/SC7cgQ'
|
||||
)
|
||||
})
|
||||
} else {
|
||||
// Is not local host. Just register service worker
|
||||
registerValidSW(swUrl)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function registerValidSW(swUrl) {
|
||||
navigator.serviceWorker
|
||||
.register(swUrl)
|
||||
.then(registration => {
|
||||
registration.onupdatefound = () => {
|
||||
const installingWorker = registration.installing
|
||||
installingWorker.onstatechange = () => {
|
||||
if (installingWorker.state === 'installed') {
|
||||
if (navigator.serviceWorker.controller) {
|
||||
// At this point, the old content will have been purged and
|
||||
// the fresh content will have been added to the cache.
|
||||
// It's the perfect time to display a "New content is
|
||||
// available; please refresh." message in your web app.
|
||||
console.log('New content is available; please refresh.')
|
||||
} else {
|
||||
// At this point, everything has been precached.
|
||||
// It's the perfect time to display a
|
||||
// "Content is cached for offline use." message.
|
||||
console.log('Content is cached for offline use.')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error during service worker registration:', error)
|
||||
})
|
||||
}
|
||||
|
||||
function checkValidServiceWorker(swUrl) {
|
||||
// Check if the service worker can be found. If it can't reload the page.
|
||||
fetch(swUrl)
|
||||
.then(response => {
|
||||
// Ensure service worker exists, and that we really are getting a JS file.
|
||||
if (
|
||||
response.status === 404 ||
|
||||
response.headers.get('content-type').indexOf('javascript') === -1
|
||||
) {
|
||||
// No service worker found. Probably a different app. Reload the page.
|
||||
navigator.serviceWorker.ready.then(registration => {
|
||||
registration.unregister().then(() => {
|
||||
window.location.reload()
|
||||
})
|
||||
})
|
||||
} else {
|
||||
// Service worker found. Proceed as normal.
|
||||
registerValidSW(swUrl)
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
console.log(
|
||||
'No internet connection found. App is running in offline mode.'
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
export function unregister() {
|
||||
if ('serviceWorker' in navigator) {
|
||||
navigator.serviceWorker.ready.then(registration => {
|
||||
registration.unregister()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
@ -1,32 +1,504 @@
|
|||
.app {
|
||||
text-align: center;
|
||||
body,html {
|
||||
height: 100%;
|
||||
-webkit-tap-highlight-color: transparent
|
||||
}
|
||||
|
||||
.app-logo {
|
||||
animation: app-logo-spin infinite 20s linear;
|
||||
height: 80px;
|
||||
body {
|
||||
font-family: -apple-system-font,Helvetica Neue,Helvetica,sans-serif
|
||||
}
|
||||
|
||||
.app-header {
|
||||
background-color: #222;
|
||||
height: 150px;
|
||||
ul {
|
||||
list-style: none
|
||||
}
|
||||
|
||||
.page,body {
|
||||
background-color: #f8f8f8
|
||||
}
|
||||
|
||||
.link {
|
||||
color: #1aad19
|
||||
}
|
||||
|
||||
.container {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.container,.page {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.page {
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
z-index: 1
|
||||
}
|
||||
|
||||
.page.js_show {
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
.page__hd {
|
||||
padding: 40px
|
||||
}
|
||||
|
||||
.page__bd_spacing {
|
||||
padding: 0 15px
|
||||
}
|
||||
|
||||
.page__ft {
|
||||
padding-top: 40px;
|
||||
padding-bottom: 10px;
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.page__ft img {
|
||||
height: 19px
|
||||
}
|
||||
|
||||
.page__ft.j_bottom {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0
|
||||
}
|
||||
|
||||
.page__title {
|
||||
text-align: left;
|
||||
font-size: 20px;
|
||||
font-weight: 400
|
||||
}
|
||||
|
||||
.page__desc {
|
||||
margin-top: 5px;
|
||||
color: #888;
|
||||
text-align: left;
|
||||
font-size: 14px
|
||||
}
|
||||
|
||||
.page.home .page__intro-icon {
|
||||
margin-top: -.2em;
|
||||
margin-left: 5px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
vertical-align: middle
|
||||
}
|
||||
|
||||
.page.home .page__title {
|
||||
font-size: 0;
|
||||
margin-bottom: 15px
|
||||
}
|
||||
|
||||
.page.home .page__bd img {
|
||||
width: 30px;
|
||||
height: 30px
|
||||
}
|
||||
|
||||
.page.home .page__bd li {
|
||||
margin: 10px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-radius: 2px;
|
||||
cursor: pointer
|
||||
}
|
||||
|
||||
.page.home .page__bd li.js_show .weui-flex {
|
||||
opacity: .4
|
||||
}
|
||||
|
||||
.page.home .page__bd li.js_show .page__category {
|
||||
height: auto
|
||||
}
|
||||
|
||||
.page.home .page__bd li.js_show .page__category-content {
|
||||
opacity: 1;
|
||||
-webkit-transform: translateY(0);
|
||||
transform: translateY(0)
|
||||
}
|
||||
|
||||
.page.home .page__bd li:first-child {
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
.page.home .page__category {
|
||||
height: 0;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.page.home .page__category-content {
|
||||
opacity: 0;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
-webkit-transition: .3s;
|
||||
transition: .3s
|
||||
}
|
||||
|
||||
.page.home .weui-flex {
|
||||
padding: 20px;
|
||||
color: white;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-transition: .3s;
|
||||
transition: .3s
|
||||
}
|
||||
|
||||
.app-title {
|
||||
font-size: 1.5em;
|
||||
.page.home .weui-cells {
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
.app-logo {
|
||||
cursor: pointer;
|
||||
.page.home .weui-cells:after,.page.home .weui-cells:before {
|
||||
display: none
|
||||
}
|
||||
|
||||
@keyframes app-logo-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
.page.home .weui-cell {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px
|
||||
}
|
||||
|
||||
.page.home .weui-cell:before {
|
||||
left: 20px;
|
||||
right: 20px
|
||||
}
|
||||
|
||||
.page.button .page__bd {
|
||||
padding: 0 15px
|
||||
}
|
||||
|
||||
.page.button .button-sp-area {
|
||||
margin: 0 auto;
|
||||
padding: 15px 0;
|
||||
width: 60%
|
||||
}
|
||||
|
||||
.page.cell .page__bd,.page.form .page__bd {
|
||||
padding-bottom: 30px
|
||||
}
|
||||
|
||||
.page.actionsheet,.page.dialog {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.page.dialog .page__bd {
|
||||
padding: 0 15px
|
||||
}
|
||||
|
||||
.page.msg,.page.msg_success,.page.msg_warn,.page.toast {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.page.panel .page__bd {
|
||||
padding-bottom: 20px
|
||||
}
|
||||
|
||||
.page.article {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.page.icons {
|
||||
text-align: center
|
||||
}
|
||||
|
||||
.page.icons .page__bd {
|
||||
padding: 0 40px;
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.page.icons .icon-box {
|
||||
margin-bottom: 25px;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.page.icons .icon-box i {
|
||||
margin-right: 18px
|
||||
}
|
||||
|
||||
.page.icons .icon-box__ctn {
|
||||
-webkit-flex-shrink: 100;
|
||||
flex-shrink: 100
|
||||
}
|
||||
|
||||
.page.icons .icon-box__title {
|
||||
font-weight: 400
|
||||
}
|
||||
|
||||
.page.icons .icon-box__desc {
|
||||
margin-top: 6px;
|
||||
font-size: 12px;
|
||||
color: #888
|
||||
}
|
||||
|
||||
.page.icons .icon_sp_area {
|
||||
margin-top: 10px;
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.page.icons .icon_sp_area i:before {
|
||||
margin-bottom: 5px
|
||||
}
|
||||
|
||||
.page.flex .placeholder {
|
||||
margin: 5px;
|
||||
padding: 0 10px;
|
||||
background-color: #ebebeb;
|
||||
height: 2.3em;
|
||||
line-height: 2.3em;
|
||||
text-align: center;
|
||||
color: #cfcfcf
|
||||
}
|
||||
|
||||
.page.loadmore {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.page.layers {
|
||||
overflow-x: hidden;
|
||||
-webkit-perspective: 1000px;
|
||||
perspective: 1000px
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
.page.layers .page__hd {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px
|
||||
}
|
||||
}
|
||||
|
||||
.page.layers .page__bd {
|
||||
position: relative
|
||||
}
|
||||
|
||||
.page.layers .page__desc {
|
||||
min-height: 4.8em
|
||||
}
|
||||
|
||||
.page.layers .layers__layer {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
width: 150px;
|
||||
height: 266px;
|
||||
margin-left: -75px;
|
||||
box-sizing: border-box;
|
||||
-webkit-transition: .5s;
|
||||
transition: .5s;
|
||||
background: url(https://weui.io/images/layers/transparent.gif) no-repeat 50%;
|
||||
background-size: contain;
|
||||
font-size: 14px;
|
||||
color: #fff
|
||||
}
|
||||
|
||||
.page.layers .layers__layer span {
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
-webkit-transition: .5s;
|
||||
transition: .5s
|
||||
}
|
||||
|
||||
.page.layers .layers__layer:last-child span {
|
||||
color: #aaa
|
||||
}
|
||||
|
||||
.page.layers .layers__layer.j_hide {
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
.page.layers .layers__layer.j_pic span {
|
||||
color: transparent
|
||||
}
|
||||
|
||||
@media only screen and (min-width:375px) and (min-height:603px) {
|
||||
.page.layers .layers__layer {
|
||||
width: 180px;
|
||||
height: 320px;
|
||||
margin-left: -90px
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width:414px) and (min-height:640px) {
|
||||
.page.layers .layers__layer {
|
||||
width: 200px;
|
||||
height: 355px;
|
||||
margin-left: -100px
|
||||
}
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_popout {
|
||||
border: 1px solid hsla(0,0%,80%,.5);
|
||||
z-index: 4
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_popout.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(120px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(120px)
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
.page.layers .layers__layer_popout.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(140px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(140px)
|
||||
}
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_popout.j_pic {
|
||||
border-color: transparent;
|
||||
background-image: url(https://weui.io/images/layers/popout.png)
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_mask {
|
||||
background-color: rgba(0,0,0,.5);
|
||||
z-index: 3
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_mask.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(40px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(40px)
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
.page.layers .layers__layer_mask.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(80px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(80px)
|
||||
}
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_navigation {
|
||||
background-color: rgba(40,187,102,.5);
|
||||
z-index: 2
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_navigation.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(-40px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(-40px)
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
.page.layers .layers__layer_navigation.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(20px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(20px)
|
||||
}
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_navigation.j_pic {
|
||||
background-color: transparent;
|
||||
background-image: url(https://weui.io/images/layers/navigation.png)
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_content {
|
||||
background-color: #fff;
|
||||
z-index: 1
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_content.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(-120px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(-120px)
|
||||
}
|
||||
|
||||
@media only screen and (max-width:320px) {
|
||||
.page.layers .layers__layer_content.j_transform {
|
||||
-webkit-transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(-40px);
|
||||
transform: translateX(15px) rotateX(45deg) rotate(10deg) skew(-15deg) translateZ(-40px)
|
||||
}
|
||||
}
|
||||
|
||||
.page.layers .layers__layer_content.j_pic {
|
||||
background-image: url(https://weui.io/images/layers/content.png)
|
||||
}
|
||||
|
||||
.page.searchbar .searchbar-result {
|
||||
display: none;
|
||||
margin-top: 0;
|
||||
font-size: 14px
|
||||
}
|
||||
|
||||
.page.searchbar .searchbar-result .weui-cell__bd {
|
||||
padding: 2px 0 2px 20px;
|
||||
color: #666
|
||||
}
|
||||
|
||||
.page.actionsheet,.page.picker {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.page.picker {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.page.gallery {
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
@-webkit-keyframes a {
|
||||
0% {
|
||||
-webkit-transform: translate3d(100%,0,0);
|
||||
transform: translate3d(100%,0,0);
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes a {
|
||||
0% {
|
||||
-webkit-transform: translate3d(100%,0,0);
|
||||
transform: translate3d(100%,0,0);
|
||||
opacity: 0
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes b {
|
||||
0% {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: translate3d(100%,0,0);
|
||||
transform: translate3d(100%,0,0);
|
||||
opacity: 0
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes b {
|
||||
0% {
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
opacity: 1
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: translate3d(100%,0,0);
|
||||
transform: translate3d(100%,0,0);
|
||||
opacity: 0
|
||||
}
|
||||
}
|
||||
|
||||
.page.slideIn {
|
||||
-webkit-animation: a .2s forwards;
|
||||
animation: a .2s forwards
|
||||
}
|
||||
|
||||
.page.slideOut {
|
||||
-webkit-animation: b .2s forwards;
|
||||
animation: b .2s forwards
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { define, WeElement } from 'omi'
|
||||
import logo from './logo.svg'
|
||||
import style from './_index.css'
|
||||
import logo from './logo.png'
|
||||
import '../app-intro'
|
||||
import 'omi-weui/button'
|
||||
|
||||
|
|
@ -19,18 +19,220 @@ define('my-app', class extends WeElement {
|
|||
|
||||
render(props, data, store) {
|
||||
return (
|
||||
<div class="app">
|
||||
<ow-button type="primary">primary</ow-button>
|
||||
<header class="app-header">
|
||||
<img
|
||||
src={logo}
|
||||
onClick={this.clickHandler}
|
||||
class="app-logo"
|
||||
alt="logo"
|
||||
/>
|
||||
<h1 class="app-title">Welcome to {store.data.name}</h1>
|
||||
</header>
|
||||
<app-intro />
|
||||
<div class="page">
|
||||
<div class="page__hd">
|
||||
<h1 class="page__title">
|
||||
<img src={logo} alt="WeUI" style="height:21px;" />
|
||||
</h1>
|
||||
<p class="page__desc">WeUI 是一套同微信原生视觉体验一致的基础样式库，由微信官方设计团队为微信内网页和微信小程序量身设计，令用户的使用感知更加统一。</p>
|
||||
</div>
|
||||
<div class="page__bd page__bd_spacing">
|
||||
<ul>
|
||||
<li>
|
||||
<div class="weui-flex js_category">
|
||||
<p class="weui-flex__item">表单</p>
|
||||
<img src="./images/icon_nav_form.png" alt="" />
|
||||
</div>
|
||||
<div class="page__category js_categoryInner">
|
||||
<div class="weui-cells page__category-content">
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="button" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Button</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="input" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Input</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="list" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>List</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="slider" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Slider</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="uploader" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Uploader</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="weui-flex js_category">
|
||||
<p class="weui-flex__item">基础组件</p>
|
||||
<img src="./images/icon_nav_layout.png" alt="" />
|
||||
</div>
|
||||
<div class="page__category js_categoryInner">
|
||||
<div class="weui-cells page__category-content">
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="article" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Article</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="badge" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Badge</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="flex" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Flex</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="footer" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Footer</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="gallery" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Gallery</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="grid" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Grid</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="icons" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Icons</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="loadmore" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Loadmore</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="panel" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Panel</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="preview" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Preview</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="progress" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Progress</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="weui-flex js_category">
|
||||
<p class="weui-flex__item">操作反馈</p>
|
||||
<img src="./images/icon_nav_feedback.png" alt="" />
|
||||
</div>
|
||||
<div class="page__category js_categoryInner">
|
||||
<div class="weui-cells page__category-content">
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="actionsheet" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Actionsheet</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="dialog" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Dialog</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="msg" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Msg</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="picker" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Picker</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="toast" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Toast</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="weui-flex js_category">
|
||||
<p class="weui-flex__item">导航相关</p>
|
||||
<img src="./images/icon_nav_nav.png" alt="" />
|
||||
</div>
|
||||
<div class="page__category js_categoryInner">
|
||||
<div class="weui-cells page__category-content">
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="navbar" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Navbar</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="tabbar" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Tabbar</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="weui-flex js_category">
|
||||
<p class="weui-flex__item">搜索相关</p>
|
||||
<img src="./images/icon_nav_search.png" alt="" />
|
||||
</div>
|
||||
<div class="page__category js_categoryInner">
|
||||
<div class="weui-cells page__category-content">
|
||||
<a class="weui-cell weui-cell_access js_item" data-id="searchbar" href="javascript:;">
|
||||
<div class="weui-cell__bd">
|
||||
<p>Search Bar</p>
|
||||
</div>
|
||||
<div class="weui-cell__ft"></div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="weui-flex js_item" data-id="layers">
|
||||
<p class="weui-flex__item">层级规范</p>
|
||||
<img src="./images/icon_nav_z-index.png" alt="" />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="page__ft">
|
||||
<a href="javascript:home()"><img src="./images/icon_footer.png" /></a>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
|
|
@ -1,23 +0,0 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="529px" height="529px" viewBox="0 0 529 529" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<title>OMI</title>
|
||||
<defs>
|
||||
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
|
||||
<stop stop-color="#FFD4DE" offset="0%"></stop>
|
||||
<stop stop-color="#D0021B" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-2">
|
||||
<stop stop-color="#00375E" offset="0%"></stop>
|
||||
<stop stop-color="#9ECAFD" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-3">
|
||||
<stop stop-color="#B4EC51" offset="0%"></stop>
|
||||
<stop stop-color="#429321" offset="100%"></stop>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<g id="OMI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
|
||||
<path d="M360.461194,392.400665 L331.766299,363.852923 C362.137315,342.610697 382,307.374938 382,267.5 C382,242.280821 374.054892,218.917322 360.531177,199.776002 L264.653589,295.653589 L249.205844,280.205844 L249.063708,280.34798 L168.478308,199.762579 C154.948823,218.906399 147,242.274926 147,267.5 C147,307.374938 166.862685,342.610697 197.233701,363.852923 L168.538806,392.400665 C131.116001,363.605836 107,318.369215 107,267.5 C107,216.869975 130.889745,171.819699 168.011797,143.006609 L222.432893,197.148622 L264.511454,239.227182 L311.034034,192.704602 L360.988203,143.006609 C398.110255,171.819699 422,216.869975 422,267.5 C422,318.369215 397.883999,363.605836 360.461194,392.400665 Z" id="M" fill="url(#linearGradient-1)" fill-rule="nonzero"></path>
|
||||
<path d="M264.5,472 C149.900914,472 57,379.099086 57,264.5 C57,149.900914 149.900914,57 264.5,57 C379.099086,57 472,149.900914 472,264.5 C472,379.099086 379.099086,472 264.5,472 Z M263.5,436 C357.112265,436 433,360.112265 433,266.5 C433,172.887735 357.112265,97 263.5,97 C169.887735,97 94,172.887735 94,266.5 C94,360.112265 169.887735,436 263.5,436 Z" id="O" fill="url(#linearGradient-2)" fill-rule="nonzero"></path>
|
||||
<circle id="I-Dot" fill="url(#linearGradient-3)" fill-rule="nonzero" cx="319" cy="142" r="20"></circle>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.3 KiB |
|
|
@ -1,8 +1,8 @@
|
|||
import { render } from 'omi'
|
||||
import './assets/index.css'
|
||||
import './elements/app'
|
||||
import registerServiceWorker from './assets/register-service-worker'
|
||||
|
||||
import store from './store/app-store'
|
||||
|
||||
render(<my-app />, '#root', store)
|
||||
registerServiceWorker()
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
export default {
|
||||
data: { name: 'I am admin page' },
|
||||
rename(name) {
|
||||
this.data.name = name
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue