Some css tweaks

This commit is contained in:
JC Brand 2017-02-28 07:32:00 +00:00
parent c7de70052c
commit 0e3a979548
8 changed files with 34 additions and 15 deletions

View File

@ -32,7 +32,7 @@
box-shadow: none; } box-shadow: none; }
#converse-embedded-chat .chatbox .chat-title { #converse-embedded-chat .chatbox .chat-title {
padding: 0.3em; padding: 0.3em;
font-size: 150%; } font-size: 120%; }
#converse-embedded-chat .chatbox-btn { #converse-embedded-chat .chatbox-btn {
display: none; } display: none; }
#converse-embedded-chat .chatroom .box-flyout { #converse-embedded-chat .chatroom .box-flyout {
@ -43,7 +43,7 @@
height: -webkit-calc(100% - 55px); height: -webkit-calc(100% - 55px);
height: calc(100% - 55px); } height: calc(100% - 55px); }
#converse-embedded-chat .chatroom .box-flyout .occupants-heading { #converse-embedded-chat .chatroom .box-flyout .occupants-heading {
font-size: 150%; } font-size: 120%; }
#converse-embedded-chat .chatroom .box-flyout .chat-content { #converse-embedded-chat .chatroom .box-flyout .chat-content {
height: calc(100% - 97px); } height: calc(100% - 97px); }
#converse-embedded-chat .chatroom .box-flyout .chat-content .chat-message { #converse-embedded-chat .chatroom .box-flyout .chat-content .chat-message {

View File

@ -1334,7 +1334,8 @@
color: #818479; } color: #818479; }
#converse-embedded-chat form.pure-form.converse-form label, #converse-embedded-chat form.pure-form.converse-form label,
#conversejs form.pure-form.converse-form label { #conversejs form.pure-form.converse-form label {
margin-top: 1em; } margin-top: 1em;
font-size: 16px; }
#converse-embedded-chat form.pure-form.converse-form input[type=text], #converse-embedded-chat form.pure-form.converse-form input[type=text],
#converse-embedded-chat form.pure-form.converse-form input[type=password], #converse-embedded-chat form.pure-form.converse-form input[type=password],
#converse-embedded-chat form.pure-form.converse-form input[type=number], #converse-embedded-chat form.pure-form.converse-form input[type=number],
@ -1345,7 +1346,6 @@
#conversejs form.pure-form.converse-form input[type=number], #conversejs form.pure-form.converse-form input[type=number],
#conversejs form.pure-form.converse-form input[type=button], #conversejs form.pure-form.converse-form input[type=button],
#conversejs form.pure-form.converse-form input[type=submit] { #conversejs form.pure-form.converse-form input[type=submit] {
height: 2.2em;
padding: 0.5em; } padding: 0.5em; }
#converse-embedded-chat form.pure-form.converse-form input[type=button], #converse-embedded-chat form.pure-form.converse-form input[type=button],
#converse-embedded-chat form.pure-form.converse-form input[type=submit], #converse-embedded-chat form.pure-form.converse-form input[type=submit],
@ -1353,7 +1353,8 @@
#conversejs form.pure-form.converse-form input[type=submit] { #conversejs form.pure-form.converse-form input[type=submit] {
padding-left: 1em; padding-left: 1em;
padding-right: 1em; padding-right: 1em;
margin-right: 1em; } margin: 0.5em 0;
border: none; }
#converse-embedded-chat form.pure-form.converse-form input.error, #converse-embedded-chat form.pure-form.converse-form input.error,
#conversejs form.pure-form.converse-form input.error { #conversejs form.pure-form.converse-form input.error {
border: 1px solid red; border: 1px solid red;
@ -1891,7 +1892,7 @@
color: #818479; color: #818479;
display: block; display: block;
overflow: hidden; overflow: hidden;
padding: 0.4em; padding: 0.1em;
text-shadow: 0 1px 0 #FAFAFA; text-shadow: 0 1px 0 #FAFAFA;
word-wrap: break-word; } word-wrap: break-word; }
#conversejs #controlbox #chatrooms dl.rooms-list dd.available-chatroom:hover { #conversejs #controlbox #chatrooms dl.rooms-list dd.available-chatroom:hover {
@ -2378,7 +2379,7 @@
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-online, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-chat, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-online, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-chat,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-online, #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-online,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-chat { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-chat {
background-color: green; } background-color: #1A9707; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-dnd, #converse-embedded-chat .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-dnd,
#conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-dnd { #conversejs .chatroom .box-flyout .chatroom-body .occupants ul li.occupant .occupant-status.occupant-dnd {
background-color: red; } background-color: red; }
@ -2414,6 +2415,11 @@
#conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container .chatroom-form label, #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container .chatroom-form label,
#conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container .chatroom-form input[type=text] { #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container .chatroom-form input[type=text] {
display: block; } display: block; }
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=button],
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=submit],
#conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=button],
#conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=submit] {
margin: 0 0.5em; }
#converse-embedded-chat .chatroom .chat-textarea, #converse-embedded-chat .chatroom .chat-textarea,
#conversejs .chatroom .chat-textarea { #conversejs .chatroom .chat-textarea {
border-bottom-right-radius: 0; } border-bottom-right-radius: 0; }
@ -2484,7 +2490,11 @@
#conversejs #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom a.room-info { #conversejs #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom a.room-info {
clear: none; } clear: none; }
#conversejs #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom a.open-room { #conversejs #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom a.open-room {
width: 75%; } width: 75%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 0.5em; }
#conversejs #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom .remove-bookmark { #conversejs #controlbox #chatrooms .bookmarks-list dl.rooms-list.bookmarks dd.available-chatroom .remove-bookmark {
float: right; } float: right; }

