devblogs.microsoft.com by killyouxz

/* ==UserStyle==
@name         devblogs.microsoft.com
@version      20220708.17.58
@namespace    userstyles.world/user/killyouxz
@description  Work in progress for microsoft devblogs dark theme(inspired by dracula dark theme)
@author       killyouxz
@license      No License
==/UserStyle== */

@-moz-document url-prefix("https://devblogs.microsoft.com/") {
body{
    background-color: #5d6072!important;
}
header>div, footer, #main > article > div.postcontent, .entry-area, .card, .context-uhf .theme-light, button, li.nested-menu li, table, td, th, .post-card, article.comment header, div.comment-content, ul.children article.comment, article.search-main, div.sidebar-container {
    background-color: #282a36!important;
}
li.nested-menu li:hover a, div.dropdown-menu a:hover{
    background-color: #6272a4!important;
}
#main > article > div.postcontent, .entry-area, .card, footer div.c-heading-4, span, .context-uhf .theme-light, button, .post-desc, article.search-main .land-desc, .author-wrapper-section, div.comment-content, i.fa-github, .gist-meta{
    color: #f8f8f2!important;
}
body pre.prettyprinted,.commentlist pre.prettyprint, .commentlist pre.prettyprinted, footer>div.c-uhff-base, blockquote, div.devblogs-nicescroll, .author-wrapper-section, div.related-postssection{
    background-color: #44475a!important;
}
div.entry-image, img.lp-default-image-blog,.commentlist pre.prettyprint, .commentlist pre.prettyprinted, blockquote{
    width: fit-content!important;
    max-width: fit-content!important;
}

header.page-header{
    padding: 5px 10px!important;
}
img.lp-default-image-blog{
    max-width: 350px!important;
}
span.pun{
    color: #6cfde9!important
}
span.typ{
    color: #cba7ff!important;
}
span.kwd{
    color: #82bcf7!important;
}
span.pln{
    color: #0599ed!important;
    font-weight: bold!important;
}
span.lit{
    color: #ffd067!important;
}
span.str{
    color: #f2b19a!important;
}
span.tag{
    color: #ff5464!important;
}
span.com{
    color: #01cf01!important;
}
/*#f2b19a!important;*/
a{
    color: #8BE9FD!important;
    text-decoration: none!important;
    background-color: transparent!important;
}
table, td, th{
    border: 2px solid #6272a4!important;
}
ul li, time, div.entry-meta>p{
    color:#c8ffd4!important;
}
strong{
    color: #bd93f9!important;
    font-size: large!important;
}
h1,h2,h3,h4,h5,h6{
    color: #fcb900!important;
    margin-left: 10px!important;
}
span.author-name{
    color: #18a63c!important;
}
body pre.prettyprinted{
    word-wrap: break-word!important;
    white-space: break-spaces!important;
}
div.related-postssection{
    margin: 0 -15px;
}
.gist-file{
    padding:0 5px!important;
}
.gist-data{
    border: none!important;
}
div.row.related-articles{
    margin: 0;
}
div#comments, div.related-postssection{
    padding: 20px!important;
}
ul.children{
    margin: 5px;
    margin-right: 10px!important;
    border-radius: 20px!important;
    padding-top: 10px!important;
}
.commentlist li ul.children article{
    border: none!important;
    padding: 10px;
    margin-top: 10px!important;
}
.commentlist li ul.children li article.comment{
    border-radius: 20px!important;
    margin-bottom: 10px!important;
    margin-left: 30px;
    margin-right: -10px;
}
li.comment>article.comment{
    padding-top: 10px!important;
    margin: 5px;
}
li.depth-1>article.comment{
    margin-right: 10px;
    margin-bottom: 5px; 
}
.commentlist li.clearfix header{
    border-radius: 20px!important;
}
.commentlist li header{
    border-radius: 20px 20px 0 0!important;
}
.commentlist li footer{    
    border-radius: 0 0 20px 20px!important;
}
footer#uhf-footer a{
    font-size: 0.8rem!important;
}
i.fa-twitch{
    color: #6441A4!important;
}
i.fa-facebook{
    color: #fff!important;
    width: calc(100% + 5px)!important;
    max-width: 28px;
    background-color: #0165E1!important;
    border-radius: 20px!important;
    height: 100%!important;
    padding: 5px!important;
    text-align: center;
}
i.fa-instagram{
    color: #C13584;
}
i.fa-youtube-play{
    color: #f00!important;
}
i.fa-twitter{
    color: #1DA1F2!important;
}
i.fa-rss{
    color: #f26522!important;
}
i.fa-linkedin{
    color: #fff!important;
    width: calc(100% + 10px)!important;
    max-width: 25px!important;
    background-color: #0077b5!important;
    border-radius: 5px!important;
    padding: 3px 5px 5px!important;
    text-align: center;
}
i.fa-globe{
    color:#0077b5;
}
i.hvr-pop{
    max-width: 42px!important;
}
i.fa-stack-overflow{
    color:#F48024;
}
.c-uhf-menu ul, div.dropdown-menu{
    margin-top: 0px!important;
    border-width: 1px!important;
    border-style: solid!important;
    background-color: #282a36!important;
    border-color: #6272a4!important;
}
.c-uhfh>div:first-child .c-uhf-menu>button[aria-expanded="true"]{
    background: #282a36!important;
    border-color: #282a36!important;
}
.c-uhfh a:not(.x-hidden-focus):focus, .c-uhfh button:not(.x-hidden-focus):focus, .c-uhfh span:not(.x-hidden-focus):focus, .c-uhfh :not(.x-hidden-focus) a:focus, .c-uhfh :not(.x-hidden-focus) button:focus, .c-uhfh :not(.x-hidden-focus) span:focus, .c-uhfh .c-me .msame_Header:focus{
    outline-color: #282a36!important;
}
div#featuredone div.container, #featuredthree, ul.children, .gist, .gist-meta, .gist-data{
    background-color: transparent!important;
}
#main > article > div.postcontent font{
    font-size: inherit!important;
    color: inherit!important;
}
p.nocomments{
    color: #c8ffd4!important
}
article.search-main{
    border: 1px solid #d7d7d7!important;
}
.tag_separator{
    border-top: 2px solid white!important;
}
div.devblogs-nicescroll{
    height: 210px!important;
}
div.devblogs-nicescroll ul{
    margin-left: 10px!important;
    margin-top: 5px!important;
    padding-bottom: 5px!important;
}
main#main:before, ul.commentlist li.comment.depth-1:before{    
    position: absolute!important;
    content: ''!important;
    float: left!important;
    height: 100%!important;
    left: -15px!important;
    width: calc(100% + 30px)!important;
    z-index: -1!important;
    box-shadow: 2px 2px 8px #44475a!important;
    border-radius: 4px!important;
}
ul.commentlist li.comment.depth-1:before{
    background-color: #44475a!important;
}
#single-wrapper article.addtoanyshare:before {
    box-shadow: none!important;
}
.container{
    max-width: 1550px!important;
}
.postcontent{
    padding-left: 10%!important;
    padding-right: 10%!important;
}
div.table-responsive table{
    width:  100%!important;
    height: fit-content!important;
}
td, th{
    min-width: fit-content!important;
    width: fit-content!important;
}
}