Skip to content

Instantly share code, notes, and snippets.

@ssddanbrown
Last active June 3, 2016 14:26
Show Gist options
  • Save ssddanbrown/8723490d07e5e2c534f2 to your computer and use it in GitHub Desktop.
Save ssddanbrown/8723490d07e5e2c534f2 to your computer and use it in GitHub Desktop.
Trello dark theme style overrides
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
body {
background-size:cover !important;
}
/*Background Images*/
body[style*='background-image: url("https://d2k1ftgv7pobq7.cloudfront.net/images/backgrounds/purty_wood_dark.png");'] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/blue.jpg) !important;
}
/*Light Green*/
body[style*='background-image: url("https://d2k1ftgv7pobq7.cloudfront.net/images/backgrounds/red-sweater.png");'] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/yellow.jpg) !important;
}
/*Blue*/
body[style*="background-color: rgb(0, 121, 191);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/blue.jpg) !important;
}
/*Oranage*/
body[style*="background-color: rgb(210, 144, 52);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/yellow.jpg) !important;
}
/*Green*/
body[style*="background-color: rgb(81, 152, 57);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/green.jpg) !important;
}
/*Red*/
body[style*="background-color: rgb(176, 70, 50);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/red.jpg) !important;
}
/*Purple*/
body[style*="background-color: rgb(137, 96, 158);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/purple.jpg) !important;
}
/*Pink*/
body[style*="background-color: rgb(205, 90, 145);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/pink.jpg) !important;
}
/*Light Green*/
body[style*="background-color: rgb(75, 191, 107);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/light-green.jpg) !important;
}
/*Light Blue*/
body[style*="background-color: rgb(0, 174, 204);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/light-blue.jpg) !important;
}
/*Grey*/
body[style*="background-color: rgb(131, 140, 145);"] {
background-image: url(https://s3-eu-west-1.amazonaws.com/images.danb.me/trello-backgrounds/grey.jpg) !important;
}
/*Cards*/
body #content .list-card {
background-color: #333;
border-bottom: 0;
box-shadow: 0 1px 6px 0px rgba(0, 0, 0, 0.2);
border-radius: 2px;
cursor: pointer;
margin-bottom: 8px;
max-width: 300px;
min-height: 20px;
border-left: 4px solid #86BFF3;
font-family: 'Roboto';
}
body #content .list-card a {
color: #E4E4E4;
}
body #content .list {
background: rgba(0,0,0,.3);
}
body #content .open-card-composer {
color: #DDD;
}
body #content .open-card-composer:hover {
background-color: rgba(0, 0, 0, 0.1);
}
body #content .list-header-name {
color: #fff;
opacity:0.6;
font-weight: 400;
}
#content .list-card-composer-textarea {
color: #EEE;
}
#content .list-card-operation{
background-color:transparent;
color: #FFF;
}
#content .list-card-operation:hover{
background-color:transparent;
color: #FFF;
}
#content .list-card-labels .card-label {
width: auto;
height: auto;
padding: 2px 4px;
font-weight: 400;
line-height: 1;
font-size: 10px;
text-shadow: 1px 0 0 #000;
}
body #jfContent {
background-color:#FFF;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment