Comments

• 

  Abersade

  Posts: 629 June 2024

  From: https://abersade-testbed.obsidianportal.com/wikis/css-wiki-pages

  
  This example sets the width, border, and background image for every standard wiki page. Note that this does not apply to the Front Page, Character page, Items page, or Adventure Logs.
  /* Width, Border, and Background Image for All Wiki Pages */
  /* width */
  .wiki-page {width: 100%;}
  /* border and background image */
  .wiki-page {
  background-color: transparent;
  border-style: solid;
  border-width: 25px;
  border-image: url(https://db4sgowjqfwig.cloudfront.net/campaigns/277520/assets/1236156/SK-WikiBackground.png?1644863096) 55 fill repeat;}
  .campaign-landing-show .campaign-landing-page-container {background-color: transparent;}

  In this example you would want to, at a minimum, adjust the border-image line so that it contains the URL for the image that you want to use. This way of styling the image is best used where you want the background image to tile smoothly. To adjust the tiling, change the number at the end of the border-image line, the lower the number the larger the tiles within the image will be. Adjusting the border-width line may be needed as well to achieve whatever look that you are going for.

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  Abersade

  Posts: 629 June 2024

  Here is the example code for the Front page:

  
  /* this is what creates the autoscaling background image of the Home page */
  .campaign-landing-show .campaign-landing-page-container {
  background-color: transparent;
  border-style: solid;
  border-width: 35px;
  border-image: url(https://db4sgowjqfwig.cloudfront.net/campaigns/191667/assets/896244/FE-Wiki_Backgroundv5.png?1535813466) 35 fill repeat;}

   

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  Abersade

  Posts: 629 June 2024

  The characters page can get pretty fancy, instead of posting a bunch of related codeblocks I'll direct you here instead: https://abersade-testbed.obsidianportal.com/wikis/css-characters

   

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  Abersade

  Posts: 629 June 2024

  For the basics regarding CSS, I recommend W3 schools. A quick primer can be found here though: https://abersade-testbed.obsidianportal.com/wikis/css-etiquette

   

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  vadercomplex

  Posts: 267 June 2024

  Do you still need help with this one friend, @ThoRadia? :~) 

  Obsidian Portal Support Druid | [email protected]
• 

  Abersade

  Posts: 629 June 2024

  I am a stupidface sometimes and misread what the ask was. Working on actually answering ThoRadia's actual question of how to change the color. Please standby.

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  Abersade

  Posts: 629 June 2024

  Alright, I went with a darker (but not super dark) gray for this, https://www.color-hex.com/color/5b5b5b

  The following code will change every white background and fade out effect that I could find to that color.

  
  .sidebar-adventure-log-neighbors .neighbor-post .post-column, .adventure-log-show .post-header-container, .adventure-log-show .post-main, .adventure-log-show .post-comments, .adventure-log-index .adventure-log-new-container, .adventure-log-index .adventure-log-post, .character-show .main-content section, .item-show .main-content section, .character-index.campaign-public-layout .content-list-item, .item-index.campaign-public-layout .content-list-item, .character-index.campaign-public-layout .content-quick-search, .item-index.campaign-public-layout .content-quick-search, .campaign-landing-show .campaign-landing-page-container, body.campaign-public-layout .post-section.post-main {background-color: rgb(91, 91, 91);}
  .adventure-log-index .overflow-fade-out, .character-index.campaign-public-layout .content-list-item .quick-description .right-side-fade-out, .item-index.campaign-public-layout .content-list-item .quick-description .right-side-fade-out {background: linear-gradient(to right, rgba(255, 255, 255, 0), rgb(91, 91, 91));}

   

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  Abersade

  Posts: 629 June 2024

  @ThoRadia: It's not notated/commented and it's fairly long, so if you need help with any of that please let me know. I've added this snippet to my CSS help site as well, with comments if interested, found here about 2/3 of the way down the page: https://abersade-testbed.obsidianportal.com/wikis/css-general

   

  GM of Stream of Kairos - 2025 Campaign of the Year

  GM of Rise of the Durnskald: Wrath of the Fallen Goddess - February 2016 CotM

  GM of Core: The Ashes of Alcarna - April 2020 CotM

  Need CSS Help? It may be covered here: Abersade's CSS Hub
• 

  vadercomplex

  Posts: 267 June 2024

  Let us know if that works for you friend! @thoradia

  Thanks for all your help, you're appreciated! :~) @abersade

  Obsidian Portal Support Druid | [email protected]