body { background-color: #313338; color: #dcddde; font-family: 'Segoe UI Emoji', 'Whitney', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; margin: 0; padding: 0; } @font-face { font-family: 'WhitneySemibold'; src: url('https://kevlarx.xyz/bundle/WhitneySemibold.otf') format('opentype'); font-weight: 500; font-style: normal; } @font-face { font-family: 'Whitney'; src: url('https://kevlarx.xyz/bundle/whitneylight.otf') format('opentype'); font-weight: 400; font-style: normal; } *, *::before, *::after { box-sizing: border-box; } .title { font-size: 24px; font-weight: bold; text-align: center; margin: 20px 0; } .message-group { margin-bottom: 20px; padding: 0; } .message { display: flex; align-items: flex-start; padding: 10px 0px 3px 12px; position: relative; height: auto; border-radius: 5px; transition: background-color 0.3s; } .message:hover, .inner.message:hover, .discord-replied-message:hover{ background-color: #2e3035; } .avatar, .discord-replied-message-avatar { width: 40px; height: 40px; border-radius: 50%; margin-right: 12px; flex-shrink: 0; } .content-container, .inner.message .content-container { flex: 1; } .author, .inner.message .author { font-weight: 500; color: #fff; margin-bottom: 5px; display: flex; align-items: center; } .timestamp, .inner.message .timestamp { font-size: 12px; color: #72767d; margin-left: 8px; } .mention { color: #C9CDFB; background-color: hsl(235 calc(1 * 85.6%) 64.7%/0.3); padding: 0px 4px; border-radius: 3px; margin-bottom: 2px; display: inline-block; } .embed { border-radius: 5px; padding: 14px 10px 10px 15px; background-color: #2B2D31; border-left: 4px solid; max-width: 600px; word-wrap: break-word; display: inline-block; } .embed-title { font-weight: 100; font-size: 16px; color: #fff; font-family: 'WhitneySemibold'; margin-bottom: 10px; } .embed-description { font-size: 14px; line-height: 1.4; word-wrap: break-word; font-family: 'Whitney'; } .embed-footer { font-size: 12px; display: flex; font-weight: 300; align-items: center; padding: 10px 0 10px 0; font-family: 'WhitneySemibold'; } .embed-footer img { vertical-align: middle; margin-right: 5px; } .embed-author { display: flex; align-items: center; margin-bottom: 10px; } .embed-author img { vertical-align: middle; border-radius: 50%; margin-right: 10px; } .embed-image, .embed-thumbnail { margin: 10px 0; } .embed-image img, .embed-thumbnail img { max-width: 100%; border-radius: 4px; } .embed-field { margin-top: 10px; } .embed-field strong { display: block; color: #fff; margin-bottom: 5px; } .embed-field span { color: #b9bbbe; } .discord-button { display: inline-block; padding: 8px 16px; margin-top: 10px; background-color: #5865f2; color: #fff; border-radius: 3px; text-align: center; font-weight: 500; cursor: pointer; text-decoration: none; } .discord-button:hover { background-color: #4752c4; } a { color: #00b0f4; text-decoration: none; } a:hover { text-decoration: underline; } .app-label { background-color: #5865f2; color: white; font-size: 12px; padding: 2px 4px; border-radius: 3px; margin-left: 6px; font-weight: 500; } .discord-replied-message { display: flex; flex-direction: column; gap: 10px; position: relative; padding: 10px 0px 5px 12px; } .discord-replied-message:before { content: ''; display: block; position: absolute; top: 17px; left: 30px; width: 30px; height: 18%; border-left: 2px solid #4f545c; border-top: 2px solid #4f545c; border-top-left-radius: 6px; } .reply-header { font-size: 14px; color: #b9bbbe; margin: 0 0 0 60px; display: flex; flex-direction: row; align-items: center; } .reply-content { display: flex; } .reply-text { display: flex; flex-direction: column; justify-content: space-between; } .reply-text .author { display: flex; gap: 5px; width: 100%; flex-direction: row; align-items: center; margin-bottom: 5px; } .reply-text .content { color: #dcddde; } .reply-avatar { width: 20px; height: 20px; border-radius: 50%; background-size: cover; background-position: center; margin-right: 5px; } .inner { display: flex; padding: 0px 25px 1px 64px; } .author-icon{ vertical-align: middle; margin-left: 5px; width: 20px; height: 20px; } code { background-color: #1e1f22; color: #C7C8CE; border: 1px solid #282828; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-size: 14px; border-radius: 5px; } .code-block-large { background-color: #1e1f22; color: #C7C8CE; border: 1px solid #282828; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-size: 14px; border-radius: 5px; white-space: pre; overflow: auto; display: block; } .code-inline { background-color: #1e1f22; color: #C7C8CE; padding: 2px 4px; border: 1px solid #282828; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-size: 12px; border-radius: 3px; display: inline; } .bolded{ font-weight: 600; } .content pre { margin: 0; padding: 0; } .content code { display: block; } ul { list-style-type: disc; padding-left: 20px; margin-top: 25px; margin-bottom: 0px; padding-bottom: 0px; white-space: normal; } li { padding-top: 5px; padding-bottom: 0px; } li::marker { font-size: 1.1em; } .message .content, .inner.message .content { color: #dcddde; height: auto; text-align: left; white-space: break-spaces; margin-top: 5px; } .img-rsz { max-width: 400px; height: auto; border-radius: 4px; margin-top: 5px; } .s_r { display: inline-block; max-width: 600px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-left: 5px; } .footer { text-align: center; margin: 25px 0; color: #b9bbbe; } .embed-wrapper { margin-top: 10px; }