From fcde05b72dc8217199ef62ce20179bdb98f6e561 Mon Sep 17 00:00:00 2001 From: A1300399510 Date: Wed, 18 Dec 2024 15:32:19 +0800 Subject: [PATCH] no message --- css/common.css | 37 ++++++++++++++++++++++++++++++++++++- css/common.less | 45 ++++++++++++++++++++++++++++++++++++++++++--- css/index.css | 1 + css/index.less | 1 + 4 files changed, 80 insertions(+), 4 deletions(-) diff --git a/css/common.css b/css/common.css index dff6542..17ee9a3 100644 --- a/css/common.css +++ b/css/common.css @@ -74,6 +74,9 @@ body { padding: 0 20px; position: relative; } +.base .left.input-active { + border: 1px solid #c4c7ce; +} .base .left .text { font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-weight: 400; @@ -88,8 +91,40 @@ body { height: 20px; } .base .left .hint-list { - top: auto; + position: absolute; + width: 750px; + height: 0; + max-height: 400px; bottom: 54px; + left: -1px; + background-color: #ffffff; + border-radius: 0 0 10px 10px; + z-index: 10; + overflow: auto; + animation: hintShow 0.3s forwards; + border: 0px solid #c4c7ce; + border-top: none; + box-shadow: 0px 5px 5px #dfdfdf; +} +@keyframes hintShow { + 0% { + height: 0; + } + 100% { + border-width: 1px; + height: auto; + } +} +.base .left .hint-list .item { + color: #333333; + font-size: 14px; + padding: 10px 20px; + cursor: pointer; + line-height: 30px; + display: block; +} +.base .left .hint-list .item:not(:last-of-type) { + border-bottom: 1px #e6e4e4 dotted; } .base .rigth { width: 175px; diff --git a/css/common.less b/css/common.less index bbfb637..2d097f6 100644 --- a/css/common.less +++ b/css/common.less @@ -87,6 +87,11 @@ body { margin-right: 5px; padding: 0 20px; position: relative; + + &.input-active { + border: 1px solid #c4c7ce; + } + .text { font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; font-weight: 400; @@ -104,8 +109,44 @@ body { } .hint-list { - top: auto; + position: absolute; + width: 750px; + height: 0; + max-height: 400px; bottom: 54px; + left: -1px; + background-color: rgba(255, 255, 255, 1); + border-radius: 0 0 10px 10px; + z-index: 10; + overflow: auto; + animation: hintShow 0.3s forwards; + border: 0px solid #c4c7ce; + border-top: none; + box-shadow: 0px 5px 5px #dfdfdf; + + @keyframes hintShow { + 0% { + height: 0; + } + + 100% { + border-width: 1px; + height: auto; + } + } + + .item { + color: #333333; + font-size: 14px; + padding: 10px 20px; + cursor: pointer; + line-height: 30px; + display: block; + + &:not(:last-of-type) { + border-bottom: 1px #e6e4e4 dotted; + } + } } } @@ -855,5 +896,3 @@ body { left: 0; z-index: -1; } - - diff --git a/css/index.css b/css/index.css index c776f29..f958352 100644 --- a/css/index.css +++ b/css/index.css @@ -59,6 +59,7 @@ outline: none; font-size: 16px; font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; + padding-right: 10px; } .header-box .search .input::placeholder { color: #ffffff; diff --git a/css/index.less b/css/index.less index 2a512ec..f6c45f1 100644 --- a/css/index.less +++ b/css/index.less @@ -63,6 +63,7 @@ outline: none; font-size: 16px; font-family: "PingFangSC-Regular", "PingFang SC", sans-serif; + padding-right: 10px; &::placeholder { color: #ffffff; }