Fanfiction.net Themes

Probellum · Nov 11, 2013

That's one part, but there's also the chapter selection bar messing with the firsst line of the actual chapter.

Nuit · Nov 11, 2013

Well, this is just a sloppy method in my opinion, considering I barely know anything about coding, but it does get those two apart.
Code:
.storytextp {
    padding-top: 25px !important;
	}

pdo91 · Nov 13, 2013

I haven't properly updated my theme in ages, so I went through and cleaned it up. I even commented it so that you guys can cannibalize it for your own themes

. I'm pretty sure I got everything, but if you see a drop-down box with weird colors let me know.

Light Green

Code:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("fanfiction.net") {

/* DLP Color Scheme:
Background:          #21301f
Header Background:   #0A1C0B
Text:                #BAD6c2
Time Text:           #A6AAA2
Link:                #93be91
Link Hover:          #34d238
*/


/* Main body recolor */
html, body, td, th, .storytextp, .storytext, .panel_wrapper, .tabs *, .zmenu, .tcat, .input-block-level, label.checkbox, .gray, div.panel_normal, .menulink.maxwidth, #top, #content_wrapper, #content_parent {
  background-image: none !important;
  background: #21301f !important;
  color: #BAD6c2 !important;
}

/* Story statistics color */
.z-padtop2.xgray, .xgray.xcontrast_txt {
  color: #A6AAA2 !important;
}

/* Drop-down menus and buttons */
select, input, textarea, button {
  background: #21301F !important;
  color: #93be91 !important;
  border: 1px solid #ccc !important;
  -moz-appearance: none !important;
  text-shadow: none !important;
}

/* Drop-down menu colors */
#content_wrapper_inner cachehit div form select option, #content_wrapper_inner table tbody tr td select option, #myform .modal-body .filter_select option, #chap_select option {
  background: #21301f !important;
  color: #93be91 !important;
}
#content_wrapper_inner cachehit div form select option:hover, #content_wrapper_inner table tbody tr td select option:hover, #myform .modal-body .filter_select option:hover, #chap_select option:hover, .dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-submenu:hover a, .dropdown-submenu:focus a {
  background: #223B21 !important;
  color: #34d238 !important;
}

/* Story filter and Follow/Favorite drop-downs */
.dropdown-menu, .modal, .modal-footer, .modal-body span, .btn, .btn-primary, .span2, .lc, .lc-left {
    background-color: #21301F !important;
    background-image: none !important;
    color: #93be91 !important;
    text-shadow: none !important;
  }

/* Color of the links in the main body */
a, a.a2a_menu_powered_by, a:visited, a.a2a_menu_powered_by:visited {
  color: #93be91 !important;
  border: none !important;
}
a:hover,a:visited:hover, a.a2a_menu_powered_by:hover, a.a2a_menu_powered_by:visited:hover {
  color: #34d238 !important;
}

/* Hover color of the user account menu */
thead,.alt1,.thead,ul.topnav ul li.active {
  background: #21301f !important;
}
ul.topnav li a:hover, ul.topnav ul li a:hover {
  background: #223B21 !important;
}

/* Twitter widget */
#twitter-widget-0 {
  display: none;
}

/* Story/Author image */
.cimage {
  display: none;
}

/* Padding between chapter selection and story */
.storytextp {
  padding-top: 20px !important;
}

/* Max width of the story across the screen */
#content_wrapper {
  min-width: 98% !important;
}

/* Size of the story text and the line spacing */
#storytext {
  font-size: 1.15em !important;
  line-height: 1.4em !important;
}

}

Dark Green

Code:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("fanfiction.net") {

/* DLP Color Scheme:
Background:          #21301f
Header Background:   #0A1C0B
Text:                #BAD6c2
Time Text:           #A6AAA2
Link:                #93be91
Link Hover:          #34d238
*/


/* Main body recolor */
html, body, td, th, .storytextp, .storytext, .panel_wrapper, .tabs *, .zmenu, .tcat, .input-block-level, label.checkbox, .gray, div.panel_normal, .menulink.maxwidth, #top, #content_wrapper, #content_parent {
  background-image: none !important;
  background: #0A1C0B !important;
  color: #BAD6c2 !important;
}