View File

@ -18,7 +18,7 @@
<noscript><p><img src="//stats.opkode.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript> <noscript><p><img src="//stats.opkode.com/piwik.php?idsite=1" style="border:0;" alt="" /></p></noscript>
<![if gte IE 9]> <![if gte IE 9]>
<script src="../node_modules/requirejs/require.js"></script> <script src="../node_modules/requirejs/require.js"></script>
<script src="../config.js"></script> <script src="../src/config.js"></script>
<![endif]> <![endif]>
</head> </head>

View File

@ -18,6 +18,10 @@
} }
&.open-room { &.open-room {
width: 75%; width: 75%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-right: 0.5em;
} }
} }
.remove-bookmark { .remove-bookmark {

View File

@ -146,7 +146,7 @@
height: 0.5em; height: 0.5em;
&.occupant-online, &.occupant-online,
&.occupant-chat { &.occupant-chat {
background-color: green; background-color: #1A9707;
} }
&.occupant-dnd { &.occupant-dnd {
background-color: red; background-color: red;
@ -188,6 +188,10 @@
display: block; display: block;
} }
} }
input[type=button],
input[type=submit] {
margin: 0 0.5em;
}
} }
} }
} }

View File

@ -132,7 +132,7 @@
color: $text-color; color: $text-color;
display: block; display: block;
overflow: hidden; overflow: hidden;
padding: 0.4em; padding: 0.1em;
text-shadow: 0 1px 0 $text-shadow-color; text-shadow: 0 1px 0 $text-shadow-color;
word-wrap: break-word; word-wrap: break-word;
&:hover { &:hover {

View File

@ -171,20 +171,21 @@
} }
label { label {
margin-top: 1em; margin-top: 1em;
font-size: $font-size-large;
} }
input[type=text], input[type=text],
input[type=password], input[type=password],
input[type=number], input[type=number],
input[type=button], input[type=button],
input[type=submit] { input[type=submit] {
height: 2.2em;
padding: 0.5em; padding: 0.5em;
} }
input[type=button], input[type=button],
input[type=submit] { input[type=submit] {
padding-left: 1em; padding-left: 1em;
padding-right: 1em; padding-right: 1em;
margin-right: 1em; margin: 0.5em 0;
border: none;
} }
input.error { input.error {
border: 1px solid red; border: 1px solid red;

View File

@ -36,7 +36,7 @@
} }
.chat-title { .chat-title {
padding: 0.3em; padding: 0.3em;
font-size: 150%; font-size: 120%;
} }
} }
.chatbox-btn { .chatbox-btn {
@ -51,7 +51,7 @@
@include calc(height, '100% - #{$chat-head-height}'); @include calc(height, '100% - #{$chat-head-height}');
} }
.occupants-heading { .occupants-heading {
font-size: 150%; font-size: 120%;
} }
.chat-content { .chat-content {
height: calc(100% - #{$toolbar-height + $chat-textarea-height +2px}); height: calc(100% - #{$toolbar-height + $chat-textarea-height +2px});