Danbooru

Read the rules before proceeding!

Topic: Custom CSS Thread

Posted under General

kittey

This CSS snippet places a striped background behind images. Not only will it highlight that an image has a transparent background, but it will also let you see transparency surprises such as post #1496955, post #2540465 and post #2552285. The downside is that transparent images that look best on white background now have a striped background. It only works with full-size posts because thumbnails and samples are generated without transparency information. The more common checkerboard pattern requires stacked gradients and seems to render somewhat slowly.

#image {background-image:linear-gradient(45deg, #a0a0a0 25%, #909090 25%, #909090 50%, #a0a0a0 50%, #a0a0a0 75%, #909090 75%, #909090); background-size:50px 50px}

BrokenEagle98 said:
Nothing ground breaking about the following CSS, but it does remove the ominous feeling I get whenever I see that huge "Delete account" link...

Thanks. I feel the same.

  • ID: 134566
  • Permalink
  • hazknight

    kittey said:

    The more common checkerboard pattern requires stacked gradients and seems to render somewhat slowly.

    #image { background-image: linear-gradient(45deg, #AAA 25%, transparent 25%, transparent 75%, #AAA 75%), linear-gradient(45deg, #AAA 25%, transparent 25%, transparent 75%, #AAA 75%); background-size: 65px 65px; background-position: 0 0, 32px 32px; background-color: #808080; }

    This works fine and fast for me.

  • ID: 134583
  • Permalink
  • sarusa

    BrokenEagle98 said:
    Nothing ground breaking about the following CSS, but it does remove the ominous feeling I get whenever I see that huge "Delete account" link...

    Aside: There's a French term, L'appel du vide (call of the void) for when you're on the edge of a giant drop and, even though you're not the least bit suicidal, you momentarily contemplate what would happen if you threw yourself off.

  • ID: 134591
  • Permalink
  • DeusExCalamus

    How would one remove the new 'favorite' button below images? I think it's superfluous with the existing option in the sidebar.

  • ID: 135437
  • Permalink
  • nonamethanks

    DeusExCalamus said:

    How would one remove the new 'favorite' button below images? I think it's superfluous with the existing option in the sidebar.

    form#add-fav-button {display: none;}
    form#remove-fav-button {display: none;}

    works for me.

    Updated by nonamethanks

  • ID: 135438
  • Permalink
  • DeusExCalamus

    nonamethanks said:

    form#add-fav-button {display: none;}
    form#remove-fav-button {display: none;}

    works for me.

    removed it via adblocker \o/

  • ID: 135439
  • Permalink
  • kittey

    southrim said:

    Is there a method to open image pages without the tag/s being appended to the URL? For instance:

    Danbooru doesn’t have a setting for that, but you could do it by writing a user script for it.

    You asked in the custom CSS thread, but it’s definitely not possible with CSS.

  • ID: 136184
  • Permalink
  • southrim

    kittey said:

    Danbooru doesn’t have a setting for that, but you could do it by writing a user script for it.

    You asked in the custom CSS thread, but it’s definitely not possible with CSS.

    Okay. I'm functional at implementing existing scripts but not knowledgeable about different categories for them or writing them myself. I thought it might not be a CSS thing, but this was the most relevant thread I saw on the forum.

    BrokenEagle98 said:

    Check out the Javascript I added in forum #136251 which removes the trailing search parameters like you asked.

    Checking it out now, thanks.

  • ID: 136388
  • Permalink
  • poppoko

    kounishin said:

    Here's a version that will collapse the list of blacklisted tags entirely, until you mouse over the heading; it'll save some space, especially if you have a lot of things blacklisted:
    [expand=Collapsing blacklist]
    #blacklist-box ul { display: none; }
    #blacklist-box:hover ul { display: block; }

    [/expand]

    You can achieve the same effect with a single rule:

    #blacklist-box:not(:hover) ul { display: none; }
  • ID: 139203
  • Permalink
  • nonamethanks

    Does anyone know of a css trick to make the information box for a post (specifically the source link) display at the top of the sidebar, above the tags?

  • ID: 139217
  • Permalink
  • kittey

    nonamethanks said:

    Does anyone know of a css trick to make the information box for a post (specifically the source link) display at the top of the sidebar, above the tags?

    You could try to fiddle around with what evazion posted in forum #139137. A while ago, I tried to move the information box to the top with floating objects and margins/padding/whatever and failed horribly. A JS solution would easily work for simply moving things around, but the event handlers for post voting and showing favorited users would break.

  • ID: 139219
  • Permalink
  • evazion

    Yes, the same trick from forum #139137 works here too. Flexboxes are the key to rearranging things without having to resort to Javascript.

  • ID: 139220
  • Permalink
  • Chiera

    Is there a CSS to get rid of these boxes around each post?

  • ID: 139279
  • Permalink
  • evazion

    /* Remove borders from forum posts. */
    div.list-of-forum-posts article {
      border: none;
      box-shadow: none;
    }
    
  • ID: 139282
  • Permalink
  • Chiera

    evazion said:

    /* Remove borders from forum posts. */
    div.list-of-forum-posts article {
      border: none;
      box-shadow: none;
    }
    

    Thanks a lot :3.

  • ID: 139283
  • Permalink
  • tapnek

    Is there CSS code to prevent the upload page from fetching from the source when I copypaste a link in the source field?

  • ID: 139694
  • Permalink
  • kittey

    tapnek said:

    Is there CSS code to prevent the upload page from fetching from the source when I copypaste a link in the source field?

    That’s being done with JavaScript. CSS has no influence on it. It’s probably possible with a user script, but I haven’t seen one around yet.

  • ID: 139698
  • Permalink