/* Story statistics color */
.z-padtop2.xgray, .xgray.xcontrast_txt {
  color: #A6AAA2 !important;
}

/* Drop-down menus and buttons */
select, input, textarea, button {
  background: #0A1C0B !important;
  color: #93be91 !important;
  border: 1px solid #ccc !important;
  -moz-appearance: none !important;
  text-shadow: none !important;
}

/* Drop-down menu colors */
#content_wrapper_inner cachehit div form select option, #content_wrapper_inner table tbody tr td select option, #myform .modal-body .filter_select option, #chap_select option {
  background: #0A1C0B !important;
  color: #93be91 !important;
}
#content_wrapper_inner cachehit div form select option:hover, #content_wrapper_inner table tbody tr td select option:hover, #myform .modal-body .filter_select option:hover, #chap_select option:hover, .dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-submenu:hover a, .dropdown-submenu:focus a {
  background: #223B21 !important;
  color: #34d238 !important;
}

/* Story filter and Follow/Favorite drop-downs */
.dropdown-menu, .modal, .modal-footer, .modal-body span, .btn, .btn-primary, .span2, .lc, .lc-left {
    background-color: #0A1C0B !important;
    background-image: none !important;
    color: #93be91 !important;
    text-shadow: none !important;
  }

/* Color of the links in the main body */
a, a.a2a_menu_powered_by, a:visited, a.a2a_menu_powered_by:visited {
  color: #93be91 !important;
  border: none !important;
}
a:hover,a:visited:hover, a.a2a_menu_powered_by:hover, a.a2a_menu_powered_by:visited:hover {
  color: #34d238 !important;
}

/* Hover color of the user account menu */
thead,.alt1,.thead,ul.topnav ul li.active {
  background: #0A1C0B !important;
}
ul.topnav li a:hover, ul.topnav ul li a:hover {
  background: #223B21 !important;
}

/* Twitter widget */
#twitter-widget-0 {
  display: none;
}

/* Story/Author image */
.cimage {
  display: none;
}

/* Padding between chapter selection and story */
.storytextp {
  padding-top: 20px !important;
}

/* Max width of the story across the screen */
#content_wrapper {
  min-width: 98% !important;
}

/* Size of the story text and the line spacing */
#storytext {
  font-size: 1.15em !important;
  line-height: 1.4em !important;
}

}

Nuit · Nov 13, 2013

The @-moz-document made it unusable until I deleted it both in Chrome and Opera on Stylish. Maybe just me but I don't think so.

pdo91 · Nov 14, 2013

You're right, the @-moz-document part only works for Firefox. I just copy-pasted the whole thing - whoops. Just delete that bit to make it work in other browsers.

Also, I found something I missed: the pop-up message confirming when you follow/favorite something. If you want that to go with your theme instead of its normal black, you can put this in your code. Use #0A1C0B for the background color if you want dark green:
Code:
/* Follow/favorite pop-up */
div.toast {
color: #BAD6c2 !important;
background-color: #21301f !important;
opacity: 1.0 !important;
}

Nuit · Nov 14, 2013

How would I go about changing these little green squares in the corners to black, hopefully without changing the corners up top?

Here's my additional code added to yourstyle, I moved the #content_parent from your main body recolor.
Code:
/* Additions By NuitTombee */

#content_parent {
background-image: none !important;
background: #000 !important;
}

.caret {
border-top: 4px solid #fff;
}
  
#p_footer {
background: #000 !important;
}

.tcat {
background-color: #0A1C0B !important;
border-color: #000 !important;
}

#content_wrapper_inner, .table-bordered {
border-color: #000 !important;
}
I forgot to mention in case anyone else wants it, the .caret addition changes those black drop-down arrows up top to white. and I added a bit more code.

Can't figure out how to, with my barely there coding knowledge, change the News header to similar to Fanfiction and Crossovers without fucking up the rest of the page.

Dark Syaoran · Nov 15, 2013

I've also noticed that the 'add to C2' and various other buttons have vanished.

Also, this white thing.

Nuit · Nov 15, 2013

