Predefinição:Character/styles.css - Histórico de revisão

Gurren1: Limpou toda a página

2025-08-08T19:52:23Z

Limpou toda a página

← Edição anterior		Edição das 19h52min de 8 de agosto de 2025
Linha 1:		Linha 1:
	~~@media (min-width: 800px) and (max-width: 1610px) and (min-aspect-ratio: 3/4) and (max-aspect-ratio: 16/10) {~~
	~~.character-class { font-size: 1.15em; }~~
	~~.tab-btn {~~
	~~padding: 6px 18px;~~
	}
	~~.attribute-title, .card-skins-title {~~
	~~width: 100% !important;~~
	}
	~~.character-art {~~
	~~display: none;~~
	~~width: 360px;~~
	~~height: 267px;~~
	~~position: absolute;~~
	~~right: 0.7rem;~~
	~~top: 0.9rem;~~
	~~z-index: 9;~~
	}
	~~.tab-content {~~
	~~padding: 0 8px 20px;~~
	}
	~~.skill-details {~~
	~~flex: 1;~~
	~~display: flex;~~
	~~flex-direction: column;~~
	~~gap: 10px;~~
	~~justify-content: center;~~
	~~width: 90%;~~
	~~align-self: center;~~
	}
	~~.skills-container {~~
	~~flex-direction: column-reverse;~~
	}
	~~.skills-bar {~~
	~~display: flex;~~
	~~flex-wrap: nowrap;~~
	~~gap: 16px;~~
	~~width: 95%;~~
	~~overflow-x: auto;~~
	~~overflow-y: hidden;~~
	~~padding-bottom: 8px;~~
	~~margin-bottom: 1%;~~
	~~justify-self: center;~~
	~~justify-content: center;~~
	}
	~~.desc-box h3 {~~
	~~justify-self: center;~~
	}
	~~.skills-bar .skill-item {~~
	~~flex: 0 0 auto;~~
	~~width: 40px;~~
	~~height: 40px;~~
	~~border-radius: 5px;~~
	~~cursor: pointer;~~
	~~transition: transform 0.2s, box-shadow 0.2s;~~
	}
	~~.desc-box .desc-level {~~
	~~margin-top: 5px;~~
	~~justify-self: center;~~
	~~font-weight: bold;~~
	~~border-bottom: 2px solid #9d9c9c;~~
	}
	~~.video-box {~~
	~~width: 50%;~~
	~~display: flex;~~
	~~align-items: center;~~
	~~justify-content: center;~~
	~~background-color: #000;~~
	~~padding: 0;~~
	~~overflow: hidden;~~
	~~align-self: center;~~
	~~border-radius: 1%;~~
	}
	~~.character-container {~~
	~~width: 97%;~~
	}
	}
	~~@media (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) and (max-height: 800px) {~~
	~~.character-art {~~
	~~display: none;~~
	~~width: 371px;~~
	~~height: 265px;~~
	~~position: absolute;~~
	~~right: 0.6rem;~~
	~~top: 0.9rem;~~
	~~z-index: 9;~~
	}
	~~.card-attribute {~~
	~~width: 110px;~~
	~~height: 56px;~~
	}
	~~.skill-title {~~
	~~padding-right: unset;~~
	}
	~~.desc-box {~~
	~~min-height: 19.8rem;~~
	}
	~~.skills-bar {~~
	~~width: 100%;~~
	~~justify-content: space-between;~~
	}
	~~.tooltip-container {~~
	~~right: -10px;~~
	}
	~~.info-btn {~~
	~~font-size: 26px;~~
	~~width: 36px;~~
	~~height: 36px;~~
	}
	}
	~~@media (min-width: 1400px) and (max-width: 1800px) and (orientation: landscape) {~~
	~~.character-art {~~
	~~width: 34vw;~~
	~~height: auto;~~
	~~position: absolute;~~
	~~right: 0.0rem;~~
	}
	~~.desc-box {~~
	~~min-height: 20.3rem;~~
	}
	}

