commit 7174522c57dcd4d98caf93df72a8372daf502bbc Author: Gwk <583478805@qq.com> Date: Tue Aug 30 09:39:22 2022 +0800 all diff --git a/css/scroll.css b/css/scroll.css new file mode 100644 index 0000000..626e566 --- /dev/null +++ b/css/scroll.css @@ -0,0 +1,40 @@ +/*---滚动条默认显示样式--*/ + +::-webkit-scrollbar-thumb{ + +background-color:rgba(0, 147, 255, 0.4); + +height:50px; + +outline-offset:-2px; + +outline:2px solid rgba(0, 0, 0, 0); + +-webkit-border-radius:4px; + +border: 2px solid rgba(0, 0, 0, 0); + +} + + + +/*---滚动条大小--*/ + +::-webkit-scrollbar{ + +width:8px; + +height:8px; + + +} + +/*---滚动框背景样式--*/ + +::-webkit-scrollbar-track-piece{ + +background-color:rgba(0, 0, 0, 0); + +-webkit-border-radius:0; + +} \ No newline at end of file diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..34a62c6 --- /dev/null +++ b/css/style.css @@ -0,0 +1,201 @@ +*{ + margin: 0; + padding: 0; +} + +html,body { + width: 100%; + height: 100%; +} + +#app { + width: 100%; + height: 100%; + background: url(../img/pc-bg.png) no-repeat top center; + background-size: cover; + box-sizing: border-box; + padding-top: 1px; +} + +#app > h1 { + margin-top: 200px; + font-size: 80px; + font-family: Source Han Sans CN; + font-weight: 500; + color: #FFFFFF; + text-align: center; + letter-spacing: 5px; + text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3); +} + +.sel-div { + width: 507px; + height: 357px; + margin: 80px auto; + position: relative; +} +.sel-div > .sel-input{ + width: 484px; + height: 59px; + margin: 4px 17px 0px 6px; + box-sizing: border-box; + padding-left: 41px; + display: flex; + align-items: center; + background: url(../img/pc-sel.png) no-repeat center; + background-size: 100% 100%; + cursor: pointer; + position: relative; + z-index: 2; +} + +.sel-div > .sel-input > p { + line-height: 59px; + font-size: 26px; + font-family: Source Han Sans CN; + font-weight: 400; + color: #FFFFFF; + letter-spacing: 5px; + flex: 1; +} +.sel-div > .sel-input > img { + margin-right: 39px; +} + +.sel-div > .sel-body { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: url(../img/pc-sel-body.png) no-repeat center; + background-size: 100% 100%; +} + +.set-place { + height: 63px; +} +.option-body { + height: calc(100% - 80px); + width: calc(100% - 18px); + overflow-y: auto; +} +.option-body >div { + font-size: 20px; + font-family: Source Han Sans CN; + font-weight: 400; + color: #FFFFFF; + padding: 10px 20px 10px 40px; + letter-spacing: 4px; + cursor: pointer; +} + +.option-body >div:hover { + font-size: 27px; + font-family: Source Han Sans CN; + font-weight: 500; +} + +.option-body >.active-option { + font-size: 27px; + font-family: Source Han Sans CN; + font-weight: 500; +} + +@media screen and (max-width: 500px) { + #app { + background: url(../img/mobile-bg.png) no-repeat top center; + background-size: cover; + } + #app > h1 { + margin-top: 130px; + font-size: 35px; + font-family: Source Han Sans CN; + font-weight: 500; + color: #FFFFFF; + letter-spacing: 4px; + text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3); + } + + .sel-div { + width: 255.5px; + height: 178.5px; + margin: 33px auto; + position: relative; + } + + .sel-div > .sel-input{ + width: 242px; + height: 30px; + margin: 1px 6px 0px 5.5px; + box-sizing: border-box; + padding-left: 20.5px; + display: flex; + align-items: center; + background: url(../img/mobile-sel.png) no-repeat center; + background-size: 100% 100%; + cursor: pointer; + position: relative; + z-index: 2; + } + + .sel-div > .sel-input > p { + line-height: 30px; + font-size: 14px; + font-family: Source Han Sans CN; + font-weight: 400; + color: #FFFFFF; + letter-spacing: 2px; + flex: 1; + } + .sel-div > .sel-input > img { + margin-right: 19.5px !important; + width: 10.5px; + height: 6px; + } + + + .sel-div > .sel-body { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + background: url(../img/mobile-sel-body.png) no-repeat center; + background-size: 100% 100%; + } + + .set-place { + height: 31.5px; + } + .option-body { + height: calc(100% - 40px); + width: calc(100% - 9px); + overflow-y: auto; + } + .option-body >div { + font-size: 13px; + font-family: Source Han Sans CN; + font-weight: 400; + color: #FFFFFF; + padding: 5px 10px 5px 20px; + letter-spacing: 2px; + cursor: pointer; + } + + .option-body >div:hover { + font-size: 15px; + font-family: Source Han Sans CN; + font-weight: 500; + } + + .option-body >.active-option { + font-size: 15px; + font-family: Source Han Sans CN; + font-weight: 500; + } + +} + + + diff --git a/img/arrow.png b/img/arrow.png new file mode 100644 index 0000000..208e1a0 Binary files /dev/null and b/img/arrow.png differ diff --git a/img/mobile-bg.png b/img/mobile-bg.png new file mode 100644 index 0000000..d590d86 Binary files /dev/null and b/img/mobile-bg.png differ diff --git a/img/mobile-sel-body.png b/img/mobile-sel-body.png new file mode 100644 index 0000000..1f6d766 Binary files /dev/null and b/img/mobile-sel-body.png differ diff --git a/img/mobile-sel.png b/img/mobile-sel.png new file mode 100644 index 0000000..59901b3 Binary files /dev/null and b/img/mobile-sel.png differ diff --git a/img/pc-bg.png b/img/pc-bg.png new file mode 100644 index 0000000..c77b095 Binary files /dev/null and b/img/pc-bg.png differ diff --git a/img/pc-sel-body.png b/img/pc-sel-body.png new file mode 100644 index 0000000..387a171 Binary files /dev/null and b/img/pc-sel-body.png differ diff --git a/img/pc-sel.png b/img/pc-sel.png new file mode 100644 index 0000000..59901b3 Binary files /dev/null and b/img/pc-sel.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..908c716 --- /dev/null +++ b/index.html @@ -0,0 +1,75 @@ + + +
+ +请选择租户
+{{selectedTenant.name}}
+ +, or missing
. Bailing hydration and performing ' + + 'full client-side render.' + ); + } + } + // either not server-rendered, or hydration failed. + // create an empty node and replace it + oldVnode = emptyNodeAt(oldVnode); + } + + // replacing existing element + var oldElm = oldVnode.elm; + var parentElm = nodeOps.parentNode(oldElm); + + // create new node + createElm( + vnode, + insertedVnodeQueue, + // extremely rare edge case: do not insert if old element is in a + // leaving transition. Only happens when combining transition + + // keep-alive + HOCs. (#4590) + oldElm._leaveCb ? null : parentElm, + nodeOps.nextSibling(oldElm) + ); + + // update parent placeholder node element, recursively + if (isDef(vnode.parent)) { + var ancestor = vnode.parent; + var patchable = isPatchable(vnode); + while (ancestor) { + for (var i = 0; i < cbs.destroy.length; ++i) { + cbs.destroy[i](ancestor); + } + ancestor.elm = vnode.elm; + if (patchable) { + for (var i$1 = 0; i$1 < cbs.create.length; ++i$1) { + cbs.create[i$1](emptyNode, ancestor); + } + // #6513 + // invoke insert hooks that may have been merged by create hooks. + // e.g. for directives that uses the "inserted" hook. + var insert = ancestor.data.hook.insert; + if (insert.merged) { + // start at index 1 to avoid re-invoking component mounted hook + for (var i$2 = 1; i$2 < insert.fns.length; i$2++) { + insert.fns[i$2](); + } + } + } else { + registerRef(ancestor); + } + ancestor = ancestor.parent; + } + } + + // destroy old node + if (isDef(parentElm)) { + removeVnodes(parentElm, [oldVnode], 0, 0); + } else if (isDef(oldVnode.tag)) { + invokeDestroyHook(oldVnode); + } + } + } + + invokeInsertHook(vnode, insertedVnodeQueue, isInitialPatch); + return vnode.elm + } + } + + /* */ + + var directives = { + create: updateDirectives, + update: updateDirectives, + destroy: function unbindDirectives (vnode) { + updateDirectives(vnode, emptyNode); + } + }; + + function updateDirectives (oldVnode, vnode) { + if (oldVnode.data.directives || vnode.data.directives) { + _update(oldVnode, vnode); + } + } + + function _update (oldVnode, vnode) { + var isCreate = oldVnode === emptyNode; + var isDestroy = vnode === emptyNode; + var oldDirs = normalizeDirectives$1(oldVnode.data.directives, oldVnode.context); + var newDirs = normalizeDirectives$1(vnode.data.directives, vnode.context); + + var dirsWithInsert = []; + var dirsWithPostpatch = []; + + var key, oldDir, dir; + for (key in newDirs) { + oldDir = oldDirs[key]; + dir = newDirs[key]; + if (!oldDir) { + // new directive, bind + callHook$1(dir, 'bind', vnode, oldVnode); + if (dir.def && dir.def.inserted) { + dirsWithInsert.push(dir); + } + } else { + // existing directive, update + dir.oldValue = oldDir.value; + dir.oldArg = oldDir.arg; + callHook$1(dir, 'update', vnode, oldVnode); + if (dir.def && dir.def.componentUpdated) { + dirsWithPostpatch.push(dir); + } + } + } + + if (dirsWithInsert.length) { + var callInsert = function () { + for (var i = 0; i < dirsWithInsert.length; i++) { + callHook$1(dirsWithInsert[i], 'inserted', vnode, oldVnode); + } + }; + if (isCreate) { + mergeVNodeHook(vnode, 'insert', callInsert); + } else { + callInsert(); + } + } + + if (dirsWithPostpatch.length) { + mergeVNodeHook(vnode, 'postpatch', function () { + for (var i = 0; i < dirsWithPostpatch.length; i++) { + callHook$1(dirsWithPostpatch[i], 'componentUpdated', vnode, oldVnode); + } + }); + } + + if (!isCreate) { + for (key in oldDirs) { + if (!newDirs[key]) { + // no longer present, unbind + callHook$1(oldDirs[key], 'unbind', oldVnode, oldVnode, isDestroy); + } + } + } + } + + var emptyModifiers = Object.create(null); + + function normalizeDirectives$1 ( + dirs, + vm + ) { + var res = Object.create(null); + if (!dirs) { + // $flow-disable-line + return res + } + var i, dir; + for (i = 0; i < dirs.length; i++) { + dir = dirs[i]; + if (!dir.modifiers) { + // $flow-disable-line + dir.modifiers = emptyModifiers; + } + res[getRawDirName(dir)] = dir; + dir.def = resolveAsset(vm.$options, 'directives', dir.name, true); + } + // $flow-disable-line + return res + } + + function getRawDirName (dir) { + return dir.rawName || ((dir.name) + "." + (Object.keys(dir.modifiers || {}).join('.'))) + } + + function callHook$1 (dir, hook, vnode, oldVnode, isDestroy) { + var fn = dir.def && dir.def[hook]; + if (fn) { + try { + fn(vnode.elm, dir, vnode, oldVnode, isDestroy); + } catch (e) { + handleError(e, vnode.context, ("directive " + (dir.name) + " " + hook + " hook")); + } + } + } + + var baseModules = [ + ref, + directives + ]; + + /* */ + + function updateAttrs (oldVnode, vnode) { + var opts = vnode.componentOptions; + if (isDef(opts) && opts.Ctor.options.inheritAttrs === false) { + return + } + if (isUndef(oldVnode.data.attrs) && isUndef(vnode.data.attrs)) { + return + } + var key, cur, old; + var elm = vnode.elm; + var oldAttrs = oldVnode.data.attrs || {}; + var attrs = vnode.data.attrs || {}; + // clone observed objects, as the user probably wants to mutate it + if (isDef(attrs.__ob__)) { + attrs = vnode.data.attrs = extend({}, attrs); + } + + for (key in attrs) { + cur = attrs[key]; + old = oldAttrs[key]; + if (old !== cur) { + setAttr(elm, key, cur); + } + } + // #4391: in IE9, setting type can reset value for input[type=radio] + // #6666: IE/Edge forces progress value down to 1 before setting a max + /* istanbul ignore if */ + if ((isIE || isEdge) && attrs.value !== oldAttrs.value) { + setAttr(elm, 'value', attrs.value); + } + for (key in oldAttrs) { + if (isUndef(attrs[key])) { + if (isXlink(key)) { + elm.removeAttributeNS(xlinkNS, getXlinkProp(key)); + } else if (!isEnumeratedAttr(key)) { + elm.removeAttribute(key); + } + } + } + } + + function setAttr (el, key, value) { + if (el.tagName.indexOf('-') > -1) { + baseSetAttr(el, key, value); + } else if (isBooleanAttr(key)) { + // set attribute for blank value + // e.g. + if (isFalsyAttrValue(value)) { + el.removeAttribute(key); + } else { + // technically allowfullscreen is a boolean attribute for