Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
24
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

Some tweaking of the css.

Browse Source 
Make the text part of an input-group a bit wider and other padding/margin
tweaking.
This commit is contained in:
JC Brand 2015-05-01 18:43:56 +02:00
parent 6088eaf9dc
commit 2e297a1c84
3 changed files with 140 additions and 146 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

135
css/converse.css
View File

@ -523,17 +523,6 @@
color: red; } color: red; }
#conversejs input.error { #conversejs input.error {
border: 1px solid red; } border: 1px solid red; }
#conversejs #converse-register .form-errors {
color: red;
display: none; }
#conversejs #converse-register .provider-title {
font-size: 115%; }
#conversejs #converse-register .provider-score {
width: 178px;
margin-bottom: 8px; }
#conversejs #converse-register .form-help .url {
font-weight: bold;
color: #436F64; }
#conversejs .reg-feedback { #conversejs .reg-feedback {
font-size: 85%; } font-size: 85%; }
#conversejs .reg-feedback, #conversejs .reg-feedback,
@ -589,7 +578,7 @@
padding-left: 2em; padding-left: 2em;
font-weight: bold; } font-weight: bold; }
#conversejs dl.add-converse-contact { #conversejs dl.add-converse-contact {
margin: 0 0.5em 0.5em 0.5em; } margin: 0 0.5em 0.75em 0.5em; }
#conversejs .fancy-dropdown { #conversejs .fancy-dropdown {
border: 1px solid #F1DCD6; border: 1px solid #F1DCD6;
height: 25px; height: 25px;
@ -931,56 +920,79 @@
height: -webkit-calc(100% - 44px); height: -webkit-calc(100% - 44px);
height: calc(100% - 44px); } height: calc(100% - 44px); }
#conversejs .controlbox-pane { #conversejs .controlbox-pane {
padding: 5px 0; overflow-y: hidden;
overflow-y: hidden; } overflow-x: hidden; }
#conversejs .controlbox-pane dd { #conversejs .controlbox-pane dd {
margin-left: 0; margin-left: 0;
margin-bottom: 0; } margin-bottom: 0; }
#conversejs .controlbox-pane dd.odd { #conversejs .controlbox-pane dd.odd {
background-color: #DCEAC5; } background-color: #DCEAC5; }
#conversejs #converse-register .title { #conversejs #converse-register {
font-weight: bold; } background: white; }
#conversejs #converse-register .info { #conversejs #converse-register .title {
font-style: italic; font-weight: bold; }
color: green; #conversejs #converse-register .info {
font-size: 85%; font-style: italic;
margin: 5px 0; } color: green;
#conversejs .form-help, font-size: 85%;
#conversejs #converse-register .instructions { margin: 5px 0; }
color: gray; #conversejs #converse-register .form-errors {
font-size: 85%; } color: red;
#conversejs .form-help:hover, display: none; }
#conversejs #converse-register .instructions:hover { #conversejs #converse-register .provider-title {
color: #6C4C44; } font-size: 22px; }
#conversejs #converse-register .provider-score {
width: 178px;
margin-bottom: 8px; }
#conversejs #converse-register .form-help .url {
font-weight: bold;
color: #436F64; }
#conversejs #converse-register .input-group {
display: table;
margin: auto;
width: 100%; }
#conversejs #converse-register .input-group span {
overflow-x: hidden;
text-overflow: ellipsis;
max-width: 110px; }
#conversejs #converse-register .input-group span, #conversejs #converse-register .input-group input[name=username] {
display: table-cell;
text-align: left; }
#conversejs #converse-register .instructions {
color: gray;
font-size: 85%; }
#conversejs #converse-register .instructions:hover {
color: #6C4C44; }
#conversejs #converse-register, #conversejs #converse-login {
margin: 2em 1em 1em 1em;
background: white; }
#conversejs #converse-register .login-submit, #conversejs #converse-register .submit, #conversejs #converse-login .login-submit, #conversejs #converse-login .submit {
height: 30px;
padding: 0px;
font-size: 14px; }
#conversejs #converse-register .submit, #conversejs #converse-login .submit {
margin: 1em 0; }
#conversejs #converse-register .login-anon, #conversejs #converse-login .login-anon {
height: auto;
white-space: normal; }
#conversejs #converse-register .cancel-submit, #conversejs #converse-register .save-submit, #conversejs #converse-login .cancel-submit, #conversejs #converse-login .save-submit {
width: 45%;
margin: 5px 3px 5px 3px; }
#conversejs #converse-register .cancel, #conversejs #converse-register .cancel-submit, #conversejs #converse-login .cancel, #conversejs #converse-login .cancel-submit {
color: #681F2C; }
#conversejs #converse-register .save-submit, #conversejs #converse-login .save-submit {
color: #436F64; }
#conversejs #converse-register input, #conversejs #converse-login input {
width: 100%;
height: 30px;
margin: 5px 0 10px 0;
padding-left: 0.5em; }
#conversejs .form-help { #conversejs .form-help {
color: gray;
font-size: 85%;
padding-top: 5px; } padding-top: 5px; }
#conversejs #converse-register, #conversejs .form-help:hover {
#conversejs #converse-login { color: #6C4C44; }
background: white;
padding: 1em; }
#conversejs #converse-register input,
#conversejs #converse-login input {
width: 100%;
height: 30px;
margin: 5px 0 10px 0;
padding-left: 0.5em; }
#conversejs #converse-register .input-group {
table-layout: fixed;
display: table;
margin: auto;
width: 178px; }
#conversejs #converse-register .input-group span {
overflow-x: hidden;
text-overflow: ellipsis; }
#conversejs #converse-register .input-group span, #conversejs #converse-register .input-group input[name=username] {
display: table-cell; }
#conversejs .cancel-submit, #conversejs .save-submit {
width: 45%;
margin: 5px 3px 5px 3px; }
#conversejs .cancel, #conversejs .cancel-submit {
color: #681F2C; }
#conversejs .save-submit {
color: #436F64; }
#conversejs .chatroom-form label, #conversejs .chatroom-form label,
#conversejs .controlbox-pane label, #conversejs .controlbox-pane label,
#conversejs #converse-register label, #conversejs #converse-register label,
@ -989,15 +1001,6 @@
font-weight: bold; font-weight: bold;
height: auto; height: auto;
margin: 4px; } margin: 4px; }
#conversejs #converse-register .login-submit, #conversejs #converse-register .submit, #conversejs #converse-login .login-submit, #conversejs #converse-login .submit {
height: 30px;
padding: 0px;
font-size: 14px; }
#conversejs #converse-register .submit, #conversejs #converse-login .submit {
margin: 1em 0; }
#conversejs #converse-register .login-anon, #conversejs #converse-login .login-anon {
height: auto;
white-space: normal; }
#conversejs form.add-chatroom { #conversejs form.add-chatroom {
background: none; background: none;
padding: 0.5em; } padding: 0.5em; }