Ah you're using Oz's, here you go.
Code:
.lc, .lc-left {background-color: #0a1c0b !important;}
Also, the Add to C2 should be under actions at the bottom.

Dark Syaoran · Nov 15, 2013

They used to be there, but everything is missing now. Maybe it's on Oz's.

Edit: Using new script, it is back. For some reason, they had vanished from Oz's one. I also made my story-font a little smaller, because damn that was big.

Nuit · Nov 16, 2013

Also, while visiting a profile I saw a horrendous site. [pdo91's Light Green]

Here's what I used to fix it.
Code:
.fake_link {
color: #93be91 !important;
border-bottom: solid 1px #93be91 !important;
}

Dark Syaoran · Nov 26, 2013

They've changed a few things and I found one thing that was missed last time. First picture is when you log out. It probably happens in other areas, as well. Second is that little weird number circle they've placed on the filter to tell you how many stories are going to be shown under what you choose. It isn't terribly annoying with the current colour but it doesn't fit completely. The last is the colour of the tabs, as well as more of that number circle stuff.

pdo91 · Nov 26, 2013

Alright, I think I got it all. First off:

Code:

#p_footer.maxwidth{
  min-width: 100% !important;
  background-image: none !important;
  background: black !important;
}

.tcat, #gui_table3i.table.table-striped tbody tr:first-child td {
  background: #0A1C0B !important;
 }

Problems solved

.

For the rest of you, here's the updated style. It should fix all the bugs, from the new counters to those heinous blue links.

Light Green

Code:

/* DLP Color Scheme:
Background:          #21301f
Header Background:   #0A1C0B
Text:                #BAD6c2
Time Text:           #A6AAA2
Link:                #93be91
Link Hover:          #34d238
*/


/* Main body recolor */
html, body, td, th, .storytextp, .storytext, .panel_wrapper, .tabs *, .zmenu, .tcat, .input-block-level, label.checkbox, .gray, div.panel_normal, .panel_success, .gui_success, .menulink.maxwidth, #top, #content_wrapper, #content_parent {
  background-image: none !important;
  background: #21301f !important;
  color: #BAD6c2 !important;
}

/* Story statistics color */
.z-padtop2.xgray, .xgray.xcontrast_txt {
  color: #A6AAA2 !important;
}

/* Drop-down menus and buttons */
select, input, textarea, button {
  background: #21301F !important;
  color: #93be91 !important;
  border: 1px solid #ccc !important;
  -moz-appearance: none !important;
  text-shadow: none !important;
}

/* Drop-down menu colors */
#content_wrapper_inner cachehit div form select option, #content_wrapper_inner table tbody tr td select option, #myform .modal-body .filter_select option, #chap_select option{
  background: #21301f !important;
  color: #93be91 !important;
}
#content_wrapper_inner cachehit div form select option:hover, #content_wrapper_inner table tbody tr td select option:hover, #myform .modal-body .filter_select option:hover, #chap_select option:hover, .dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-submenu:hover a, .dropdown-submenu:focus a {
  background: #223B21 !important;
  color: #34d238 !important;
}

/* Dropdown menu arrows */
.caret {
  background: #BAD6c2 !important;
  border: 2px solid !important;
}

/* Story filter and Follow/Favorite drop-downs */
.dropdown-menu, .modal, .modal-footer, .modal-body span, .btn, .btn-primary, .span2, .lc, .lc-left, #live_counter.badge {
  background-color: #21301F !important;
  background-image: none !important;
  color: #93be91 !important;
  text-shadow: none !important;
  }

/* Color of the links in the main body */
a, a.a2a_menu_powered_by, a:visited, a.a2a_menu_powered_by:visited, .fake_link {
  color: #93be91 !important;
  border: none !important;
}
a:hover,a:visited:hover, a.a2a_menu_powered_by:hover, a.a2a_menu_powered_by:visited:hover, .fake_link:hover {
  color: #34d238 !important;
}

/* Follow/favorite pop-up */
div.toast {
  color: #BAD6c2 !important;
  background-color: #21301f !important;
  opacity: 0.975 !important;
}

/* Author page tab colors*/
#l_fs, #l_fa, #l_st.current, #l_cc, span.badge, #mytab.nav.nav-tabs{
  background: #21301f !important;
  color: #93be91 !important;
  border: 0px !important;
}
#l_fs:hover, #l_fa:hover, #l_st.current:hover, #l_cc:hover {
  background: #223B21 !important;
  color: #34d238 !important;
}

/* Hover color of the user account menu */
thead,.alt1,.thead,ul.topnav ul li.active {
  background: #21301f !important;
}
ul.topnav li a:hover, ul.topnav ul li a:hover {
  background: #223B21 !important;
}


/* Twitter widget */
#twitter-widget-0 {
  display: none;
}

/* Story/Author image */
.cimage, .round36 {
  display: none !important;
}

/* Padding between chapter selection and story */
.storytextp {
  padding-top: 20px !important;
}

/* Max width of the story across the screen */
#content_wrapper {
  min-width: 98% !important;
}

/* Size of the story text and the line spacing */
#storytext {
  font-size: 1.15em !important;
  line-height: 1.4em !important;
}

Dark Green

Code:

/* DLP Color Scheme:
Background:          #21301f
Header Background:   #0A1C0B
Text:                #BAD6c2
Time Text:           #A6AAA2
Link:                #93be91
Link Hover:          #34d238
*/


/* Main body recolor */
html, body, td, th, .storytextp, .storytext, .panel_wrapper, .tabs *, .zmenu, .tcat, .input-block-level, label.checkbox, .gray, div.panel_normal, .panel_success, .gui_success, .menulink.maxwidth, #top, #content_wrapper, #content_parent {
  background-image: none !important;
  background: #0A1C0B !important;
  color: #BAD6c2 !important;
}

/* Story statistics color */
.z-padtop2.xgray, .xgray.xcontrast_txt {
  color: #A6AAA2 !important;
}

/* Drop-down menus and buttons */
select, input, textarea, button {
  background: #0A1C0B !important;
  color: #93be91 !important;
  border: 1px solid #ccc !important;
  -moz-appearance: none !important;
  text-shadow: none !important;
}

/* Drop-down menu colors */
#content_wrapper_inner cachehit div form select option, #content_wrapper_inner table tbody tr td select option, #myform .modal-body .filter_select option, #chap_select option{
  background: #0A1C0B !important;
  color: #93be91 !important;
}
#content_wrapper_inner cachehit div form select option:hover, #content_wrapper_inner table tbody tr td select option:hover, #myform .modal-body .filter_select option:hover, #chap_select option:hover, .dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-submenu:hover a, .dropdown-submenu:focus a {
  background: #21301f !important;
  color: #34d238 !important;
}

/* Dropdown menu arrows */
.caret {
  background: #BAD6c2 !important;
  border: 2px solid !important;
}

/* Story filter and Follow/Favorite drop-downs */
.dropdown-menu, .modal, .modal-footer, .modal-body span, .btn, .btn-primary, .span2, .lc, .lc-left, #live_counter.badge {
    background-color: #0A1C0B !important;
    background-image: none !important;
    color: #93be91 !important;
    text-shadow: none !important;
  }

/* Color of the links in the main body */
a, a.a2a_menu_powered_by, a:visited, a.a2a_menu_powered_by:visited, .fake_link {
  color: #93be91 !important;
  border: none !important;
}
a:hover,a:visited:hover, a.a2a_menu_powered_by:hover, a.a2a_menu_powered_by:visited:hover, .fake_link:hover {
  color: #34d238 !important;
}

/* Follow/favorite pop-up */
div.toast {
color: #BAD6c2 !important;
background-color: #0A1C0B !important;
opacity: 0.975 !important;
}

/* Author page tab colors*/
#l_fs, #l_fa, #l_st.current, #l_cc, span.badge, #mytab.nav.nav-tabs{
  background: #0A1C0B !important;
  color: #93be91 !important;
  border: 0px !important;
}
#l_fs:hover, #l_fa:hover, #l_st.current:hover, #l_cc:hover {
  background: #21301f !important;
  color: #34d238 !important;
}

/* Hover color of the user account menu */
thead,.alt1,.thead,ul.topnav ul li.active {
  background: #0A1C0B !important;
}
ul.topnav li a:hover, ul.topnav ul li a:hover {
  background: #21301f !important;
}


/* Twitter widget */
#twitter-widget-0 {
  display: none;
}

/* Story/Author image */
.cimage, .round36 {
  display: none !important;
}

/* Padding between chapter selection and story */
.storytextp {
  padding-top: 20px !important;
}

/* Max width of the story across the screen */
#content_wrapper {
  min-width: 98% !important;
}

/* Size of the story text and the line spacing */
#storytext {
  font-size: 1.15em !important;
  line-height: 1.4em !important;
}

Nuit · Nov 26, 2013

pdo91 said: ↑

Alright, I think I got it all. First off:
Click to expand...

Thanks pdo.

Edit: Looks nice. :3

The only problem left is with the profile page footer but eh, I can ignore that. I dunno why they decided to make the footer there so different.

Snarf · Nov 28, 2013

Before I added
Code:
@-moz-document domain("fanfiction.net") {
to the latest DLP theme script, it affected the entirety of Firefox. Not sure if that was a screw up on my end or not.

pdo91 · Nov 28, 2013

Snarf said: ↑
Before I added
Code:
@-moz-document domain("fanfiction.net") {
to the latest DLP theme script, it affected the entirety of Firefox. Not sure if that was a screw up on my end or not.
Click to expand...
Nope, that's how the firefox version of stylish handles code. I left that part out this time - damned if I do, damned if I don't.

Dark Syaoran · Dec 2, 2013

The first picture happens when you aren't logged in and click on reply for a review. Similar to one I've posted before. The second is while logged in and looking at private messages. The speech bubbles are all yellow.

Dark Syaoran · Dec 16, 2013

Bump for justice.

Rahkesh Asmodaeus · Dec 16, 2013

If you double post again imma have to ban you, yo.

pdo91 · Dec 17, 2013

For your viewing pleasure. Change the 'background' color to #0A1C0B for dark green.
Code:
.panel_warning, .gui_warning, .round8 {
  background-image: none !important;
  background: #21301f !important;
  color: #BAD6c2 !important;
}

Dark Syaoran · Dec 31, 2013

Alas, I've found something else. Urgh. This appears when checking out my C2 archive within my account.

DLP Flash Christmas Competition + Writing Marathon 2024!

Hi there, Guest

Fanfiction.net Themes

Probellum Death Eater

Nuit Dark Lord

pdo91 Professor DLP Supporter

Nuit Dark Lord

pdo91 Professor DLP Supporter

Nuit Dark Lord

Dark Syaoran No. 4 Admin

Attached Files:

Untitled.png

Nuit Dark Lord

Dark Syaoran No. 4 Admin

Nuit Dark Lord

Dark Syaoran No. 4 Admin

Attached Files:

Untitled 1.png

Untitled 2.1.jpg

Untitled 3.1.jpg

pdo91 Professor DLP Supporter

Nuit Dark Lord

Snarf Squanchin' Party Bro! ~ Prestige ~ DLP Supporter

pdo91 Professor DLP Supporter

Dark Syaoran No. 4 Admin

Attached Files:

Untitled 1.jpg

Untitled 2.jpg

Dark Syaoran No. 4 Admin

Rahkesh Asmodaeus THUNDAH Bawd Admin DLP Supporter

pdo91 Professor DLP Supporter

Dark Syaoran No. 4 Admin

Attached Files:

Untitled.jpg

Most and Least Bashed Characters in FanFiction

Fanfiction and AI

Reality Shifting: TikTok's newest obsession with mental fanfiction

How does DLP read fanfiction?

Vash's totally (not) epic FFn Themes

DLP Flash Christmas Competition + Writing Marathon 2024!

Hi there, Guest

Fanfiction.net Themes

Probellum Death Eater

Nuit Dark Lord

pdo91 Professor DLP Supporter

Nuit Dark Lord

pdo91 Professor DLP Supporter

Nuit Dark Lord

Dark Syaoran No. 4 Admin

Attached Files:

Nuit Dark Lord

Dark Syaoran No. 4 Admin

Nuit Dark Lord

Dark Syaoran No. 4 Admin

Attached Files:

pdo91 Professor DLP Supporter

Nuit Dark Lord

Snarf Squanchin' Party Bro! ~ Prestige ~ DLP Supporter

pdo91 Professor DLP Supporter

Dark Syaoran No. 4 Admin

Attached Files:

Dark Syaoran No. 4 Admin

Rahkesh Asmodaeus THUNDAH Bawd Admin DLP Supporter

pdo91 Professor DLP Supporter

Dark Syaoran No. 4 Admin

Attached Files:

Useful Searches