embed-visualizer.css

serverInfo {
    display:none
}

userInfo {
    display:none
}

@font-face {
    font-family: Whitney;
    src: url("https://discordapp.com/assets/6c6374bad0b0b6d204d8d6dc4a18d820.woff");
    font-weight: 300;
}

@font-face {
    font-family: Whitney;
    src: url("https://discordapp.com/assets/e8acd7d9bf6207f99350ca9f9e23b168.woff");
    font-weight: 400;
}

@font-face {
    font-family: Whitney;
    src: url("https://discordapp.com/assets/3bdef1251a424500c1b3a78dea9b7e57.woff");
    font-weight: 500;
}

@font-face {
    font-family: Whitney;
    src: url("https://discordapp.com/assets/be0060dafb7a0e31d2a1ca17c0708636.woff");
    font-weight: 600;
}

@font-face {
    font-family: Whitney;
    src: url("https://discordapp.com/assets/8e12fb4f14d9c4592eb8ec9f22337b04.woff");
    font-weight: 700;
}

body {
    font-family:Whitney,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size:17px;
    background-color:#36393e;
    color: #dcddde;
    display: block;
}

a {
    text-decoration :none;
    color: #0096cf;
}

a:hover {
    text-decoration: underline;
}

/* img {
    object-fit:contain
} */

.markdown {
    white-space: pre-wrap;
    line-height: 1.3;
    overflow-wrap: break-word;
}

.spoiler {
    border-radius:3px
}

.quote {
    border-left:4px solid;
    border-radius:3px;
    margin:8px 0;
    padding-left:10px
}

.code {
    background-color: #282a2e!important;
    padding:2px;
    border-radius:3px;
    font-size:85%;
    font-family:Consolas,"Courier New",Courier,monospace
}

.codeblock {
    border-color: #282b30!important;
    color: #839496!important;
    background-color: #2f3136!important;
    margin-top: 4px;
    padding: 8px;
    border: 2px solid;
    border-radius: 5px;
    font-family:Consolas,"Courier New",Courier,monospace
}

.emoji {
    width: 1.45em;
    height: 1.45em;
    margin: 0 1px;
    vertical-align: -.4em;
}

.emoji-small {
    width: 1rem;
    height: 1rem;
}

.emoji-large {
    width: 3.2rem;
    height: 3.2rem;
}

.message-group {
    display:flex;
    /* margin:0 10px; */
    margin: auto;
    padding:15px 0;
    width: 60vw;
}

@media screen and (max-width: 700px) {
    .message-group{
        margin: 0
    }
}

.author-avatar-container {
    flex:0;
    width:40px;
    height:40px
}

.author-avatar {
    border-radius:50%;
    height:40px;
    width:40px
}

.messages {
    flex:1;
    
    /* min-width:50%; */
    margin-left:20px
}

.author-name {
    font-size:1em;
    font-weight:500
}

.message {
    padding:2px 5px;
    margin-right:-5px;
    margin-left:-5px;
    background-color:transparent;
    transition:background-color 1s ease
}

.message-image {
    max-width:400px;
    max-height:250px;
    border-radius:3px
}

.content {
    font-size:.9375em;
    word-wrap:break-word
}

.edited-timestamp {
    margin-left:3px;
    font-size:.8em
}

.attachment-thumbnail {
    margin-top:5px;
    max-width:50%;
    max-height:500px;
    border-radius:3px
}

/* Embed*/

.embed {
    margin-top:5px;
    display:flex;
    max-width:520px
}

.embed-color {
    flex-shrink:0;
    width:4px;
    border-top-left-radius:3px;
    border-bottom-left-radius:3px
}

.embed-content-container {
    display:flex;
    flex-direction:column;
    padding:8px 10px;
    border:1px solid;
    border-top-right-radius:3px;
    border-bottom-right-radius:3px
}

.embed-content {
    width: 100%;
    display: flex
}

.embed-text {
    flex: 1;
}

.embed-author {
    max-width: 512px;
    display:flex;
    align-items:center;
    margin-bottom:5px;
}

.embed-author a {
    color: #fff
}

.embed-author-avatar {
    width: 20px;
    height: 20px;
    margin-right: 9px;
    border-radius: 50%
}

.embed-author-name {
    font-size:.875em;
    font-weight:600
}

