NikMak
hi all,
I am putting a table into one of my wiki pages (in all likelihood it will be the only table in the campaign web site, but i expect it to get a fair amount of traffic as the campaign develops) - and was hoping for a few suggestions on how to go about it.
here is what i have so far, and i dont much like it!
https://the-great-pendragon.obsidianportal.com/wikis/groups-and-nations
please, when offering your suggestion, keep in mind that I am very lazy, and want to get away with as little work as possible! :)
Cheers
Nick
Comments
@table{width:85%; text-align: center;}.@
I would also think about creating more contrast between the background and the text color. Maybe darken the background and desaturate the text (palegreen or mediumaquamarine might be good for the text)?
that hasn't worked very well for me (using chrome FYI)... the command displays on the screen no matter where I place it (before the '' command, in the table command or just after it)... suggestions?
additionally - how do i display boarders on tables?
as for the link colour - I have been messing around with that for a while, I welcome all suggestions on that as well. But I think the current 3F3 works just as well as the 9F9 (pale green) and the 6DA (Medium aqua) - they are all three equally illegible! ;)
--------
edit (17:22 30/07/2014 Zulu time):
this is the new command to add a little life to the table; its starting to get better - still ugly, but getting better.
The simpler is to throw some inline CSS into the statement. Something like this:
@@
However if you want to do more with your table(s), you'll want to make it custom CSS for your campaign. A statement along the lines of:
@.campaign-public-layout #content table {width:85%; text-align: center;}@
If you want cell borders and some additional cell padding (always looks nice) as well, use this instead:
@.campaign-public-layout #content table {width:85%; text-align: center; border-collapse: collapse;}
.campaign-public-layout #content td, th {border: 1px solid green; padding: 1em;}@
I'm not 100% on the selectors I used above (haven't gotten a chance to test).
also if i do a set of CCS commands for the table, is that like a div call kind of command, so i need to call the 'table' as: div style="table" ?
Cheers
Nick
CSS is typically stored in a separate file from the webpage called a stylesheet. Obsidian Portal lets Ascendant users add custom CSS statements to the stylesheet for their campaign under Settings > Advanced > Custom CSS. So if you have access to this feature, you could just copy and paste those lines into that field and save. This is handy because it lets you apply styling across many elements across your campaign without modifying what you have on individual pages.
The other way to use CSS is called "inline" CSS, where you are using HTML code (such as table, div, etc...) and add the "style=" statement inside the tag. Its quick and easy, and also the only option if you aren't an Ascendant member, but the downside is that you have to repeat the code every time you want to use it anywhere in your campaign (and only where you can add/edit HTML elements).
Hopefully helpful?
EDIT: -You know, if you aren't worried about blocking off part of the background image, you could set the "background-color" property on the table. That would help with the legibility. Something like this would be the inline CSS:-
@@
-I'd still recommend switching to a less saturated green for the links, but that's just my personal taste.-
Nevermind, works on the table cells so inline would be a pain to set up.
https://the-great-pendragon.obsidianportal.com/wikis/groups-and-nations?campaign_id=the-great-pendragon
also it turns out I do have one other table... slap bang on my home page! its so long since i messed with i forgot i used a table format. hey ho; as usual i fix one thing and break another! Any suggestion on how to align my nav buttons on the home menu to 'centre' ? it may be sleep deprivation, but I cant seem to figure it out!
https://the-great-pendragon.obsidianportal.com/wikis/home-page
ok, night all I will check back tomorrow
Nick
------
Edit 11:36 (31/07/2014) zulu time
changed the fill from parchment to chainmail
Just trying to help out.
Just trying to help out.
what does everyone think of the chain effect in the tables? I think the one in the 'groups' column works ok, but i think the front page one looks a bit naff...
--------
on an unrelated topic, I have finally started reformatting character portraits for the new (N)PC layout I'm planning - its a big job but I'm very pleased with the overall look of the things ( https://practice2.obsidianportal.com/characters ), once ive got it nailed and have converted all portraits to the new format I will set it up on the main KAP character pages... should only take about a year ;)
Basically, on the page you would add a "class=" statement into the table tag, like so:
@@
And then in the campaign CSS, modify the selector with the specific class, like this:
@.campaign-public-layout #content table.classname@
Above is pseudo-code.
*
For the every other line thing, I recall the Reforge added some default formatting to tables like this. I don't recall who formulated this code, but the fix I think was this:
@#content tr:nth-child(even) {background-color: transparent;}@
Should be suitable for copypasta.
@/* TABLE STANDARDS */
table {margin:0px auto;}
#content table{background-color:#white; border-style:solid; border-color:#769143;}
#content tr:nth-of-type(1){background:#769143;}
#content tr:nth-child(even) {background-color:#ddd}
#content table {border-collapse:collapse;}@
"Example":https://unconquered-kingdoms.obsidianportal.com/wikis/reactions-and-diplomacy
Unconquered Kingdoms, July 2016 CotM
---------
EDIT 19:38 (01/08/2014) Zulu time
hmmm, thats quite a versatile way of doing thing; i will play around with it and see what happens; many thanks :)
fyi - the '#content tr:nth-child(even) {background-color:transparent}' goes solid white instead of transparent for me
I've been playing with some of the suggesttions above for "my own page":https://morwindl.obsidianportal.com/wikis/warden-of-ryndanhaven
Can any body help me with why there is such a GIANT space between my text and the start of my table? The code looks like
@* Skill points per level: 6 +INT modifier.
.....
@
Regards,
-bort
"Morwindl":http://morwindl.obsidianportal.com
Campaign of the Year - 2018
Regards,
-bort
"Morwindl":http://morwindl.obsidianportal.com
Campaign of the Year - 2018
I changed:
@Listen, Ride, Search, Sense Motive, Spot, Survival, Swim, Tumble, Use Rope.
* Skill points per level: 6 +INT modifier.
*Level**BAB**Fort**Refl**Will**Special*@
To:
@Listen, Ride, Search, Sense Motive, Spot, Survival, Swim, Tumble, Use Rope.
* Skill points per level: 6 +INT modifier.
*Level**BAB**Fort**Refl**Will**Special*@
As Thorvaldr suggested, which helped a bunch, but code inspection still showed a br in there. So I changed again to:
@Listen, Ride, Search, Sense Motive, Spot, Survival, Swim, Tumble, Use Rope.
* Skill points per level: 6 +INT modifier.
*Level**BAB**Fort**Refl**Will**Special*@
Bringing the first TR up onto the same row as my TABLE open did the trick! So much for coding conventions of the last 20 years for me! ;-)
-bort
"Morwindl":http://morwindl.obsidianportal.com
Campaign of the Year - 2018