Шаблон:PortalBox/styles.css - История изменений

Admin: PortalBox: объём + hover (TemplateStyles-safe)

2026-08-06T20:45:25Z

PortalBox: объём + hover (TemplateStyles-safe)

← Предыдущая версия		Версия от 20:45, 6 августа 2026
Строка 20:		Строка 20:
	width: 100%;		width: 100%;
	min-height: 7.5rem;		min-height: 7.5rem;
	padding: 0.~~4rem~~ 0.~~25rem~~ 0.~~5rem~~;		padding: 0.45rem 0.3rem 0.55rem;
	background-color: var(--tmp-10);		background-color: var(--tmp-10);
	outline: 1px ~~solid~~ var(--tmp-25);		outline: 1px outset var(--tmp-25);
	border-radius: 8px;		border-radius: 8px;
	box-shadow: 0 2px 0 ~~rgba~~(~~0,0,0,.12~~);		box-shadow: 0 2px 0 var(--tmp-25);
	transition-property: box-shadow, outline-color;		transition-property: transform, box-shadow, outline-color, background-color;
	transition-duration: 0.~~15s~~;		transition-duration: 0.18s;
	z-index: 1;		z-index: 1;
	box-sizing: border-box;		box-sizing: border-box;
	}		}
	.portalbox--compact:hover .portalbox-wrapper--compact {		.portalbox--compact:hover .portalbox-wrapper--compact {
			transform: translateY(-0.18rem);
	outline-color: var(--tmp-75);		outline-color: var(--tmp-75);
			background-color: var(--tmp-25);
			box-shadow: 0 0.22rem 0 var(--tmp-50);
			z-index: 2;
			}
			.portalbox--compact:active .portalbox-wrapper--compact {
			transform: translateY(0);
			box-shadow: inset 0 0 0.12em 0.06em rgba(0, 0, 0, 0.16);
			transition-duration: 0s;
	}		}
	.portalbox-image {		.portalbox-image {
Строка 39:		Строка 48:
	width: 64px;		width: 64px;
	height: 64px;		height: 64px;
			}
			.portalbox-image a {
			transition-property: filter;
			transition-duration: 0.15s;
			}
			.portalbox--compact:active .portalbox-image a {
			filter: drop-shadow(0 0 3px var(--tmp-75));
			transition-duration: 0s;
	}		}
	.portalbox-image img,		.portalbox-image img,
Строка 63:		Строка 80:
	content: '';		content: '';
	position: absolute;		position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;		top: 0;
			right: 0;
			bottom: 0;
			left: 0;
	}		}

Admin: PortalBox: ширина под 2-колоночную сетку

2026-08-06T20:29:38Z

PortalBox: ширина под 2-колоночную сетку

