feat(escolinha): nova tela de login
This commit is contained in:
@@ -53,7 +53,20 @@ data:
|
||||
}
|
||||
a{color:inherit}
|
||||
|
||||
.stage{display:grid;grid-template-columns:56% 44%;min-height:100vh}
|
||||
.stage{position:relative;display:grid;grid-template-columns:56% 44%;min-height:100vh}
|
||||
|
||||
/* Faixa pontilhada na costura: a foto nao vira branco liso, ela se desfaz
|
||||
em pontos. Fica sobre as duas colunas, por isso pende de .stage e nao de
|
||||
uma delas. As mascaras apagam as pontas para a faixa nao ter borda. */
|
||||
.costura{
|
||||
position:absolute;top:0;bottom:0;left:48%;
|
||||
width:230px;transform:translateX(-50%);
|
||||
pointer-events:none;z-index:1;opacity:.9;
|
||||
background-image:radial-gradient(circle, var(--orange) 1.6px, transparent 1.6px);
|
||||
background-size:9px 9px;
|
||||
-webkit-mask-image:linear-gradient(90deg, transparent 0, #000 45%, #000 60%, transparent 100%);
|
||||
mask-image:linear-gradient(90deg, transparent 0, #000 45%, #000 60%, transparent 100%);
|
||||
}
|
||||
|
||||
/* ---------- Foto (esquerda) ---------- */
|
||||
.foto{
|
||||
@@ -179,6 +192,14 @@ data:
|
||||
}
|
||||
.painel{padding:32px 22px 44px;align-items:flex-start}
|
||||
.pontos{display:none}
|
||||
/* Na vertical a costura e horizontal: a faixa acompanha a borda da foto. */
|
||||
.costura{
|
||||
top:auto;bottom:auto;left:0;right:0;width:auto;
|
||||
height:110px;transform:none;
|
||||
margin-top:135px;
|
||||
-webkit-mask-image:linear-gradient(180deg, transparent 0, #000 40%, transparent 100%);
|
||||
mask-image:linear-gradient(180deg, transparent 0, #000 40%, transparent 100%);
|
||||
}
|
||||
.marca{margin-bottom:26px}
|
||||
}
|
||||
</style>
|
||||
@@ -186,6 +207,7 @@ data:
|
||||
<body>
|
||||
<div class="stage">
|
||||
<div class="foto" role="img" aria-label="Crianças jogando futebol"></div>
|
||||
<span class="costura" aria-hidden="true"></span>
|
||||
|
||||
<main class="painel">
|
||||
<span class="pontos topo" aria-hidden="true"></span>
|
||||
|
||||
Reference in New Issue
Block a user