模板:首页/header/styles.css：修订间差异

2024年4月27日 (六) 20:12的版本

.home-header {
	margin-top: 1.6rem;
}

.home-header__title {
	margin-top: 0;
	font-size: 1.5rem;
}

.home-header .home-header__subtitle {
	margin-top: 0.4rem;
	font-size: 0.875rem;
}

.home-header__search {
	max-width: 600px;
	padding: 0.6rem 0.8rem;
	border: 1px solid;
	margin: 0.8rem auto 0 auto;
	border-radius: 100px;
	box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
	cursor: pointer;
	font-size: 0.875rem;
}

.keyboard-text {
	padding: 0 5px;
	border: 1px solid;
	margin: 0 2px;
	border-radius: 4px;
}

@media ( min-width: 682px ) {
	.home-header {
		text-align: center;
	}
}

@media ( hover: none ) {
	.desktoponly {
		display: none;
	}
}

@@ 第1行： / 第1行： @@
 .home-header {
-	position: relative;
+	margin-top: 1.6rem;
-	margin-top: -1rem;
-	margin-bottom: 2rem;
-	padding-top: 1rem;
-	line-height: var( --line-height-sm );
-}
-.home-header__pretitle {
-	margin-bottom: var( --space-xs );
-    color: var( --color-base--subtle );
-	font-size: 1rem;
-	text-transform: uppercase;
-	letter-spacing: 0.5em;
 }
 .home-header__title {
-	margin: 0;
+	margin-top: 0;
-	font-size: 3rem;
+	font-size: 1.5rem;
-	text-transform: uppercase;
-	letter-spacing: 0.025em;
-	line-height: 1;
 }
-.home-header__subtitle {
+.home-header .home-header__subtitle {
-	margin-top: var( --space-xs );
+	margin-top: 0.4rem;
 	font-size: 0.875rem;
-	letter-spacing: 0.3em;
 }
 .home-header__search {
 	max-width: 600px;
-	padding: var( --space-sm ) var( --space-md );
+	padding: 0.6rem 0.8rem;
-	margin-top: var( --space-md );
-	margin-bottom: var( --space-md );
-	margin-left: auto;
-	margin-right: auto;
 	border: 1px solid;
-	border-color: var( --border-color-base--darker );
+	margin: 0.8rem auto 0 auto;
-	border-radius: var( --border-radius--pill );
+	border-radius: 100px;
-	color: var( --color-base--subtle );
+	box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
 	cursor: pointer;
 	font-size: 0.875rem;
-}
-.home-header__search:hover {
-	background-color: var( --background-color-quiet--hover );
-}
-.home-header__searchIcon img {
-	margin-right: var( --space-md );
-    opacity: var( --opacity-icon-base );
 }
@@ 第60行： / 第31行： @@
 }
-html.skin-citizen-dark .home-header__searchIcon img {
+@media ( min-width: 682px ) {
-	filter: invert( 1 );
+	.home-header {
+		text-align: center;
+	}
 }