Gurren1 em 19h40min de 8 de agosto de 2025

2025-08-08T19:40:57Z

← Edição anterior		Edição das 19h40min de 8 de agosto de 2025
Linha 75:		Linha 75:
	}		}
	}		}

	@media (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) and (max-height: 800px) {		@media (min-width: 1024px) and (max-width: 1366px) and (orientation: landscape) and (max-height: 800px) {
	.character-art {		.character-art {
Linha 109:		Linha 108:
	}		}
	}		}

	@media (min-width: 1400px) and (max-width: 1800px) and (orientation: landscape) {		@media (min-width: 1400px) and (max-width: 1800px) and (orientation: landscape) {
	.character-art {		.character-art {

Gurren1 em 19h33min de 8 de agosto de 2025

2025-08-08T19:33:57Z

Mostrar alterações

Gurren1: Criou página com '/* === Character Widget Styles === */ .character-container { max-width: 900px; margin: 1em auto; font-family: 'Noto Sans', sans-serif; color: #fff; } .character-header...'

2025-08-08T19:24:27Z

Criou página com '=== Character Widget Styles ===: .character-container { max-width: 900px; margin: 1em auto; font-family: 'Noto Sans', sans-serif; color: #fff; } .character-header...'

Página nova

/* === Character Widget Styles === */
.character-container {
max-width: 900px;
margin: 1em auto;
font-family: 'Noto Sans', sans-serif;
color: #fff;
}
.character-header {
text-align: center;
position: relative;
padding-bottom: 1em;
}
.character-name {
font-size: 2.5em;
font-weight: 900;
margin: 0.2em 0;
}
.character-tier,
.character-classes {
font-size: 1.1em;
color: #bbb;
margin: 0.3em 0;
}
.character-image {
display: block;
margin: 0.5em auto;
max-width: 100%;
height: auto;
}

.character-tabs {
display: flex;
gap: 12px;
justify-content: center;
margin: 1em 0;
}
.tab-btn {
padding: 6px 20px;
background: #333;
color: white;
border: none;
border-radius: 8px;
font-size: 1.2em;
cursor: pointer;
transition: background 0.2s;
}
.tab-btn.active {
background: #156bc7;
font-weight: bold;
}

/* —— Aqui trocamos o hex RGBA “#26211cd6” por rgba() puro —— */
.tab-content {
display: none;
background: rgba(38,33,28,0.84);
padding: 1em;
border-radius: 8px;
}
.tab-content.active {
display: block;
}

/* Scrollbars avançadas NÃO suportadas em styles.css — vamos mover isso para o widget */
.skills-bar {
display: flex;
flex-wrap: nowrap;
gap: 10px;
overflow-x: auto;
padding-bottom: 1em;
/* scrollbar-width, scrollbar-color e ::-webkit-scrollbar removidos */
}

.skill-item {
flex: 0 0 auto;
width: 60px;
height: 60px;
border-radius: 6px;
overflow: hidden;
cursor: pointer;
transition: transform 0.2s, box-shadow 0.2s;
border: 2px solid transparent;
}
.skill-item.active {
transform: scale(1.1);
border-color: #44f;
box-shadow: 0 0 8px rgba(68,143,255,0.7);
}

.skill-details {
display: flex;
flex-wrap: wrap;
gap: 1em;
margin-top: 1em;
}
.skill-details .desc-box,
.skill-details .video-box {
flex: 1;
min-width: 200px;
background: #1f1f1f;
padding: 0.8em;
border-radius: 6px;
box-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.skill-details .desc-box h3 {
margin-top: 0;
font-size: 1.5em;
}
.skill-details .attrs {
margin: 0.5em 0;
}
.skill-details .attrs span {
display: inline-block;
margin-right: 1em;
font-weight: bold;
}
.skill-details .video-box video {
width: 100%;
height: auto;
border-radius: 4px;
}

@media (max-width: 768px) {
.character-name { font-size: 2em; }
.tab-btn { font-size: 1em; padding: 4px 12px; }
.skill-details { flex-direction: column; }
}