Toggle menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

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

Template page
No edit summary
Tag: Reverted
mNo edit summary
 
(21 intermediate revisions by the same user not shown)
Line 1: Line 1:
#home-nav {
.profile-iconbox {
margin-top: 1rem;
position: relative;
background: #242a31;
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;
overflow: hidden;
    display: inline-block;
    min-width: 170px;
    width: 100%;
    height: 4rem;
}
.profile-iconbox .profile-iconbox__img a {
display: block;
height: 100%;
}
 
.profile-iconbox .profile-iconbox__img:after {
position: absolute;
pointer-events: none;
right: 0;
bottom: 0;
left: 0;
display: block;
    height: 100% !important;
    background: linear-gradient(to right,rgba(0,0,0,0.8),transparent) !important;
border-radius: 0 0 8px 8px;
content: '';
}
 
.profile-iconbox__img img {
  transition: transform 250ms cubic-bezier(0.215,0.61,0.355,1);
  height: 4rem;
  width: 100%;
  object-fit: cover;
}
 
.profile-iconbox__img img:hover {
  transform: scale(1.1);
  transition: transform 250ms cubic-bezier(0.215,0.61,0.355,1);
  height: 4rem;
  width: 100%;
}
}


#home-nav .home-card__background:after {
.profile-iconbox__foreground {
position: absolute;
position: absolute;
    pointer-events: none;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: block;
    background: linear-gradient(to right,rgba(0, 0, 0, 0.8),transparent);
    content: "";
}
}


#home-nav .home-card__foreground {
.profile-iconbox__foreground .profile-iconbox__label {
color: #bababa;
}
 
.profile-iconbox__foreground .profile-iconbox__header {
color: #fff;
}
.profile-iconbox .profile-iconbox__foreground {
pointer-events: none;
pointer-events: none;
height: 100%;
bottom: 27%;
    width: 100%;
left: 15px;
    display: flex;
}
    align-items: center;
.home-card__foreground .profile-iconbox__label {
    padding: 0 15px;
color: #bababa;
    color: #fff;
}
    font-weight: bold;
.profile-iconbox__label {
color: var( --color-base--subtle );
font-size: 0.8125rem;
letter-spacing: 0.75px;
}
h3.profile-iconbox__header {
margin-top: 0;
font-size: 1rem;
}
 
.profile-iconbox__header a {
display: flex;
align-items: center;
justify-content: space-between;
}
}
.mw-parser-output .home-grid {
 
  display: grid;
.profile-iconbox__header a:after {
  grid: auto-flow dense/repeat(auto-fit,minmax(9.375rem,1fr));
content: '▶';
  grid-auto-rows: minmax(4rem,auto);
font-size: 0.8125rem;
  grid-gap: 0.625rem;
}
}

Latest revision as of 05:38, 26 October 2023

.profile-iconbox {
	position: relative;
	background: #242a31;
	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;
	overflow: hidden;
    display: inline-block;
    min-width: 170px;
    width: 100%;
    height: 4rem;
}
.profile-iconbox .profile-iconbox__img a {
	display: block;
	height: 100%;
}

.profile-iconbox .profile-iconbox__img:after {
	position: absolute;
	pointer-events: none;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
    height: 100% !important;
    background: linear-gradient(to right,rgba(0,0,0,0.8),transparent) !important;
	border-radius: 0 0 8px 8px;
	content: '';
}

.profile-iconbox__img img {
  transition: transform 250ms cubic-bezier(0.215,0.61,0.355,1);
  height: 4rem;
  width: 100%;
  object-fit: cover;
}

.profile-iconbox__img img:hover {
  transform: scale(1.1);
  transition: transform 250ms cubic-bezier(0.215,0.61,0.355,1);
  height: 4rem;
  width: 100%;
}

.profile-iconbox__foreground {
	position: absolute;
}

.profile-iconbox__foreground .profile-iconbox__label {
	color: #bababa;
}

.profile-iconbox__foreground .profile-iconbox__header {
	color: #fff;
}
.profile-iconbox .profile-iconbox__foreground {
	pointer-events: none;
	bottom: 27%;
	left: 15px;
}
.home-card__foreground .profile-iconbox__label {
	color: #bababa;
}
.profile-iconbox__label {
	color: var( --color-base--subtle );
	font-size: 0.8125rem;
	letter-spacing: 0.75px;
}
h3.profile-iconbox__header {
	margin-top: 0;
	font-size: 1rem;
}

.profile-iconbox__header a {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.profile-iconbox__header a:after {
	content: '▶';
	font-size: 0.8125rem;
}