Skip to content

Instantly share code, notes, and snippets.

@ryansechrest ryansechrest/twitch.css
Last active Nov 16, 2018

Embed
What would you like to do?
LimeChat theme using grid.
/**
* Blue: #4b92db
* Light Grey: #8e908f
* Light Blue: #aacae6
* Dark Grey: #5e6a71
* Dark Blue: #165788
* Orange: #eeaf00
* Red: #dc5034
* Green: #a2ad00
* Aqua: #00c6d7
* Yellow: #f8e496
*/
html {
background-color: #000;
color: #aacae6;
font-family: 'Menlo';
font-size: 9pt;
}
body {
display: grid;
grid-row-gap: 5px;
grid-template-columns: auto;
}
body.normal div.line {
grid-template-columns: 50px 150px auto;
}
body.console div.line {
grid-template-columns: 50px 100px 150px auto;
}
/**
* Nick Highlights
******************************************************************************/
div[nick=bbxh].line span.sender,
div[nick=ch1llp1llz].line span.sender,
div[nick=missazuki].line span.sender,
div[nick=someonexh].line span.sender {
color: #eeaf00;
}
/**
* Data Types
******************************************************************************/
.url {
color: #fff;
word-break: break-all;
}
.address {
text-decoration: underline;
word-break: break-all;
}
.highlight {
color: #eeaf00;
font-weight: bold;
}
/**
* All Lines
******************************************************************************/
div.line {
display: grid;
grid-column-gap: 5px;
}
div.line[_type=privmsg] {
/* Inherit from .line */
}
div.line[_type=action] {
color: #5e6a71;
}
div.line span.time {
color: #5e6a71;
}
div.line span.place {
color: #165788;
text-align: right;
}
div.line span.sender {
color: #4b92db;
text-align: right;
}
div.line[_type=action] span.sender {
color: #5e6a71;
}
div.line span.sender[identified=true] {
color: #00c6d7;
}
div.line span.sender[type=myself] {
color: #a2ad00;
}
div.line span.sender[type=normal] {
/* Inherit from .line .sender */
}
div.line span.message {
/* Inherit from html */
}
/**
* Text Lines
******************************************************************************/
div.line.text {
/* Inherit from .line */
}
div.line.text span.time {
/* Inherit from .line */
}
div.line.text span.sender {
/* Inherit from .line */
}
div.line.text span.message {
/* Inherit from .line */
}
/**
* Event Lines
******************************************************************************/
div.line.event {
/* Inherit from .line */
}
div.line.event span.time {
grid-column: span 2;
}
div.line.event span.message {
color: #5e6a71;
}
# All colors must be in the form of '#rrggbb' or '#rgb'.
# You cannot use color names.
# Blue: #4b92db
# Light Grey: #8e908f
# Light Blue: #aacae6
# Dark Grey: #5e6a71
# Dark Blue: #165788
# Orange: #eeaf00
# Red: #dc5034
# Green: #a2ad00
# Aqua: #00c6d7
# Yellow: #f8e496
log-view:
nickname-format: '%n: '
scroller-highlight-color: '#f00'
input-text:
font-family: 'Menlo'
font-size: 10.0
background-color: '#fff'
color: '#000'
selected:
background-color: '#f00'
member-list:
font-family: 'Menlo'
font-size: 10.0
color: '#fff'
background-color: '#000'
operator:
color: '#a2ad00'
selected:
color: '#fff'
background:
# gradient
top-line-color: '#8e908f'
bottom-line-color: '#8e908f'
top-color: '#8e908f'
bottom-color: '#8e908f'
server-tree:
font-family: 'Menlo'
font-size: 10.0
background-color: '#000'
highlight:
color: '#f00'
newtalk:
color: '#f00'
unread:
color: '#eeaf00'
normal:
active:
color: '#fff'
inactive:
color: '#5e6a71'
selected:
active:
color: '#fff'
inactive:
color: '#5e6a71'
background:
# gradient
top-line-color: '#8e908f'
bottom-line-color: '#8e908f'
top-color: '#8e908f'
bottom-color: '#8e908f'
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.