Skip to content

Instantly share code, notes, and snippets.

@Xe
Forked from acous/dark-compact.css
Last active September 17, 2015 22:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Xe/22c76672d1ce8c3a9063 to your computer and use it in GitHub Desktop.
Save Xe/22c76672d1ce8c3a9063 to your computer and use it in GitHub Desktop.
early dark theme for Shout irc
body {
background: #333;
color: #CCC;
font: 16px Lato, sans-serif;
margin: 0;
}
#main {
background: #222;
border-radius: 0px;
bottom: 0px;
left: 180px;
overflow: hidden;
position: absolute;
right: 0px;
top: 0px;
}
#sidebar {
width: 180px;
}
#sidebar .networks {
min-height: 100%;
padding: 8px 16px 40px;
}
#sidebar .chan {
display: block;
margin: 1px -10px;
padding: 3px 10px;
position: relative;
text-align: left;
transition: all .2s;
width: 170px;
color: #CCC;
}
#sidebar .chan:first-child {
color: #777;
font-size: 11px;
margin-top: 4px;
text-transform: uppercase;
font-weight: bold;
}
#sidebar .chan:before,
#chat .title:before {
display: none;
}
#windows {
bottom: 32px;
position: absolute;
top: 0px;
width: 100%;
}
#windows .chan,
#windows .window {
background: #222;
bottom: 0;
//display: none;
left: 0;
position: absolute;
right: 0;
top: 0;
}
#chat .chat{
top: 32px;
}
#chat .header {
border-bottom: 1px solid #555;
line-height: 32px;
height: 32px;
padding: 0 10px;
}
#chat .header .title {
font: 13px Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
}
#chat .sidebar {
top: 0;
}
#chat .count {
background: none;
border-bottom: 1px solid #555;
height: 32px;
left: 0;
position: absolute;
right: 0;
top: 0;
color: #777;
}
#chat .count:before {
color: #666;
font: 14px FontAwesome;
content: "\f002";
position: absolute;
right: 18px;
line-height: 32px;
transition: color .2s;
z-index: 0;
}
#chat .search {
color: #666;
border: 0;
background: none;
font: inherit;
outline: 0;
padding: 8px 16px;
position: relative;
width: 100%;
}
#chat .chat {
bottom: 0;
left: 0;
overflow: auto;
-webkit-overflow-scrolling: touch;
position: absolute;
right: 180px;
}
#chat .sidebar {
background: #222;
border-left: none;
bottom: 0;
position: absolute;
right: 0;
width: 180px;
}
#chat .names {
bottom: 0;
overflow: auto;
overflow-x: hidden;
-webkit-overflow-scrolling: touch;
padding: 12px 16px;
position: absolute;
top: 32px;
width: 100%;
}
#chat .lobby .chat,
#chat .query .chat {
right: 0;
}
#windows .window:before,
#windows .chan:before {
background-image: none;
border-bottom: none;
display: none;
height: 0px;
}
#chat .time {
background: none;
color: #555;
text-align: right;
width: 46px;
min-width: 46px;
}
#chat .from {
background: none;
border-right: none;
color: #b1c3ce;
padding-right: 10px;
text-align: right;
width: 134px;
min-width: 134px;
}
#chat .msg .type {
color: #666;
}
#form {
border-top: 1px #555 solid;
bottom: 0;
height: 32px;
left: 0;
position: absolute;
right: 0px;
z-index: 1;
}
#form input {
border: none;
font: 13px Consolas, monospace;
border-radius: 0;
height: 100%;
outline: none;
padding: 0 12px;
-webkit-appearance: none;
width: 100%;
background-color: #222;
}
#form .inner {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
}
#footer {
height: 32px;
line-height: 32px;
margin-top: -36px;
text-align: center;
}
#footer button {
border: 0;
}
#footer button.active {
background: none;
}
#footer .icon {
color: #777;
display: inline-block;
font: 14px FontAwesome;
line-height: 34px;
padding: 0px 12px;
}
::-webkit-input-placeholder { /* WebKit browsers */
color: #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #999;
opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #999;
opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #999;
}
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
-webkit-border-radius: 10px;
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
-webkit-border-radius: 10px;
border-radius: 10px;
background: rgba(255,255,255,0.2);
}
@Xe
Copy link
Author

Xe commented Sep 17, 2015

Adding this CSS got rid of the extra button in the corner. .icon.sign-in { display: none !important; }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment