Text Color

BrendonMize
BrendonMize
edited January 2015 in Campaign Portal Building
I made my Front Page and my Wiki transparent. But my text will not for the life of me change color other than some barely visible dark gray. Please advise.

I have used google up and down and tried different HTML codes within the text box, have different CSS codes in the Settings, and it remains the same dark gray color.

https://monstrous-compendium.obsidianportal.com/

Comments

  • BrendonMize
    BrendonMize
    Posts: 22
    Nothing I am putting into CSS is removing the Dragonhead either.
  • BrendonMize
    BrendonMize
    Posts: 22
    If anyone help, I just want all of my text color to be a bright white. I have a blood splattered black background.
  • ketherian
    ketherian
    Posts: 203
    Hi BrendonMize,
    I can't see your page.

    I think you may have to set the page to public before I can see what you're talking about; or add me as a player.

    -
    Ketherian
    "Signs & Portents":https://swtwc.obsidianportal.com
  • BrendonMize
    BrendonMize
    Posts: 22
    I will add you as a player. I have made some other adjustments such as hyperlinked pictures on the wiki.
  • Belrathius
    Belrathius
    Posts: 206
    Here is a link to "my CSS,":https://gurpsspace.obsidianportal.com/wikis/css if it helps (I also can't see your campaign site).

    I use a transparent background to the sections, allowing them to see through to the starry background set for the campaign. I have also removed the dragon icon, which I _think_ I recall is ".flame-dragon svg" but not certain. I have also changed nearly all of the text to white (the remaining black is on purpose, being on a white background), which required several sections being called out.


    I hope this helps,
    - Tom
    "Experiments in Space":https://gurpsspace.obsidianportal.com/
  • GamingMegaverse
    GamingMegaverse
    Posts: 2,998
    Yes, Ketherian is right- if you want the whole community to help, you need it public- however, with Ketherian you are in great hands....

    Just trying to help out.

  • BrendonMize
    BrendonMize
    Posts: 22
    I am using artwork found on google searches. I am weary of complaints from copyright holders if I make it public.
  • GamingMegaverse
    GamingMegaverse
    Posts: 2,998
    I have found that as long as they do not expressly wish them not to be used, most are fine as long as you link their work. So I do that on whatever page I use the art, and I have a separate "acknowledgements":https://a-god-rebuilt.obsidianportal.com/wikis/acknowledgements page. I have over 600 different acknowledgements, and only once have I had someone ask me to remove their work.
    killervp
    "A God...Rebuilt":https://a-god-rebuilt.obsidianportal.com
    "OP's COTM April 2012":http://blog.obsidianportal.com/a-god-rebuilt-aprils-cotm/
    Over 300 Fans, and Looking for More!

    Just trying to help out.

  • cgregory
    cgregory
    Posts: 780
    It depends on which of the dragons you want to remove. There are two different spots where the dragon shows up

    This line of code gets rid of the one right above your banner
    .flame-dragon {display:none;}

    These two lines get rid of the one right above the dashboard
    .main-nav-img {display:none;}
    #Layer_1 {display:none;}

    However, I would probably only use the
    #Layer_1 {display:none;}

    and insert an image into the .main-nav-img one, because removing the main-nav-img might push your dashboard up more than you wish.

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • BrendonMize
    BrendonMize
    Posts: 22
    Also, for some reason, there are huge gaps between my tables that I enter, and the title image.
  • cgregory
    cgregory
    Posts: 780
    You have a bunch of line break
    tags. Remove some and the space will decrease.

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • cgregory
    cgregory
    Posts: 780
    Since you put most of text between p tags you could add the following to your css

    p {
    color: #767676;
    }

    or whatever color you want

    You shouldn't need it but if it doesn't work add a !important qualifier

    color: #767676 !important;

    They are among us!

    image

                       XCom: Defiance - Campaign of the Month November 2016

     

     

  • ketherian
    ketherian
    Posts: 203
    cgregory has the right of it.
    That should work. If it doesn't, let us know.
    & you should probably expose your CSS, as Belrathius and I have done.

    The CSS for my current site is "here":https://swtwc.obsidianportal.com/wikis/signsnportendscss.

    Thanks for the vote of confidence KillerVP.

    -
    Ketherian
    "Signs & Portends":https://swtwc.obsidianportal.com
  • BrendonMize
    BrendonMize
    Posts: 22
    I made a wiki page for the CSS I used labeled as [[CSS]]. It is a very little amount. I didn't want to put a huge amount of custom work into it. I was wanting something more than mere basic, but as basic as possible. here is what I used:

    h1 {text-align: center;}
    h2 {text-align: left;}
    h3 {text-align: left;}

    p.main {text-align: justify;}

    .main-content {background-color: transparent !important;}
    .campaign-landing-page-container {background-color: transparent !important;}
    .wiki-page.section {background-color: transparent !important;}

    blockquote {color:black !important;}

    div.post-section.post-main {background-color:transparent !important;]

    table {margin-left: auto; margin-right: auto;}

    p {text-color: #FFFFFF !important;}
  • BrendonMize
    BrendonMize
    Posts: 22
    Also, I tried p {color: #767676;} and it didn't work. I tried #FFFFFF and it didn't work. I added text-color: and it didn't work. I am thinking I am just going to put all of my text onto black background images and loading it as an image rather than keep trying and failing.

    I super appreciate everyone assisting me. I don't know what is bugging out on my site. Maybe it is just my novice experience.
  • BrendonMize
    BrendonMize
    Posts: 22
    This is what I am doing now; adding parchment as a background for each entry so the text can be visible. Not exactly what I thought I would have to do, but it is not a problem. Just a little nuisance that I can put up with. I also had to put: so the tables wouldn't appear white on top of the parchment and I had to put for each row of the tables so there wouldn't be any white as well.
  • Belrathius
    Belrathius
    Posts: 206
    Hi Brendon,

    I haven't had a chance to check out your pages yet, but I did accept the invite and it's on my to-do list.

    - Belrathius
  • ketherian
    ketherian
    Posts: 203
    On the Adventure logs page, Color is defined in:
    * .campaign-public-layout p and .main-content p as #232323
    * and body p as #767676;

    So, try adding following to your CSS:
    @.campaign-public-layout p,
    .main-content p,
    body {color:aliceblue;}@

    + whatever you did to make things transparent.
    This might miss something (like sidebar text, titles, ...), but should be a good start.

    As to tables, you could move the style information into your CSS so all tables get that style.

    @th, tr {background-color:transparent;}
    table {border:0px none transparent; text-align:auto; background-color:transparent;}@

    -
    Ketherian
    "Signs & Portends":https://swtwc.obsidianportal.com/
    "Textile help":http://redcloth.org/textile/
  • BrendonMize
    BrendonMize
    Posts: 22
    I added the following to my CSS:

    .adventure-log-show div.post-header-container {background-color: transparent;font-color:black; border-style: none;}
    .adventure-log-show.post-date, .adventure-log-index .post-date {background-color:#CC9966; font-color:black; color:black;}
    .adventure-log-index .post-column { width: 800px;}
    .adventure-log-teasers .row { height:250px; font-color: black;}
    .adventure-log-index .adventure-log-post {background-color:transparent; border-style:none; font-color:black;}
    .adventure-log-page .post-title {position:relative; font-color:black; z-order:10;}
    .post-comments.post-section {background-color:transparent !important;}

    And I can still see white in my Adventure Logs. Please advise.
  • Unknown
    I am assuming you are referring to when you click the Adventure Log menu and then get to your list of postings as I see these all have a white background still. If that is the case, try out this:

    /* TRANSPARENT LISTING */
    .campaign-public-layout .adventure-log-post, .adventure-log-post .post-header-container {
    background-color: transparent;
    }

    .adventure-log-index .overflow-fade-out, .post-content .overflow-fade-out {
    background:none;
    display:none;
    }

    --
    Alex
    "Dragon Age: Requiem":https://dragon-age-requiem.obsidianportal.com/
  • BrendonMize
    BrendonMize
    Posts: 22
    CSS is as follows:

    h1 {text-align: center;}
    h2 {text-align: left;}
    h3 {text-align: left;}

    p.main {text-align: justify;}

    .main-content {background-color: transparent !important;}
    .campaign-landing-page-container {background-color: transparent !important;}
    .wiki-page.section {background-color: transparent !important;}

    blockquote {color:black !important;}

    div.post-section.post-main {background-color:transparent !important;]

    table {margin-left: auto; margin-right: auto;}

    p.main {text-color: #FFFFFF !important;}

    th, tr {background-color:transparent;}
    table {border:0px none transparent; text-align:auto; background-color:transparent;}

    .adventure-log-show div.post-header-container {background-color: transparent;font-color:black; border-style: none;}
    .adventure-log-show.post-date, .adventure-log-index .post-date {background-color:#CC9966; font-color:black; color:black;}
    .adventure-log-index .post-column { width: 800px;}
    .adventure-log-teasers .row { height:250px; font-color: black;}
    .adventure-log-index .adventure-log-post {background-color:transparent; border-style:none; font-color:black;}
    .adventure-log-page .post-title {position:relative; font-color:black; z-order:10;}
    .post-comments.post-section {background-color:transparent !important;}

    iframe {max-width: 700px;}

    ins {color:inherit; text-decoration:inherit;}
    ins:before {content:‘+’;}
    ins:after {content:‘+’;}

    ul {width: 650px;}
    .list {list-style-type: none;}
    .list li {list-style-type: none; position: relative; padding-left: 5px;}
    .list li:before {content: ' '; display: block; width: 10px; height: 10px; background: #eee; border: solid 1px #aaa; position: relative; top: 3px; left: -15px;}

    /* TRANSPARENT LISTING */
    .campaign-public-layout .adventure-log-post, .adventure-log-post .post-header-container {background-color: transparent;}
    .adventure-log-index .overflow-fade-out, .post-content .overflow-fade-out {background:none; display:none;}

    Still have the white borders/backgrounds in Adventure Log previews and headers in Adventure Log entries.
  • Unknown
    Ok, try changing the end of your CSS to this and I think that should correct it for you:

    /* TRANSPARENT LISTING */
    .campaign-public-layout .adventure-log-post,.adventure-log-post .post-header-container,.adventure-log-show .post-header-container,.adventure-log-index .adventure-log-post {
    background-color: transparent;
    }

    .adventure-log-index .overflow-fade-out,.post-content .overflow-fade-out,.campaign-public-layout .highlight-container {
    background:none;
    display:none;
    }
Sign In or Register to comment.

March 2024
Wrath of the Highborn

Read the feature post on the blog
Return to Obsidian Portal

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Discussions