2
css/converse.css.map
View File

File diff suppressed because one or more lines are too long

149
sass/converse.scss
View File

@ -525,24 +525,6 @@
border: 1px solid red; border: 1px solid red;
} }
#converse-register {
.form-errors {
color: red;
display: none;
}
.provider-title {
font-size: 115%;
}
.provider-score {
width: 178px;
margin-bottom: 8px;
}
.form-help .url {
font-weight: bold;
color: $link-color;
}
}
.reg-feedback { .reg-feedback {
font-size: 85%; font-size: 85%;
} }
@ -620,7 +602,7 @@
} }
dl.add-converse-contact { dl.add-converse-contact {
margin: 0 0.5em 0.5em 0.5em; margin: 0 0.5em 0.75em 0.5em;
} }
.fancy-dropdown { .fancy-dropdown {
@ -1081,18 +1063,19 @@
} }
.controlbox-pane { .controlbox-pane {
padding: 5px 0;
overflow-y: hidden; overflow-y: hidden;
overflow-x: hidden;
dd { dd {
margin-left: 0; margin-left: 0;
margin-bottom: 0; margin-bottom: 0;
} &.odd {
dd.odd { background-color: #DCEAC5;
background-color: #DCEAC5; }
} }
} }
#converse-register { #converse-register {
background: white;
.title { .title {
font-weight: bold; font-weight: bold;
} }
@ -1102,75 +1085,48 @@
font-size: 85%; font-size: 85%;
margin: 5px 0; margin: 5px 0;
} }
} .form-errors {
color: red;
.form-help, display: none;
#converse-register .instructions { }
color: gray; .provider-title {
font-size: 85%; font-size: 22px;
} }
.provider-score {
.form-help:hover, width: 178px;
#converse-register .instructions:hover { margin-bottom: 8px;
color: $text-color; }
} .form-help .url {
font-weight: bold;
.form-help { color: $link-color;
padding-top: 5px; }
}
#converse-register,
#converse-login {
background: white;
padding: 1em;
}
#converse-register input,
#converse-login input {
width: 100%;
height: 30px;
margin: 5px 0 10px 0;
padding-left: 0.5em;
}
#converse-register {
.input-group { .input-group {
table-layout: fixed;
display: table; display: table;
margin: auto; margin: auto;
width: 178px; width: 100%;
span { span {
overflow-x: hidden; overflow-x: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
max-width: 110px;
} }
span, input[name=username] { span, input[name=username] {
display: table-cell; display: table-cell;
text-align: left;
}
}
.instructions {
color: gray;
font-size: 85%;
&:hover {
color: $text-color;
} }
} }
} }
.cancel-submit, .save-submit {
width: 45%;
margin: 5px 3px 5px 3px;
}
.cancel, .cancel-submit {
color: $warning-color;
}
.save-submit {
color: $save-button-color;
}
.chatroom-form label,
.controlbox-pane label,
#converse-register label,
#converse-login label {
font-size: $font-size;
font-weight: bold;
height: auto;
margin: 4px;
}
#converse-register, #converse-login { #converse-register, #converse-login {
margin: 2em 1em 1em 1em;
background: white;
.login-submit, .submit { .login-submit, .submit {
height: 30px; height: 30px;
padding: 0px; padding: 0px;
@ -1183,6 +1139,41 @@
height: auto; height: auto;
white-space: normal; white-space: normal;
} }
.cancel-submit, .save-submit {
width: 45%;
margin: 5px 3px 5px 3px;
}
.cancel, .cancel-submit {
color: $warning-color;
}
.save-submit {
color: $save-button-color;
}
input {
width: 100%;
height: 30px;
margin: 5px 0 10px 0;
padding-left: 0.5em;
}
}
.form-help {
color: gray;
font-size: 85%;
padding-top: 5px;
&:hover {
color: $text-color;
}
}
.chatroom-form label,
.controlbox-pane label,
#converse-register label,
#converse-login label {
font-size: $font-size;
font-weight: bold;
height: auto;
margin: 4px;
} }
form.add-chatroom { form.add-chatroom {
@ -1492,7 +1483,7 @@
.set-xmpp-status { .set-xmpp-status {
background: none; background: none;
padding: 0.5em; padding: 0.75em 0.5em 0.5em 0.5em;
.dropdown dd ul { .dropdown dd ul {
z-index: 22; z-index: 22;
} }