← Предыдущая версия		Версия от 20:29, 6 августа 2026
Строка 5:		Строка 5:
	}		}
	.portalbox--compact {		.portalbox--compact {
	flex: ~~0 0~~ auto;		flex: 1 1 auto;
	width: ~~7.5rem~~;		width: 100%;
			max-width: 100%;
			min-width: 0;
	}		}
	.portalbox-wrapper--compact {		.portalbox-wrapper--compact {
Строка 26:		Строка 28:
	transition-duration: 0.15s;		transition-duration: 0.15s;
	z-index: 1;		z-index: 1;
			box-sizing: border-box;
	}		}
	.portalbox--compact:hover .portalbox-wrapper--compact {		.portalbox--compact:hover .portalbox-wrapper--compact {

Admin: import TemplateStyles CSS

2026-08-06T20:10:06Z

import TemplateStyles CSS

← Предыдущая версия		Версия от 20:10, 6 августа 2026
Строка 1:		Строка 1:

	.portalbox {		.portalbox {
	position: relative;		position: relative;
	display: flex;		display: flex;
	~~border-radius: 6px;~~
	}		}
			.portalbox--compact {
	.portalbox-wrapper {		flex: 0 0 auto;
			width: 7.5rem;
			}
			.portalbox-wrapper--compact {
	overflow: hidden;		overflow: hidden;
	position: relative;		position: relative;
	~~flex: 1;~~
	display: flex;		display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: flex-start;
			gap: 0.35rem;
			width: 100%;
			min-height: 7.5rem;
			padding: 0.4rem 0.25rem 0.5rem;
	background-color: var(--tmp-10);		background-color: var(--tmp-10);
	outline: 1px solid var(--tmp-25);		outline: 1px solid var(--tmp-25);
	border-radius: 8px;		border-radius: 8px;
	box-shadow: 0 2px 0 rgba(0,0,0,.12);		box-shadow: 0 2px 0 rgba(0,0,0,.12);
	transition-property: box-shadow;		transition-property: box-shadow, outline-color;
	transition-duration: 0.15s;		transition-duration: 0.15s;
	z-index: 1;		z-index: 1;
	}		}
			.portalbox--compact:hover .portalbox-wrapper--compact {
	.portalbox:hover .portalbox-wrapper {		outline-color: var(--tmp-75);
	~~box~~-~~shadow~~: ~~0 2px 0 rgba~~(~~0,0,0,.12~~);
	}		}
			.portalbox-image {
	.portalbox-~~role~~ {
	display: flex;		display: flex;
	~~flex~~-~~direction~~: ~~column~~;		align-items: center;
	justify-content: center;		justify-content: center;
	~~text-align: center;~~		width: 64px;
	width: ~~128px;~~		height: 64px;
	~~gap: 0.5rem;~~
	~~padding: 0.5rem 0;~~
	~~background-color: var(--tmp-10);~~
	~~border-right: 1px solid var(--tmp-25)~~;
	~~box-shadow~~: ~~0 3px 0 -1px var(--tmp-25)~~;
	}		}
			.portalbox-image img,
	.portalbox-image a {		.portalbox-image .mw-file-element {
	~~transition~~-~~property~~: ~~filter~~;		max-width: 64px !important;
	~~transition~~-~~duration~~: ~~0.15s~~;		max-height: 64px !important;
			width: auto !important;
			height: auto !important;
			object-fit: contain !important;
			image-rendering: pixelated;
	}		}

	~~.portalbox:active .portalbox-image a {~~

	~~transition-duration: 0s;~~
	}

	.portalbox-name {		.portalbox-name {
	hyphens: auto;		hyphens: auto;
	font-weight: bold;		font-weight: bold;
	line-height: ~~1rem~~;		font-size: 0.8rem;
	padding: 0 0.~~25rem~~;		line-height: 1.05rem;
			padding: 0 0.2rem;
			text-align: center;
	}		}

	.portalbox-name a {		.portalbox-name a {
	color: ~~#1a1a1a~~;		color: inherit;
	}		}

	.portalbox-name a:before {		.portalbox-name a:before {
	content: '';		content: '';
	position: absolute;		position: absolute;
	top:0;right:0;bottom:0;left:0;		top: 0; right: 0; bottom: 0; left: 0;
	}

	~~.portalbox-desc {~~
	~~flex: 1;~~
	~~line-height: 1.1rem;~~
	~~padding: 0.5rem;~~
	}

	~~.portalbox-desc a {~~
	~~position: relative;~~
	~~z-index: 2;~~
	}

	~~/* Rainbow */~~

	~~.portalbox.rgb .portalbox-wrapper {~~
	~~margin: 1px;~~
	~~background-color: #666666;~~
	}

	~~.portalbox.rgb .portalbox-role {~~
	~~background-color: #666666;~~
	~~border-right: 1px solid #c9d4e4;~~
	~~box-shadow: 0 3px 0 -1px var(--color-primal);~~
	}

	~~.portalbox.rgb .rainbow {~~

	}

	~~.portalbox.rgb:hover .rainbow {~~

	}

	~~.portalbox-image img,~~
	~~.portalbox-image .mw-file-element {~~
	~~max-width: 64px !important;~~
	~~max-height: 64px !important;~~
	~~width: auto !important;~~
	~~height: auto !important;~~
	~~object-fit: contain !important;~~
	~~image-rendering: pixelated~~;
	}		}

Admin: import TemplateStyles CSS

2026-08-06T20:04:22Z

import TemplateStyles CSS

← Предыдущая версия		Версия от 20:04, 6 августа 2026
Строка 93:		Строка 93:
	.portalbox.rgb:hover .rainbow {		.portalbox.rgb:hover .rainbow {

			}

			.portalbox-image img,
			.portalbox-image .mw-file-element {
			max-width: 64px !important;
			max-height: 64px !important;
			width: auto !important;
			height: auto !important;
			object-fit: contain !important;
			image-rendering: pixelated;
	}		}

Admin: import TemplateStyles CSS

2026-08-02T17:13:55Z

import TemplateStyles CSS

← Предыдущая версия		Версия от 17:13, 2 августа 2026
Строка 60:		Строка 60:
	content: '';		content: '';
	position: absolute;		position: absolute;
	~~inset~~: 0;		top:0;right:0;bottom:0;left:0;
	}		}

Строка 83:		Строка 83:
	.portalbox.rgb .portalbox-role {		.portalbox.rgb .portalbox-role {
	background-color: #666666;		background-color: #666666;
	border-right: 1px solid ~~var(--color-border)~~;		border-right: 1px solid #c9d4e4;
	box-shadow: 0 3px 0 -1px var(--color-primal);		box-shadow: 0 3px 0 -1px var(--color-primal);
	}		}

Admin: import TemplateStyles CSS

2026-08-02T17:12:27Z

import TemplateStyles CSS

Новая страница

.portalbox {
position: relative;
display: flex;
border-radius: 6px;
}

.portalbox-wrapper {
overflow: hidden;
position: relative;
flex: 1;
display: flex;
background-color: var(--tmp-10);
outline: 1px solid var(--tmp-25);
border-radius: 8px;
box-shadow: 0 2px 0 rgba(0,0,0,.12);
transition-property: box-shadow;
transition-duration: 0.15s;
z-index: 1;
}

.portalbox:hover .portalbox-wrapper {
box-shadow: 0 2px 0 rgba(0,0,0,.12);
}

.portalbox-role {
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
width: 128px;
gap: 0.5rem;
padding: 0.5rem 0;
background-color: var(--tmp-10);
border-right: 1px solid var(--tmp-25);
box-shadow: 0 3px 0 -1px var(--tmp-25);
}

.portalbox-image a {
transition-property: filter;
transition-duration: 0.15s;
}

.portalbox:active .portalbox-image a {

transition-duration: 0s;
}

.portalbox-name {
hyphens: auto;
font-weight: bold;
line-height: 1rem;
padding: 0 0.25rem;
}

.portalbox-name a {
color: #1a1a1a;
}

.portalbox-name a:before {
content: '';
position: absolute;
inset: 0;
}

.portalbox-desc {
flex: 1;
line-height: 1.1rem;
padding: 0.5rem;
}

.portalbox-desc a {
position: relative;
z-index: 2;
}

/* Rainbow */

.portalbox.rgb .portalbox-wrapper {
margin: 1px;
background-color: #666666;
}

.portalbox.rgb .portalbox-role {
background-color: #666666;
border-right: 1px solid var(--color-border);
box-shadow: 0 3px 0 -1px var(--color-primal);
}

.portalbox.rgb .rainbow {

}

.portalbox.rgb:hover .rainbow {

}