Template:Home/ServerInfo/styles.css: Difference between revisions

Revision as of 05:42, 31 January 2023

.home-server-address {
  text-align: center;
  font-size: x-large;
  font-family: var(--font-family-monospace);
  text-decoration: underline;
}

.home-server-ports {
  text-align: center;
  font-size: small;
  font-family: var(--font-family-monospace);
}
#home-gamebuild {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.home-gamebuild-patch__container {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.home-gamebuild-patch {
	display: flex;
	align-items: center;
}

.home-gamebuild-patch__name {
	font-size: 1.2rem;
	font-weight: 600;
}

.home-gamebuild-patch__type {
	padding: 0.1rem 0.6rem;
	margin-left: 0.4rem;
	background: var( --color-surface-3 );
	border-radius: 100px;
	font-size: 0.8125rem;
	font-weight: 500;
	text-transform: uppercase;
}

.home-gamebuild-patch__type--live {
	background: var( --background-color-success );
}

.home-gamebuild-patch__type--evo {
	background: var( --background-color-destructive );
}

.home-gamebuild-patch__type--ptu {
	background: var( --background-color-warning );
}

@@ Line 11: / Line 11: @@
    font-family: var(--font-family-monospace);
 }
+#home-gamebuild {
-.home-grid {
+	display: flex;
-	display: grid;
+	flex-direction: column;
-	grid: auto-flow dense/repeat( auto-fit, minmax( 9.375rem, 1fr ) );
+	justify-content: space-between;
-	grid-auto-rows: minmax( 3rem, auto );
-	grid-gap: 0.625rem;
 }
-.home-grid--col2 {
+.home-gamebuild-patch__container {
-	grid-template-columns: 1fr 1fr;
-}
-.home-grid a.external {
-	background-image: none;
-}
-.home-card {
-	position: relative;
-	padding: 15px;
-	background: var( --color-surface-1 );
-	border-radius: 8px;
-	box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
-	font-size: 0.875rem;
-}
-.home-card table.timeline {
-	margin-top: 0.2rem;
-}
-.home-card--col2 {
-	grid-column: span 2;
-}
-.home-card--row3 {
-	grid-row: span 3;
-}
-.home-card--row4 {
-	grid-row: span 4;
-}
-.home-card--row8 {
-	grid-row: span 8 / auto;
-}
-.home-card__label {
-	color: var( --color-base--subtle );
-	font-size: 0.8125rem;
-	letter-spacing: 0.75px;
-}
-h3.home-card__header {
-	margin-top: 0;
-	font-size: 1rem;
-}
-.home-card__header a {
 	display: flex;
 	align-items: center;
@@ Line 73: / Line 23: @@
 }
-.home-card__header a:after {
+.home-gamebuild-patch {
-	content: '▶';
-	font-size: 0.8125rem;
-}
-.home-card__background {
-	position: absolute;
-	top: 0;
-	right: 0;
-	bottom: 0;
-	left: 0;
-	background: #242a31;
-	border-radius: 8px;
-}
-.home-card__background img {
-	width: 100%;
-	height: 100%;
-	object-fit: cover;
-	object-position: center;
-}
-.home-card__foreground {
-	position: absolute;
-}
-.home-card__foreground .home-card__label {
-	color: #bababa;
-}
-.home-card__foreground .home-card__header {
-	color: #fff;
-}
-.home-card p {
-	margin-top: 0.2rem;
-	font-size: 0.875rem;
-}
-.home-card.home-card--button {
-	overflow: hidden;
-	padding: 0;
-	background: #242a31;
-}
-.home-card--button a {
 	display: flex;
-	height: 100%;
-	justify-content: center;
 	align-items: center;
-	padding: 0 15px;
-	background: transparent;
-	color: #fff;
-	font-weight: 500;
 }
-.home-card--button .home-card__background a {
+.home-gamebuild-patch__name {
-	padding: 0;
+	font-size: 1.2rem;
+	font-weight: 600;
 }
-.home-card--button img {
+.home-gamebuild-patch__type {
-	transition: transform 0.2s ease;
+	padding: 0.1rem 0.6rem;
-}
+	margin-left: 0.4rem;
+	background: var( --color-surface-3 );
-.home-card--button:hover img {
+	border-radius: 100px;
-	transform: scale(1.1);
+	font-size: 0.8125rem;
-}
-.home-link {
-	display: grid;
-	margin-top: 6px;
-	font-size: 0.875rem;
 	font-weight: 500;
-	grid-gap: 6px;
+	text-transform: uppercase;
-	text-align: center;
-}
-.home-link__button {
-	display: flex;
-}
-.home-link__button a {
-	flex-grow: 1;
-	padding: 0.3rem 0.6rem;
-	border: 1px solid;
-	border-color: var( --border-color-base );
-	background: var( --color-surface-2 );
-	border-radius: 12px;
-	color: var( --color-base--emphasized ) !important;
-}
-.home-link__button a:hover {
-	background: var( --color-surface-2--hover );
-}
-.home-link__button a:active {
-	background: var( --color-surface-2--active );
-}
-#home-content {
-	margin-top: 1.6rem;
-}
-.home-stats {
-	flex-grow: 1;
-	line-height: 1;
 }
-.home-stats__value {
+.home-gamebuild-patch__type--live {
-	font-size: 1.5rem;
+	background: var( --background-color-success );
-	font-weight: 600;
 }
-.home-stats__unit {
+.home-gamebuild-patch__type--evo {
-	margin-top: 0.2rem;
+	background: var( --background-color-destructive );
-	color: var( --color-base--subtle );
-	font-size: 0.8125rem;
 }
-#home-card-discord {
+.home-gamebuild-patch__type--ptu {
-	background: #5865f2;
+	background: var( --background-color-warning );
-}
-.home-footer {
-	font-size: 0.8125rem;
-	font-family: monospace;
-	text-align: center;
 }