ic-auth
Version:
A simple to use, modular package for integrating Internet Computer authentication providers into your app.
116 lines (102 loc) • 1.99 kB
CSS
@import url('https://fonts.googleapis.com/css?family=Montserrat');
html {
background-color: #000;
}
.app {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.header {
position: absolute;
top: 0;
left: 0;
height: 70px;
width: 100%;
background-color: #202020;
/* display: flex; */
display: none;
flex-direction: row;
justify-content: center;
align-items: center;
color: #ffcf40;
font-size: 18px;
}
.content {
margin-top: 150px;
height: auto;
width: 220px;
display: flex;
flex-direction: column;
align-items: center;
padding: 15px;
font-size: 18px;
color: #f5f5f7;
background-color: #161616;
border: 2px solid #4a453f;
border-radius: 14px;
font-family: 'Montserrat';
}
.content h3 {
margin: 10px;
}
button {
background: none;
border: 1px solid #12fff9;
border-radius: 12px;
width: 180px;
height: 46px;
font-size: 14px;
font-weight: bold;
letter-spacing: 0.8px;
text-align: center;
padding: 8px 12px;
color: lightgoldenrodyellow;
cursor: pointer;
display: flex;
flex-direction: row;
align-items: center;
font-family: 'Montserrat';
}
button p {
width: 80%;
}
button:hover {
background-color: rgba(255,255,255,0.1);
transform: scale(1.05);
}
button:disabled {
background: none;
border: 1px solid rgba(20, 255, 247, 0.5);
transform: none;
cursor: default;
}
button img {
width: 24px;
height: 24px;
}
.statusBubble {
height: 10px;
width: 10px;
background-color: #fc609d;
border: 1px solid black;
border-radius: 360px;
margin-left: 6px;
}
.content h5 {
margin-bottom: 10px;
margin-top: 10px;
}
.data {
width: 100%;
text-align: center;
color: lime;
font-size: 12px;
margin-top: 0;
margin-bottom: 5px;;
}
.walletContainer {
margin: 10px;
margin-top: 15px;
}