Jump to content

Create a Dark style - TTI


Recommended Posts

It's better in my eyes and favorite so.

 

1. Create a style then dark style - TTI

 

2. Go to template > EXTRA.css

 

3. Add code .CSS

 

body {
  color: #cecece;
  background-color: #1e1e1e !important;
}
.p-body {
  background: #1e1e1e !important;
}
.p-header {
  background: #1e1e1e !important;
}
.p-nav {
  background: #1e1e1e !important;
}
.p-sectionLinks {
  background: #828282;
  border-bottom: 1px solid black;
}
.p-nav-list .p-navEl.is-selected {
  background: #828282;
}
/* Using dark scrollbar */

::-webkit-scrollbar {
  background-color: #2e2e2e;
  width: 15px;
}
::-webkit-scrollbar-thumb {
  background-color: rgba(86, 86, 86, 0.4);
}
::-webkit-scrollbar-thumb:hover {
  background-color: rgba(102, 102, 102, 0.4);
}
textarea::-webkit-scrollbar:vertical {
  border-left: 1px solid #3e3e3e;
}
textarea::-webkit-scrollbar-thumb:vertical {
  border-left: 1px solid #3e3e3e;
}
textarea::-webkit-scrollbar:horizontal {
  border-top: 1px solid #3e3e3e;
}
textarea::-webkit-scrollbar-thumb:horizontal {
  border-top: 1px solid #3e3e3e;
}

4. done.

 

 

Link to post
Share on other sites
  • Replies 5
  • Created
  • Last Reply

Top Posters In This Topic

Nice, thanks for the CSS!

 

I created a new child of the default theme called "Default Dark". If you select that one, it'll include the CSS you gave me above.

 

I actually have another dark theme on here too, but it was disabled because the logo shill shows Curious Cosmos (that's it's own site now and this one is back to TTI). You can select "Dark Matter" and that one is a little more refined :)

 

Hopefully this helps!

 

 

Link to post
Share on other sites
Nice, thanks for the CSS!

I created a new child of the default theme called "Default Dark". If you select that one, it'll include the CSS you gave me above.

 

I actually have another dark theme on here too, but it was disabled because the logo shill shows Curious Cosmos (that's it's own site now and this one is back to TTI). You can select "Dark Matter" and that one is a little more refined :)

 

Hopefully this helps!

Thank you. I will add code for dark color all of the thread and member card, others more. If should be ready. I will send this reply thread update.

 

 

Link to post
Share on other sites

Dark style has been updated and color more.

 

.block-container {
  background: #17171b;
}
.pairs.pairs--rows>dd {
  color: grey;
}
.block-header {
  background: linear-gradient(0deg, #202325, #6d7073);
}
.block-footer {
  color: #ededed;
  background: linear-gradient(180deg, #202325, #6d7073);
}
.block--messages .message, .block--messages .block-row {
  color: grey;
  background: #17171b;
}
.likesBar {
  background: darkgrey;
  border: 1px solid #47a7eb;
  border-left: 2px solid #47a7eb;
}
.message-cell.message-cell--user, .message-cell.message-cell--action {
  background: #2d2d32;
}
.message-userArrow:after {
  border-right-color: #17171b;
}
.button.button--link, a.button.button--link {
  background: #2d2d32;
}

 

Link to post
Share on other sites

Fix missing color a little more,

 

.block-container {
  color: grey;
}
.contentRow-fader {
  background: transparent;
}
.fr-box.fr-basic .fr-wrapper {
  background: #2d2d32;
}
.fr-box.fr-basic .fr-element {
  color: grey;
}
.bbCodeBlock {
  background: #2d2d32;
}
.bbCodeBlock-title {
  background: #17171b;
}
.tooltip--member .tooltip-content {
  background: #17171b;
}
.memberTooltip-header {
  background: #265071;
}

 

Link to post
Share on other sites
Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...