用户:CrablePotion/CSS/动态搜索栏.css:修订间差异

(CrablePotion移动页面用户:CrablePotion/CSS/动态搜索栏用户:CrablePotion/CSS/动态搜索栏.css,不留重定向:​eeeeeeeeeeeeeeeeeee)
无编辑摘要
 
(未显示同一用户的3个中间版本)
第1行: 第1行:
<includeonly>{{CSS|无预览=1|1=<nowiki>
.vector-search-box-input {
.vector-search-box-input {
    color: #000000;
color: #000;
    height: 2.45384615em;
height: 2.45em;
    box-sizing: border-box;
border: 2px solid #a2a9b1;
    border: 2px solid #a2a9b1;
border-radius: 4px;
    border-radius: 4px;
background-color: #fdf6e6;
    box-shadow: inset 0 0 0 1px transparent;
padding: 0 0 0 6px;
    font-size: 0.8125em;
box-sizing: border-box;
    direction: ltr;
font-size: 0.8125rem;
    transition-property: border-color,box-shadow;
width: 60%;
    transition-duration: 250ms;
transition: all 0.4s ease-in-out;
    width: 60%;
    background-color: #fdf6e6;
    background-position: 10px 10px;
    background-repeat: no-repeat;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    padding: 0 0 0 6px
}
}
.vector-search-box-input:focus {
.vector-search-box-input:focus {
    width: 100%;
width: 100%;
}
}
.searchButton {
.searchButton {
    background-color: transparent;
position: absolute;
    position: absolute;
bottom: 1px;
    bottom: 1px;
right: 40%;
    right: 40%;
min-width: 28px;
    min-width: 28px;
width: 2.45em;
    width: 2.45384615em;
text-indent: -99999px;
    border: 0;
white-space: nowrap;
    padding: 0;
overflow: hidden;
    cursor: pointer;
cursor: pointer;
    font-size: 0.8125em;
z-index: 1;
    direction: ltr;
transition: all 0.4s ease-in-out;
    text-indent: -99999px;
    white-space: nowrap;
    overflow: hidden;
    z-index: 1;
    transition: all 0.4s ease-in-out;
}
}
.vector-search-box-input:focus~.searchButton {
.vector-search-box-input:focus~.searchButton {
    position: absolute;
right: 0;
    right: -0%;
   
}
}
</nowiki>}}</includeonly>

2023年5月9日 (二) 21:28的最新版本

.vector-search-box-input {
	color: #000;
	height: 2.45em;
	border: 2px solid #a2a9b1;
	border-radius: 4px;
	background-color: #fdf6e6;
	padding: 0 0 0 6px;
	box-sizing: border-box;
	font-size: 0.8125rem;
	width: 60%;
	transition: all 0.4s ease-in-out;
}

.vector-search-box-input:focus {
	width: 100%;
}

.searchButton {
	position: absolute;
	bottom: 1px;
	right: 40%;
	min-width: 28px;
	width: 2.45em;
	text-indent: -99999px;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	z-index: 1;
	transition: all 0.4s ease-in-out;
}

.vector-search-box-input:focus~.searchButton {
	right: 0;
}