.embed-author-provider {
    font-size: 13px;
}

.embed-author a:hover {
    text-decoration: underline #dcddde;
}

.embed-title {
    margin-bottom: 4px;
    font-size: .875em;
    font-weight: 600;
    max-width: 512px;
}

.embed-description {
    font-weight:500;
    font-size:14px;
    max-width: 512px;
}

.embed-fields {
    display: flex;
    flex-wrap: wrap;
}

.embed-field {
    min-width: 30%;
    width: 100%;
    margin: 1.1%;
    word-break: break-all;
}

.embed-field.field-inline {
    width: 30%;
    flex-grow: 1;
}

.embed-field-name {
    margin-bottom:4px;
    font-size:.875em;
    font-weight:600
}

.embed-field-value {
    font-size:.875em;
    font-weight:500
}

.embed-thumbnail {
    flex:0;
    margin-left:20px;
    max-width:80px;
    max-height:80px;
    border-radius:3px
}

.embed-image-container {
    margin-top:10px
}

.embed-image {
    max-width:400px;
    max-height:250px;
    border-radius:3px
}

.embed-footer {
    max-width: 512px;
    margin-top:10px
}

.embed-footer-icon {
    margin-right:4px;
    width:20px;
    height:20px;
    border-radius:50%;
    vertical-align:middle
}
.embed-footer-timestamp,
.embed-footer-text {
    font-weight:500;
    font-size:.75em
}

.reactions {
    display:flex
}

.reaction {
    display:flex;
    align-items:center;
    margin:6px 2px 2px;
    padding:3px 6px;
    border-radius:3px
}

.reaction-count {
    min-width:9px;
    margin-left:6px;
    font-size:.875em
}

.bot-tag {
    margin-left:.3em;
    background:#5865F2;
    color:#fff;
    font-size:.625em;
    padding:1px 2px;
    border-radius:3px;
    vertical-align:middle;
    line-height:1.3;
    position:relative;
    top:-.1em
}

.bot-tag svg {
    vertical-align:middle;
}

.spoiler {
    background-color:rgba(255,255,255,.1)
}

.quote {
    border-color: #4f545c;
}

.mention {
    color:#7289da;
    /* background:rgba(114, 137, 218, .1); */
    background:rgba(72, 80, 109, 0.473);
    border-radius: 3px;
    padding: 0 2px;
    font-weight: 500;
}

.mention-role {
    border-radius: 3px;
    padding: 0 2px;
    font-weight: 500;
}

.info__guild-name {
    color:#fff
}

.info__channel-name {
    color:#fff
}

.info__channel-topic {
    color:#fff
}

.author-name {
    color:#fff
}

.timestamp {
    font-size: 12px;
    vertical-align:middle;
    color:rgba(255,255,255,.2)
}

.message--highlighted {
    background-color:rgba(114,137,218,.2)!important
}

.message--pinned {
    background-color:rgba(249,168,37,.05)
}

.edited-timestamp {
    color:rgba(255,255,255,.2)
}

.embed-content-container {
    background-color:rgba(46,48,54,.3);
    border-color:rgba(46,48,54,.6)
}

.embed-author-name {
    color:#fff
}

.embed-author-name-link {
    color:#fff
}

.embed-title {
    color:#fff
}

.embed-description {
    color:rgba(255,255,255,.6)
}

.embed-field-name {
    color:#fff
}

.embed-field-value {
    color:rgba(255,255,255,.6)
}

.embed-footer {
    color:rgba(255,255,255,.6)
}

.reaction {
    background-color:rgba(255,255,255,.05)
}

.reaction-count {
    color:rgba(255,255,255,.3)
}

/* Message quote */

.message-quote {
    margin-left: 5px;
    font-size: .75em;
    color: dimgrey;
}

.message-quote-content {
    margin-left: 5px;
    cursor: pointer;
}

.message-quote-author {
    display: flex;
    align-items: center;
    /* margin-bottom: 5px; */
}

.message-quote-author-avatar {
    width: 20px;
    height: 20px;
    margin-right: 9px;
    margin-left: 7px;
    border-radius: 50%;
}

.message-quote-author-name {
    font-size:.875em;
    font-weight:600;
    /* color: dimgrey; */
}