mirror of
https://github.com/zitadel/zitadel.git
synced 2025-10-27 09:49:38 +00:00
fix: improvements for login and oidc (#227)
* add csrf * caching * caching * caching * caching * security headers * csp and security headers * error handler csp * select user with display name * csp * user selection styling * username to loginname * regenerate grpc * regenerate * change to login name
This commit is contained in:
Livio Amstutz
@@ -95,7 +95,7 @@ h1 {
|
||||
}
|
||||
|
||||
p {
|
||||
font-width: 300;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
@@ -151,9 +151,6 @@ button.primary {
|
||||
button.primary:hover {
|
||||
background-color: #f60075;
|
||||
}
|
||||
button > .sessionstate {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
@@ -200,6 +197,102 @@ form .actions .right {
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: white;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #595959;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
@@ -209,11 +302,11 @@ form .actions button, form .actions a {
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:white"] {
|
||||
fill: #282828 !important;
|
||||
#qrcode svg rect.color {
|
||||
fill: white;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:black"] {
|
||||
fill: white !important;
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCGW;EDFX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCDc;EDEd,OCDQ;;;ADIZ;EACI,OCLQ;EDMR,aCZS;EDaT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCnCW;EDoCX;EACA;EACA;;AAEA;EACI,OCxCY;;;AD4CpB;EACI;EACA,kBCjDc;EDkDd,OChDW;EDiDX;EACA;EACA;EACA;EACA,QE/DU;EFgEV;EACA;EACA;;AACA;EACI,kBCzDY;ED0DZ;;AAGJ;EACI,kBC/DO;EDgEP,OCjEI;EDkEJ;;AACA;EACI,kBClEQ;;ADsEhB;EACI;;;AAIR;EACI,kBE7EmB;EF8EnB,OC/EQ;EDgFR,QEzFU;EF0FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OE9GK;EF+GL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKJ;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCGW;EDFX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCDc;EDEd,OCDQ;;;ADIZ;EACI,OCLQ;EDMR,aCZS;EDaT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCnCW;EDoCX;EACA;EACA;;AAEA;EACI,OCxCY;;;AD4CpB;EACI;EACA,kBCjDc;EDkDd,OChDW;EDiDX;EACA;EACA;EACA;EACA,QE/DU;EFgEV;EACA;EACA;;AACA;EACI,kBCzDY;ED0DZ;;AAGJ;EACI,kBC/DO;EDgEP,OCjEI;EDkEJ;;AACA;EACI,kBClEQ;;;ADuEpB;EACI,kBE5DmB;EF6DnB,OC3EQ;ED4ER,QErFU;EFsFV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OE7FK;EF8FL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCnII;EDoIJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBE7HW;;AFgIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EE1JV;;AACA;EFuJM;IEtJJ;IACA;;;AF4JQ;EE/JV;;AACA;EF8JU;IE7JR;IACA;;;AFiKI;EACI;EACA;EACA;EACA;EACA,cE5JO;EF6JP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OExLP;;AF+LL;EACI;;AAEJ;EACI;EACA;EEhNV;;AACA;EF6MM;IE5MJ;IACA;;;AFkNQ;EErNV;;AACA;EFoNU;IEnNR;IACA;;;AFuNI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC1OI;;AD6OR;EACI,MC/OU;;;ADoPd;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"}
|
||||
@@ -95,7 +95,7 @@ h1 {
|
||||
}
|
||||
|
||||
p {
|
||||
font-width: 300;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
@@ -151,9 +151,6 @@ button.primary {
|
||||
button.primary:hover {
|
||||
background-color: #f60075;
|
||||
}
|
||||
button > .sessionstate {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
@@ -200,6 +197,102 @@ form .actions .right {
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: white;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #595959;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
@@ -209,11 +302,11 @@ form .actions button, form .actions a {
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:white"] {
|
||||
fill: #282828 !important;
|
||||
#qrcode svg rect.color {
|
||||
fill: white;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:black"] {
|
||||
fill: white !important;
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
@@ -282,6 +375,48 @@ html button.primary {
|
||||
html button.primary:hover {
|
||||
background-color: #f60075;
|
||||
}
|
||||
html button.clean {
|
||||
color: #282828;
|
||||
}
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.user-selection:hover {
|
||||
background-color: #252525;
|
||||
}
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html input {
|
||||
background-color: white;
|
||||
color: #282828;
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCGW;EDFX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCDc;EDEd,OCDQ;;;ADIZ;EACI,OCLQ;EDMR,aCZS;EDaT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCnCW;EDoCX;EACA;EACA;;AAEA;EACI,OCxCY;;;AD4CpB;EACI;EACA,kBCjDc;EDkDd,OChDW;EDiDX;EACA;EACA;EACA;EACA,QE/DU;EFgEV;EACA;EACA;;AACA;EACI,kBCzDY;ED0DZ;;AAGJ;EACI,kBC/DO;EDgEP,OCjEI;EDkEJ;;AACA;EACI,kBClEQ;;ADsEhB;EACI;;;AAIR;EACI,kBE7EmB;EF8EnB,OC/EQ;EDgFR,QEzFU;EF0FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OE9GK;EF+GL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKJ;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AG1MJ;EACI,kBFYQ;EEXR,OFUc;;AERd;EACI;;AAGJ;EACI,OFGU;;AEAd;EACI;EACA;EACA;;AAEA;EACI,kBFIa;EEHb;;AAGJ;EACI,kBFTG;EEUH,OFXA;EEYA;EACA;;AACA;EACI,kBFbI;;AEkBhB;EACI,kBFrBI;EEsBJ,OFvBU;;AE2BV;EACI;;AAGJ;EACI;;AAIR;EACI","file":"light.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/caos/variables.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCGW;EDFX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCDc;EDEd,OCDQ;;;ADIZ;EACI,OCLQ;EDMR,aCZS;EDaT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCnCW;EDoCX;EACA;EACA;;AAEA;EACI,OCxCY;;;AD4CpB;EACI;EACA,kBCjDc;EDkDd,OChDW;EDiDX;EACA;EACA;EACA;EACA,QE/DU;EFgEV;EACA;EACA;;AACA;EACI,kBCzDY;ED0DZ;;AAGJ;EACI,kBC/DO;EDgEP,OCjEI;EDkEJ;;AACA;EACI,kBClEQ;;;ADuEpB;EACI,kBE5DmB;EF6DnB,OC3EQ;ED4ER,QErFU;EFsFV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OE7FK;EF8FL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OCnII;EDoIJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBE7HW;;AFgIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EE1JV;;AACA;EFuJM;IEtJJ;IACA;;;AF4JQ;EE/JV;;AACA;EF8JU;IE7JR;IACA;;;AFiKI;EACI;EACA;EACA;EACA;EACA,cE5JO;EF6JP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OExLP;;AF+LL;EACI;;AAEJ;EACI;EACA;EEhNV;;AACA;EF6MM;IE5MJ;IACA;;;AFkNQ;EErNV;;AACA;EFoNU;IEnNR;IACA;;;AFuNI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MC1OI;;AD6OR;EACI,MC/OU;;;ADoPd;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AGtSJ;EACI,kBFYQ;EEXR,OFUc;;AERd;EACI;;AAGJ;EACI,OFGU;;AEAd;EACI;EACA;EACA;;AAEA;EACI,kBFIa;EEHb;;AAGJ;EACI,kBFTG;EEUH,OFXA;EEYA;EACA;;AACA;EACI,kBFbI;;AEiBZ;EACI,OFrBM;;AEyBN;EDxBV;;AACA;ECuBU;IDtBR;IACA;;;ACyBQ;EACI,kBDfO;;ACiBP;ED/Bd;;AACA;EC8Bc;ID7BZ;IACA;;;ACmCQ;EDtCV;;AACA;ECqCU;IDpCR;IACA;;;ACwCY;ED3Cd;;AACA;EC0Cc;IDzCZ;IACA;;;AC+CA;EACI,kBFnDI;EEoDJ,OFrDU;;AEyDV;EACI;;AAGJ;EACI;;AAIR;EACI","file":"light.css"}
|
||||
@@ -30,6 +30,36 @@ html {
|
||||
background-color: $primaryColorHover;
|
||||
}
|
||||
}
|
||||
|
||||
&.clean {
|
||||
color: $fontColorLight;
|
||||
}
|
||||
|
||||
&.user-selection {
|
||||
.profile-image {
|
||||
@include retina-background-image($profileImgLight, "png", false, 100px, 100px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: $buttonBackgroundColorHover;
|
||||
|
||||
.profile-image {
|
||||
@include retina-background-image($profileImgLight, "png", true, 100px, 100px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.other-user {
|
||||
.other-user-image {
|
||||
@include retina-background-image($otherUserImgLight, "png", false, 100px, 75px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.other-user-image {
|
||||
@include retina-background-image($otherUserImgLight, "png", true, 100px, 75px);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
|
||||
@@ -25,7 +25,7 @@ h1 {
|
||||
}
|
||||
|
||||
p {
|
||||
font-width: 300;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
@@ -83,10 +83,6 @@ button {
|
||||
background-color: $primaryColorHover;
|
||||
}
|
||||
}
|
||||
|
||||
& > .sessionstate {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
}
|
||||
|
||||
input:not([type='radio']), select {
|
||||
@@ -143,6 +139,102 @@ form {
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: $fontColor;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
|
||||
&:hover {
|
||||
border: none;
|
||||
background-color: $buttonBackgroundColorHover;
|
||||
}
|
||||
|
||||
* {
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
|
||||
button.user-selection {
|
||||
.profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
@include retina-background-image($profileImgDark, "png", false, 100px, 100px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.profile-image {
|
||||
@include retina-background-image($profileImgDark, "png", true, 100px, 100px);
|
||||
}
|
||||
}
|
||||
|
||||
.sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: $inputBorderColor;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
|
||||
&.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
|
||||
&.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
& > div {
|
||||
position: relative;
|
||||
|
||||
&.names {
|
||||
margin: 15px;
|
||||
|
||||
.displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
.loginname {
|
||||
color: $labelColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
button.other-user {
|
||||
.user-selection+&{
|
||||
margin-top: 80px;
|
||||
}
|
||||
.other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
@include retina-background-image($otherUserImgDark, "png", false, 100px, 75px);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.other-user-image {
|
||||
@include retina-background-image($otherUserImgDark, "png", true, 100px, 75px);
|
||||
}
|
||||
}
|
||||
|
||||
& > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
@@ -153,12 +245,12 @@ form {
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
|
||||
svg rect[style*="fill:white"] {
|
||||
fill: $backgroundColor !important;
|
||||
svg rect.color {
|
||||
fill: $fontColor;
|
||||
}
|
||||
|
||||
svg rect[style*="fill:black"] {
|
||||
fill: $fontColor !important;
|
||||
svg rect.bg-color {
|
||||
fill: $backgroundColor;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -4,7 +4,20 @@ $headerFont: Aileron;
|
||||
|
||||
// ----- LAYOUT ------------
|
||||
$inputHeight: 50px;
|
||||
$retina: "only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx)";
|
||||
|
||||
@mixin retina-background-image($file, $type, $hover, $width, $height) {
|
||||
$hovername: '';
|
||||
@if $hover {
|
||||
$hovername: '-hover';
|
||||
}
|
||||
$filename :$file + $hovername;
|
||||
background-image: url($filename + '.' + $type);
|
||||
@media #{$retina} {
|
||||
background-image: url($filename + '@2x.' + $type);
|
||||
background-size: $width $height;
|
||||
}
|
||||
}
|
||||
|
||||
// ----- DARK-THEME --------
|
||||
$backgroundColor: #282828;
|
||||
@@ -14,10 +27,16 @@ $primaryColorHover: lighten($primaryColor, 10%);
|
||||
$labelColor: #898989;
|
||||
$inputBorderColor: #595959;
|
||||
$inputBackgroundColor: #252525;
|
||||
$buttonBackgroundColorHover: $inputBackgroundColor;
|
||||
$profileImgDark: "/resources/images/icon-user-dark";
|
||||
$otherUserImgDark: "/resources/images/icon-newuser-dark";
|
||||
|
||||
|
||||
// ----- LIGHT-THEME --------
|
||||
$backgroundColorLight: $fontColor;
|
||||
$fontColorLight: $backgroundColor;
|
||||
$primaryColorLight: $primaryColor;
|
||||
$primaryColorHoverLight: lighten($primaryColorLight, 10%);
|
||||
$primaryColorHoverLight: lighten($primaryColorLight, 10%);
|
||||
$buttonBackgroundColorHoverLight: #EFEFEF;
|
||||
$profileImgLight: "/resources/images/icon-user-light";
|
||||
$otherUserImgLight: "/resources/images/icon-newuser-light";
|
||||
@@ -95,7 +95,7 @@ h1 {
|
||||
}
|
||||
|
||||
p {
|
||||
font-width: 300;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
@@ -151,9 +151,6 @@ button.primary {
|
||||
button.primary:hover {
|
||||
background-color: #6778f8;
|
||||
}
|
||||
button > .sessionstate {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
@@ -200,6 +197,102 @@ form .actions .right {
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: #FFFFFF;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #595959;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
@@ -209,11 +302,11 @@ form .actions button, form .actions a {
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:white"] {
|
||||
fill: #282828 !important;
|
||||
#qrcode svg rect.color {
|
||||
fill: #FFFFFF;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:black"] {
|
||||
fill: #FFFFFF !important;
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCLc;EDMd,OCLQ;;;ADQZ;EACI,OCTQ;EDUR,aClBS;EDmBT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCvCW;EDwCX;EACA;EACA;;AAEA;EACI,OC5CY;;;ADgDpB;EACI;EACA,kBCrDc;EDsDd,OCpDW;EDqDX;EACA;EACA;EACA;EACA,QC/DU;EDgEV;EACA;EACA;;AACA;EACI,kBC7DY;ED8DZ;;AAGJ;EACI,kBCnEO;EDoEP,OCrEI;EDsEJ;;AACA;EACI,kBCtEQ;;AD0EhB;EACI;;;AAIR;EACI,kBC7EmB;ED8EnB,OCnFQ;EDoFR,QCzFU;ED0FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OC9GK;ED+GL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKJ;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCQc;EDPd,OCQQ;;;ADLZ;EACI,OCIQ;EDHR,aClBS;EDmBT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OC1BW;ED2BX;EACA;EACA;;AAEA;EACI,OC/BY;;;ADmCpB;EACI;EACA,kBCxCc;EDyCd,OCvCW;EDwCX;EACA;EACA;EACA;EACA,QC/DU;EDgEV;EACA;EACA;;AACA;EACI,kBChDY;EDiDZ;;AAGJ;EACI,kBCtDO;EDuDP,OCxDI;EDyDJ;;AACA;EACI,kBCzDQ;;;AD8DpB;EACI,kBC5DmB;ED6DnB,OClEQ;EDmER,QCrFU;EDsFV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OC7FK;ED8FL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;EACA,OC1HI;ED2HJ;EACA;EACA;EACA;;AAEA;EACI;EACA,kBC7HW;;ADgIf;EACI;;AAIR;EACI;;AAIA;EACI;EACA;EC1JV;;AACA;EDuJM;ICtJJ;IACA;;;AD4JQ;EC/JV;;AACA;ED8JU;IC7JR;IACA;;;ADiKI;EACI;EACA;EACA;EACA;EACA,cC5JO;ED6JP;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAKR;EACI;;AAEA;EACI;;AAEA;EACI;;AAEJ;EACI,OCxLP;;AD+LL;EACI;;AAEJ;EACI;EACA;EChNV;;AACA;ED6MM;IC5MJ;IACA;;;ADkNQ;ECrNV;;AACA;EDoNU;ICnNR;IACA;;;ADuNI;EACI;EACA;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI,MCjOI;;ADoOR;EACI,MCtOU;;;AD2Od;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA","file":"dark.css"}
|
||||
@@ -95,7 +95,7 @@ h1 {
|
||||
}
|
||||
|
||||
p {
|
||||
font-width: 300;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
header {
|
||||
@@ -151,9 +151,6 @@ button.primary {
|
||||
button.primary:hover {
|
||||
background-color: #6778f8;
|
||||
}
|
||||
button > .sessionstate {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
|
||||
input:not([type=radio]), select {
|
||||
background-color: #252525;
|
||||
@@ -200,6 +197,102 @@ form .actions .right {
|
||||
form .actions button, form .actions a {
|
||||
margin: 10px 0;
|
||||
}
|
||||
form button.clean {
|
||||
border: none;
|
||||
height: auto;
|
||||
color: #FFFFFF;
|
||||
text-align: left;
|
||||
text-transform: unset;
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
}
|
||||
form button.clean:hover {
|
||||
border: none;
|
||||
background-color: #252525;
|
||||
}
|
||||
form button.clean * {
|
||||
font-weight: 300;
|
||||
}
|
||||
form .user-selection-list {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
form button.user-selection .profile-image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-image: url("/resources/images/icon-user-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-dark-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
form button.user-selection .sessionstate {
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 20px;
|
||||
border-color: #595959;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 10px;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-0 {
|
||||
background-color: #138D00;
|
||||
}
|
||||
form button.user-selection .sessionstate.sessionstate-1 {
|
||||
background-color: #BC372E;
|
||||
}
|
||||
form button.user-selection > div {
|
||||
position: relative;
|
||||
}
|
||||
form button.user-selection > div.names {
|
||||
margin: 15px;
|
||||
}
|
||||
form button.user-selection > div.names .displayname {
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
form button.user-selection > div.names .loginname {
|
||||
color: #898989;
|
||||
}
|
||||
.user-selection + form button.other-user {
|
||||
margin-top: 80px;
|
||||
}
|
||||
form button.other-user .other-user-image {
|
||||
width: 100px;
|
||||
height: 75px;
|
||||
background-image: url("/resources/images/icon-newuser-dark.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
form button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-dark-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
form button.other-user > div:nth-of-type(2) {
|
||||
margin: 15px;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
|
||||
#copy-secret {
|
||||
visibility: hidden;
|
||||
@@ -209,11 +302,11 @@ form .actions button, form .actions a {
|
||||
#qrcode {
|
||||
text-align: center;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:white"] {
|
||||
fill: #282828 !important;
|
||||
#qrcode svg rect.color {
|
||||
fill: #FFFFFF;
|
||||
}
|
||||
#qrcode svg rect[style*="fill:black"] {
|
||||
fill: #FFFFFF !important;
|
||||
#qrcode svg rect.bg-color {
|
||||
fill: #282828;
|
||||
}
|
||||
|
||||
#secret .copy {
|
||||
@@ -282,6 +375,48 @@ html button.primary {
|
||||
html button.primary:hover {
|
||||
background-color: #6778f8;
|
||||
}
|
||||
html button.clean {
|
||||
color: #282828;
|
||||
}
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.user-selection:hover {
|
||||
background-color: #252525;
|
||||
}
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.user-selection:hover .profile-image {
|
||||
background-image: url("/resources/images/icon-user-light-hover@2x.png");
|
||||
background-size: 100px 100px;
|
||||
}
|
||||
}
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover.png");
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
|
||||
html button.other-user:hover .other-user-image {
|
||||
background-image: url("/resources/images/icon-newuser-light-hover@2x.png");
|
||||
background-size: 100px 75px;
|
||||
}
|
||||
}
|
||||
html input {
|
||||
background-color: #FFFFFF;
|
||||
color: #282828;
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"AACA;EACI;EACA;;AAIJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;AAA6D;EAC7D;;AC5EJ;EACI;EACA,aCHW;EDIX;EACA;;;AAGJ;EACI;;;AAGJ;EACI,kBCLc;EDMd,OCLQ;;;ADQZ;EACI,OCTQ;EDUR,aClBS;EDmBT;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI;;AAEA;EACI;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;;;AAGJ;EACI,OCvCW;EDwCX;EACA;EACA;;AAEA;EACI,OC5CY;;;ADgDpB;EACI;EACA,kBCrDc;EDsDd,OCpDW;EDqDX;EACA;EACA;EACA;EACA,QC/DU;EDgEV;EACA;EACA;;AACA;EACI,kBC7DY;ED8DZ;;AAGJ;EACI,kBCnEO;EDoEP,OCrEI;EDsEJ;;AACA;EACI,kBCtEQ;;AD0EhB;EACI;;;AAIR;EACI,kBC7EmB;ED8EnB,OCnFQ;EDoFR,QCzFU;ED0FV;EACA;EACA;;;AAIA;EACI;EACA;;AAGJ;EACI;;AAEA;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAIR;EACI,OC9GK;ED+GL;EACA;EACA;;AAEA;EACI;EACA;;AAIR;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKZ;EACI;EACA;;;AAGJ;EACI;;AAEA;EACI;;AAGJ;EACI;;;AAKJ;EACI;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;AAAkB;EAClB;EACA;EACA;EACA;EACA;EACA;EACA;AAEA;EACA;AACA;EACA;AAEA;EACA;AAEA;EACA;;;AE1MJ;EACI,kBDQQ;ECPR,ODMc;;ACJd;EACI;;AAGJ;EACI,ODDU;;ACId;EACI,kBDJI;ECKJ,ODJO;ECKP;;AAEA;EACI,kBDGa;ECFb;;AAGJ;EACI,kBDbG;ECcH,ODfA;ECgBA;EACA;;AACA;EACI,kBDjBI;;ACsBhB;EACI,kBDzBI;EC0BJ,OD3BU;;AC+BV;EACI;;AAGJ;EACI;;AAIR;EACI","file":"light.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../../scss/fonts.scss","../../scss/main.scss","../../scss/variables.scss","../../scss/light.scss"],"names":[],"mappings":"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","file":"light.css"}
|
||||
Reference in New Issue
Block a user