Okay, so unless someone can let me know if there's a simple global override for these, I guess I just have to inspect each element I run across and target them specifically.
"campaign-dashboard-layout" is the corresponding class for private areas to "campaign-public-layout" for public areas. So to turn all h1 headers in your public site would be:
@.campaign-public-layout h1 {color: red;}@
While to turn all h1 headers in your private site would be:
@.campaign-dashboard-layout h1 {color: red;}@
So code to turn all headers in both public and private areas of your campaign red is:
EDIT: Although, honestly, I'm not sure why the "h1, h2, h3, h4, h5" selector didn't work. It might be that there is more specific CSS set in the application, so this might be one of the few good use cases for the !important tag.
It does seem there're colors specifically set pretty far down the chain in OPs CSS that overrides. Here's what's worked for me to change all of the ones i wanted.
The big title actually isn't header text at all (even though it looks like it) - it has both the .campaign-link class and the #content ID, and is an a element. Try this:
@#content a.campaign-link {color: red;}@
As for the disappearing GM Text, I haven't the foggiest idea. I would submit a Help ticket.
Hi,
With only a few months out of OP, my knowledge of CSS is totally rusty... Who could help me??
Here is my query: on my "adventure log page":https://dark-sun-a-trova.obsidianportal.com/adventure-log, I want to catch the fade out and change the height of each box (to make each adventure banner full).
Thank you
(it seem that my english too is gone rusty, sorry...)
-Pils
"Dark Sun / La Décade des Héros":https://dark-sun-a-trova.obsidianportal.com/: Face the Fire of the Dark Sun... a World ravaged by Sorcery!
Hey, I could use some help: I'm trying to fix the color of the "Quotes" text, which are actually tags within . The current light grey is super hard to read, so I'm trying to make it much more usable. I've tried these options (one at a time -- not all at once) but none of them work:
someone with more skill and knowledge than myself will be along shortly to help you, but in the mean time...
Not sure if it makes a difference, but I always use the set names or a three digit code for colour changes (NOTE - i have not tried either of these suggestions, just suggesting things that have worked for me in the past)
e.g. instead fo #482200, try #480 instead?
also may be easier to just try
.campaign-public-layout blockquote {font-color: black;} and see if that works
OK...something I'm trying tof igure out, and don;t know if it can even be done.
Is there a way to redirect the Standard Link for the Characters page from the default page to a different page? I've tinkered and toyed with the Character Page on the site for my new campaign I am working on, but it still does not meet my liking and would be much easier if I could take that page out completely with a custom one of ym own.
As always, thanks.
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/
Not the solution I am looking for. Want to use the Menu that OP provides. Used my own Nav Bar in the shadows Site and it was far more trouble than it was worth.
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/
I used to be able to make images a button to other pages but how the embedded image works now seems to have changed. How do I add a URL or wiki link to an image to create a button?
I also encountered this problem when the picture codes changed. I think I got around it by RIGHT CLICKING on the picture and using COPY URL and pasting that into the code I had previously used to create the picture link.
twiggyleaf
CURRENT CAMPAIGN: "Mysteria":http://www.obsidianportal.com/campaigns/mysteria - set in Wolfgang Baur’s MIDGARD.
Previous CotM Aug 2012: "Shimring":http://www.obsidianportal.com/campaigns/shimring
"I met a traveller from an antique land....."
CotM May 2016: Mysteria: set in Wolfgang Baur’s MIDGARD.
Previous CotM Aug 2012: Shimring: High Level Multiplanar Campaign
Without speculating about its purpose, the old image code included it by default when you inserted an image into the wiki, so it isn't being generated dynamically on page-load.
In the absence of any reason to get rid of it, I'd leave it intact just in case the devs are currently or plan in the future on using it for something.
Interestingly, you can also replace it with any other arbitrary string with no noticeable effect.
Had fun messing around with CSS quite a bit before the revamp, but it’s been a long time, a lot has changed, and almost all of it has drained out of the brain.
Now, just looking for a way to fade the background in the main text blocks. I found the total transparent code, but that’s not what I’m looking for. Right now I have:
The last value in an rgba color is the alpha channel, which will have the same effect as opacity but won't be inherited by child objects (such as the text contained in the wiki page).
Still trying to redirect the default Characters button
Inspect Element reveals the following:
So, what i need, i assume, is CSS to replace the /characters in the href. Question is, HOW?
anyone? Please?
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/
Maybe not CSS specific (though maybe if I cannot get it to work).
I am trying to place three images side by side. In several of my older campaigns, I had rows of portraits on my main page and I would just have to size them to fit but otherwise, they slid next to each other no prob. Since the change of how pics are coded, I have had no-end of issues. It will only ever show the first pic, even if I use the align codes.
What do I have to do now? Any ideas?
For an idea of what I want, here is my old campaign page:
Two ideas not really code dependent 1) use a table, 2) create your multiple images as a single image and upload that. Also should be possible to implement as an image with absolute positioning, if no one gives a better answer before hand I will take a look when I'm on a PC and not my phone! :)
____________
edit
ok assuming you only want to use it on a page or two try this (obviously replacing the URL with the image url you want to use; it looks a bit like this - see the three centered buttons in underneath the 'test text' written in white on this page :- https://practice2.obsidianportal.com/wiki_pages/why
you can do that like this
solution 3
Solution 4
if you decide you want to use this format over and over again, consider making an 'image box' div class that you can put where you want (that is the floating three buttons in a triangle formation on the same page
so in the CCS front panel put something like this (once again slect the urls you need for your back ground, and play around with your positioning, padding and other style commands, dont forget you can make the 'image box' itself invisible as well if thats what you want) ...
@NikMak - Thank you for the ideas but I couldn't get the table concept to work and I do need them to be separate images as I will make buttons out of them.
@ SkidAce - Your layout is perfect, that is what I am trying to achieve. I used to be able to do that and not sure why I cannot now. If I could have your magic code, I would be most appreciative.
I cribbed instruction and code from "Dresden Files Dallas":https://dfd.obsidianportal.com/wikis/css-3 , re: wolfhound. After some pms and such, I modified it for my campaign.
Comments
~Weasel0
A Parade of Black | ShadowRunHack |
Where I play with CSS code
@.campaign-public-layout h1 {color: red;}@
While to turn all h1 headers in your private site would be:
@.campaign-dashboard-layout h1 {color: red;}@
So code to turn all headers in both public and private areas of your campaign red is:
@.campaign-dashboard-layout h1, .campaign-dashboard-layout h2, .campaign-dashboard-layout h3, .campaign-dashboard-layout h4, .campaign-dashboard-layout h5, .campaign-public-layout h1, .campaign-public-layout h2, .campaign-public-layout h3, .campaign-public-layout h4, .campaign-public-layout h5 {color: red;}@
EDIT: Although, honestly, I'm not sure why the "h1, h2, h3, h4, h5" selector didn't work. It might be that there is more specific CSS set in the application, so this might be one of the few good use cases for the !important tag.
.campaign-link,h1,h2,h3,h4,h5,h6
{
color:red !important;
}
The !important tag worked on the public and dashboard side. All except the big giant campaign title that sits on all the dashboard pages.
A curiosity: I have GM only text on my Front page. It keeps vanishing but will display if i re-save it. Any thoughts?
~Weasel0
A Parade of Black | ShadowRunHack |
Where I play with CSS code
@#content a.campaign-link {color: red;}@
As for the disappearing GM Text, I haven't the foggiest idea. I would submit a Help ticket.
With only a few months out of OP, my knowledge of CSS is totally rusty... Who could help me??
Here is my query: on my "adventure log page":https://dark-sun-a-trova.obsidianportal.com/adventure-log, I want to catch the fade out and change the height of each box (to make each adventure banner full).
Thank you
(it seem that my english too is gone rusty, sorry...)
-Pils
"Dark Sun / La Décade des Héros":https://dark-sun-a-trova.obsidianportal.com/: Face the Fire of the Dark Sun... a World ravaged by Sorcery!
-Pils
Dark Sun ● La Décade des Héros : Face the Fire of the Dark Sun... a World ravaged by Sorcery! (CotM - Dec 2012)
Les Royaumes Oubliés : A D&D 5e old school style Forgotten Realms campaign!
(And I'm so soooorry for my poor english...)
@/* ADVENTURE LOG TEST */
.overflow-fade-out {background: none !important;}@
Example "Here":https://unconquered-kingdoms.obsidianportal.com/adventure-log
Unconquered Kingdoms, July 2016 CotM
@/* ADVENTURE LOG TEST */
.adventure-log-post {background-color: transparent; background-image: url(https://db4sgowjqfwig.cloudfront.net/assets/265269/DSF_Emma_paper2.jpg?1385084264); background-repeat: no-repeat; background-size: 100% 100%;}
.adventure-log-post-container .post-date {background-color: transparent; color:green;}
.overflow-fade-out {background: none !important;}
.adventure-log-index .adventure-log-new-container {background: none;}
.adventure-log-show .post-header-container {background-image: url(https://db4sgowjqfwig.cloudfront.net/assets/265269/DSF_Emma_paper2.jpg?1385084264);}@
Unconquered Kingdoms, July 2016 CotM
"CSS Page for Rebuilt":https://a-god-rebuilt.obsidianportal.com/wikis/css
Just trying to help out.
-Pils
"Dark Sun / La Décade des Héros":https://dark-sun-a-trova.obsidianportal.com/: Face the Fire of the Dark Sun... a World ravaged by Sorcery!
-Pils
Dark Sun ● La Décade des Héros : Face the Fire of the Dark Sun... a World ravaged by Sorcery! (CotM - Dec 2012)
Les Royaumes Oubliés : A D&D 5e old school style Forgotten Realms campaign!
(And I'm so soooorry for my poor english...)
blockquote {color:#482200 !important;}
.blockquote {color:#482200 !important;}
.campaign-public-layout blockquote {color:#482200 !important;}
Clearly I'm grasping at straws here - any knowledgeable help here would be appreciated.
Not sure if it makes a difference, but I always use the set names or a three digit code for colour changes (NOTE - i have not tried either of these suggestions, just suggesting things that have worked for me in the past)
e.g. instead fo #482200, try #480 instead?
also may be easier to just try
.campaign-public-layout blockquote {font-color: black;} and see if that works
let me know if either helps!
Is there a way to redirect the Standard Link for the Characters page from the default page to a different page? I've tinkered and toyed with the Character Page on the site for my new campaign I am working on, but it still does not meet my liking and would be much easier if I could take that page out completely with a custom one of ym own.
As always, thanks.
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/
Or is that not the solution your looking for?
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/
I also encountered this problem when the picture codes changed. I think I got around it by RIGHT CLICKING on the picture and using COPY URL and pasting that into the code I had previously used to create the picture link.
twiggyleaf
CURRENT CAMPAIGN: "Mysteria":http://www.obsidianportal.com/campaigns/mysteria - set in Wolfgang Baur’s MIDGARD.
Previous CotM Aug 2012: "Shimring":http://www.obsidianportal.com/campaigns/shimring
"I met a traveller from an antique land....."
CotM May 2016: Mysteria: set in Wolfgang Baur’s MIDGARD.
Previous CotM Aug 2012: Shimring: High Level Multiplanar Campaign
Inner Council Member
........StandardUrlStuff..../ImageName.jpg?1408383774
What is the: "?1408383774" parameter at the end?
It seems to work just fine whether I include that parameter or not. What's the best practice here?
- Eck
In the absence of any reason to get rid of it, I'd leave it intact just in case the devs are currently or plan in the future on using it for something.
Interestingly, you can also replace it with any other arbitrary string with no noticeable effect.
twigs
"I met a traveller from an antique land....."
CotM May 2016: Mysteria: set in Wolfgang Baur’s MIDGARD.
Previous CotM Aug 2012: Shimring: High Level Multiplanar Campaign
Inner Council Member
Also of note, it seems like the character portraits don't get the little parameter. Weird.
The programmer in me tells me to remove extra nonsense that doesn't do anything, but I'll leave it be for now.
I've got my eye on you strange numbers... -.-
- Eck
Now, just looking for a way to fade the background in the main text blocks. I found the total transparent code, but that’s not what I’m looking for. Right now I have:
.main-content-container{ background-color:#FFF; opacity: 0.5 !important}
.campaign-landing-page-container{ background-color:#FFF; opacity: 0.5 !important}
.post-main{ background-color:#FFF; opacity: 0.5 !important;}
But this is also fading the text, which I want strong. It’s just the background I want faded. Any way to do this?
@.main-content-container {background-color: rgba(255,255,255,0.5);}@
The last value in an rgba color is the alpha channel, which will have the same effect as opacity but won't be inherited by child objects (such as the text contained in the wiki page).
Inspect Element reveals the following:
So, what i need, i assume, is CSS to replace the /characters in the href. Question is, HOW?
anyone? Please?
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"2013 Campaign of The Year":http://blog.obsidianportal.com/2013-coty-shadows-over-new-york/
I am trying to place three images side by side. In several of my older campaigns, I had rows of portraits on my main page and I would just have to size them to fit but otherwise, they slid next to each other no prob. Since the change of how pics are coded, I have had no-end of issues. It will only ever show the first pic, even if I use the align codes.
What do I have to do now? Any ideas?
For an idea of what I want, here is my old campaign page:
https://adelaide-jade-regent.obsidianportal.com/wikis/main-page
____________
edit
ok assuming you only want to use it on a page or two try this (obviously replacing the URL with the image url you want to use; it looks a bit like this - see the three centered buttons in underneath the 'test text' written in white on this page :- https://practice2.obsidianportal.com/wiki_pages/why
you can do that like this
solution 3
Solution 4
if you decide you want to use this format over and over again, consider making an 'image box' div class that you can put where you want (that is the floating three buttons in a triangle formation on the same page
so in the CCS front panel put something like this (once again slect the urls you need for your back ground, and play around with your positioning, padding and other style commands, dont forget you can make the 'image box' itself invisible as well if thats what you want) ...
.imagebox {padding:10px;margin:1px; position:absolute !important; z index:-100; right:375px; width:175px; top:-150px; background-image: url("https://db4sgowjqfwig.cloudfront.net/images/2151701/labyrinthV4.jpg"); font-size:bold; ;color:#3F3; font-size:large; padding:1px; border-color:green; border-style:solid; border-width:1px;}
then on the individual wiki pages where you want to use the image box you put on each page something like this
ok, hope that helps, as its about the upper limit of my Web-Fu!
if it does not help, Im sure some one more knowledgeable will be along shortly :)
cheers
Nick
"Unconquered Kingdoms Wiki":https://unconquered-kingdoms.obsidianportal.com/wikis/main-page
if that's what you mean, its a mix of CSS and on page code.
Unconquered Kingdoms, July 2016 CotM
@ SkidAce - Your layout is perfect, that is what I am trying to achieve. I used to be able to do that and not sure why I cannot now. If I could have your magic code, I would be most appreciative.
Here is the CSS portion;
@/* MAIN WIKI MENU BOX */
.tribox {position:relative;left:10px;width:684px;height:122px;padding:0px;margin:0px;margin-bottom:5px;text-align:center;background-color:none;vertical-align:bottom;}
.tribox.left {position:absolute;left:0px;top:3px;width:220px;height:110px;background-color:white;border-style:solid;border-width:2px;background-image:url('http://cdn.obsidianportal.com/assets/160661/BookbacksDark.jpg');}
.tribox.center {position:absolute;left:230px;top:3px;width:220px;height:110px;background-color:white;border-style:solid;border-width:2px;border-color:black;padding:0px;background-image:url('http://cdn.obsidianportal.com/assets/160661/BookbacksDark.jpg');}
.tribox.right {position:absolute;left:460px;top:3px;width:220px;height:110px;background-color:white;border-style:solid;border-width:2px;border-color:black;padding:0px;background-image:url('http://cdn.obsidianportal.com/assets/160661/BookbacksDark.jpg');}
.overtext {position:absolute;top:34%;left:0px;text-align:center;font-size:large;font-weight:bold;text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black, 0px 0px 4px black;width:220px;color:SkyBlue;}
.overtext:hover {color:yellow;}
a.rollover {position:relative;display:block;width:220px;height:110px;text-decoration: none;background:url('http://cdn.obsidianportal.com/assets/165211/GlowingBorderRollover.png');background-color:transparent;}
a.rollover:hover {background-position:-220px 0px;}
@
Unconquered Kingdoms, July 2016 CotM