scss: use gradient instead border to generate OR separator line (#54416)
This commit is contained in:
parent
d83c3f874e
commit
4588675bb9
|
@ -103,7 +103,6 @@ div#login-methods input {
|
|||
#registration-blocks .a2-block:not(:first-child),
|
||||
#login-page .block:not(:first-child) {
|
||||
position: relative;
|
||||
border-left: 1px solid #999;
|
||||
padding-left: 2rem;
|
||||
border-radius: 0;
|
||||
overflow: visible;
|
||||
|
@ -114,16 +113,29 @@ div#login-methods input {
|
|||
left: -1.5rem;
|
||||
width: 3rem;
|
||||
text-align: center;
|
||||
background: white;
|
||||
top: 1rem;
|
||||
height: 3rem;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
line-height: 3rem;
|
||||
padding-top: 1rem;
|
||||
background-image:
|
||||
linear-gradient(black, black),
|
||||
linear-gradient(black, black);
|
||||
background-size: 1px 1rem, 1px 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center 0, center 4rem;
|
||||
}
|
||||
@media screen and ($max-mobile-viewport) {
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
margin-top: 3rem;
|
||||
&::after {
|
||||
content: none;
|
||||
padding-top: 0;
|
||||
left: 0;
|
||||
top: -3rem;
|
||||
height: 3rem;
|
||||
width: 100%;
|
||||
background-size: calc(50% - 2rem) 1px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: right, left;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue