Raw Source
flyink13 / Pin draft dialogs 

// ==UserScript==
// @name         Pin draft dialogs
// @namespace    http://vk.com/
// @version      0.1
// @author       FlyInk13
// @copyright 2020, flyink13 (https://openuserjs.org/users/flyink13)
// @downloadURL https://openuserjs.org/install/flyink13/Pin_draft_dialogs.user.js
// @updateURL https://openuserjs.org/meta/flyink13/Pin_draft_dialogs.meta.js
// @match        https://*.vk.com/*
// @grant        none
// @license      MIT
// ==/UserScript==

(function code() {
if (typeof ls === 'undefined') return;
if (typeof vk === 'undefined') return;

var coreStyles = `
body .nim-dialog:not(.nim-dialog_deleted).nim-dialog_selected+.nim-dialog {
    border-top: solid 1px transparent;
}

body #im_dialogs .ui_scroll_content {
    display: flex;
    flex-direction: column;
}

body #im_dialogs .ui_scroll_content:before {
    display: block;
    height: 3px;
    color: #777e8c;
    font-size: inherit;
    background: var(--steel_gray_80);
    box-shadow: 0px 0px 0px 1px var(--steel_gray_80);
    line-height: inherit;
    clear: inherit;
    visibility: inherit;
    content: '';
    order: -1;
}

`;

var StyEl = document.getElementById('pin_styles');

if (!StyEl) {
    StyEl = document.createElement('style');
    StyEl.id = 'pin_styles';
    document.body.appendChild(StyEl);
}


function updateStyles() {
    const style = Object.entries(ls.get('im_store_' + vk.id))
        .reduce((style, [key, { txt }], order_id) => {
            const peer_id = key.substr(6);
            if (txt) {
                style += `
                    [data-list-id="${peer_id}"] {
                        order: -${order_id + 2};
                        position: relative;
                    }

                    [data-list-id="${peer_id}"]:after {
                        content: '';
                        display: block;
                        position: absolute;
                        bottom: 7px;
                        right: 15px;
                        width: 18px;
                        height: 18px;
                        background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22m0%200h24v24h-24z%22%2F%3E%3Cpath%20d%3D%22m7.00723148%2015.0072315%201.98547057%201.9854705-.51090487.5109219-2.19710349.4394354c-.15126149.0302534-.25920135-.0705252-.22775495-.2277624l.4394207-2.1971764zm.99998341-1.0000166%207.70239431-7.70264988c.3948871-.39490016%201.0298385-.39805257%201.4195204-.00835778l.5742749.57429394c.3953567.3953699.38594%201.02525678-.0083575%201.41956744l-7.70236153%207.70261688z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E);
                        background-position: center;
                        background-color: var(--steel_gray_200);
                        background-size: 16px;
                        background-repeat: no-repeat;
                        border-radius: 50px;
                        z-index: 2;
                    }

                    .nim-dialog[data-list-id="${peer_id}"] .nim-dialog--unread_container {
                        right: 21px;
                    }
                `
            }
            return style;
        }, '');

    StyEl.innerHTML = style ? coreStyles + style : '';
}

window.addEventListener('storage', updateStyles);
updateStyles();
})()