craftplacer.moe Me • Blog • Diary • Cookbook • Things people say about me • About me Favorites • Extensions • Music World Wide Web • Directory • Services Projects • Kaiteki • Contributions • Web design • Pleroma styles Guestbook

Pleroma User Styles

Just a little Pleroma-FE adjustments I did while being on there. Check the Git repostiory here.

Compact navigation bar

This style is broken with the newest release of Pleroma-FE!

Before	After

Short user info

Before	After

Better autocompletion highlight

Before	After

Sliding NSFW warning

Source Code

.nsfw-placeholder:hover > .image-attachment {
    opacity: 0;
}

.nsfw-placeholder:hover:after {
    background: url("https://udongein.xyz/media/f211cd82149853911fd71d888a188f5d42e9f88a13973c307fb4c1a424bfa9ff.png");
    background-position: right;
    
    display: flex;
    width: 100%;
    height: 100%;
    position:absolute;
    top: 0;
    
    content: "";
    pointer-events: none;
    
    animation-name: slide;
    animation-duration: 2s;
    animation-direction: normal;background-size: cover;
}

@keyframes slide {
  from {background-position-x: 0%;}
  to {background-position-x: 100%;}
}