/* stylelint-disable no-descending-specificity */ #bd-editor-panel { display: flex; flex-direction: column; } #bd-editor-controls button { margin: 0 5px 0 0; background: none; color: #fff; height: 26px; font-weight: 600; border-radius: 3px; display: flex; align-items: center; } #bd-editor-controls button:hover { background: rgba(255, 255, 255, 0.05); } #bd-editor-controls button svg { fill: white; } #bd-editor-controls button:last-of-type { margin-right: 0; } #bd-editor-controls { display: flex; align-items: center; justify-content: space-between; background: #272822; color: #fff; border: none; box-shadow: 0 1px 0 0 #2f3129 inset; padding: 5px; } .editor-wrapper { display: flex; } .ace_editor { line-height: normal; font-family: Consolas, monospace; box-sizing: border-box; height: calc(100vh - 250px); font-size: 14px; width: 100%; } .bd-monokai .editor .ace_gutter { background: #2f3136; } .bd-monokai .ace_editor { background: #292b2f; } .bd-monokai #bd-editor-controls { background: #202225; } .theme-light #bd-editor-controls { background: #e8e8e8; border: 1px solid #fff; border-top: 1px solid #adadad; box-shadow: inset 0 1px 0 0 white; } .controls-section { display: flex; align-items: center; } .controls-section .checkbox-inner { width: 14px; height: 14px; } .controls-section .checkbox-inner .checkbox:checked + span::after { left: 2px; top: -2px; } .controls-section .checkbox-label { font-size: 14px; } /* Ace Editor Settings */ #ace_settingsmenu_container { background: rgba(0, 0, 0, 0.7) !important; /* stylelint-disable-line important */ } body #ace_settingsmenu { padding-top: 35px; } body .ace_closeButton { position: absolute; top: 8px; right: 12px; z-index: 10000; padding: 0; cursor: pointer; background: none; border: none; } body .ace_closeButton::before { content: "✖"; color: #36393f; } body .ace_closeButton:active { transform: translateY(2px); } /* editor help text */ #bd-editor-controls .help-text { margin-top: 8px; margin-bottom: 3px; font-size: 14px; } #bd-editor-controls .help-text .inline { background: #2f3129; padding: 0.2em; margin: -0.2em 0; border-radius: 3px; } /* Emoji Picker */ .bd-dark #bd-qem-favourite-container, .bd-dark #bd-qem-twitch-container { background-color: #353535; } .bd-dark #bd-qem { border-bottom: 1px solid #464646; background: #353535; } .bd-dark #bd-qem button { background: #353535; border-left: 1px solid #242424; box-shadow: #424242 1px 0 0 0; color: #fff; } .bd-dark #bd-qem button.active { background-color: #292929; } .bd-dark #bd-qem button:hover { background-color: #303030; } .bd-dark .emojiPicker-3m1S-j { background-color: #353535; } .bd-dark .emojiPicker-3m1S-j .category-2U57w6 { background-color: #353535; } .bd-dark .emojiPicker-3m1S-j .header-1nkwgG .searchBar-2pWH0_ { background-color: #2b2b2b; } .bd-dark .emojiPicker-3m1S-j .searchBar-2pWH0_ input { color: #fff; } .bd-dark .emojiPicker-3m1S-j .searchBar-2pWH0_ input::-webkit-input-placeholder { color: #fff; } .bd-dark .emojiPicker-3m1S-j .scroller-3vODG7 .emojiItem-109bjA.selected-39BZ4S { background-color: rgba(123, 123, 123, 0.37); } .bd-dark .emojiPicker-3m1S-j .dimmer-3iH-5D.visible-3k45bQ { background-color: rgba(62, 62, 62, 0.65); } .bd-dark .emojiPicker-3m1S-j .diversitySelector-tmmMv0 .popout-2nUePc { background: #353535; border-color: #202020; } .bd-dark #bd-qem-favourite-container .scroller::-webkit-scrollbar, .bd-dark #bd-qem-favourite-container .scroller::-webkit-scrollbar-track, .bd-dark #bd-qem-favourite-container .scroller::-webkit-scrollbar-track-piece, .bd-dark #bd-qem-twitch-container .scroller::-webkit-scrollbar, .bd-dark #bd-qem-twitch-container .scroller::-webkit-scrollbar-track, .bd-dark #bd-qem-twitch-container .scroller::-webkit-scrollbar-track-piece, .bd-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar, .bd-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar-track, .bd-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar-track-piece { background-color: #303030 !important; border-color: #303030 !important; } .bd-dark #bd-qem-twitch-container .scroller::-webkit-scrollbar-thumb, .bd-dark #bd-qem-favourite-container .scroller::-webkit-scrollbar-thumb, .bd-dark .emojiPicker-3g68GS .scroller-3vODG7::-webkit-scrollbar-thumb { border-color: #202020 !important; background-color: #202020 !important; } /* add/create server */ .bd-dark .theme-light .slide-2pHaq5 { background: #36393f; } .bd-dark .theme-dark .action-1lSjCi, .bd-dark .theme-light .action-1lSjCi { background: #2f3136; } /* centered or */ .bd-dark .theme-dark .or-3THJsp, .bd-dark .theme-light .or-3THJsp { background: #2f3136; order: 2; height: 56px; width: 56px; top: 103px; line-height: 56px; left: calc(50% - 29px); border-radius: 50%; border: 2px solid #484b52; } .bd-dark .create-3jownz { order: 1; } .bd-dark .join-33Tr-7 { order: 3; } .bd-dark .theme-dark .actionIcon-2IISM_, .bd-dark .theme-light .actionIcon-2IISM_ { filter: grayscale(100%) brightness(60%); } .bd-dark .theme-light .footer-2yfCgX { background: #2f3136; } /* Region Select */ .bd-dark .regionSelectModal-12e-57 { background: #36393f; } .bd-dark .regionSelectModal-12e-57 .regionSelectModalOption-2DSIZ3 { background: #2f3136; border: 2px solid #484b52; } /* Ace Editor Settings */ .bd-dark ~ div #ace_settingsmenu { color: #f6f6f7; background: #36393f; box-shadow: 0 0 0 1px rgba(32, 34, 37, 0.6), 0 2px 10px 0 rgba(0, 0, 0, 0.2); } .bd-dark ~ div #ace_settingsmenu select, .bd-dark ~ div #ace_settingsmenu input[type="text"] { color: #f6f6f7; background: #2f3136; border: 1px solid #484b52; } .bd-dark ~ div .ace_closeButton::before { color: #f6f6f7; } #removemenu { width: auto; background: #505050; z-index: 999999; box-shadow: 0 0 2px #000; padding: 2px; left: 25px; display: block; cursor: pointer; color: #fff; position: fixed; } #removemenu ul a { text-decoration: none; color: #fff; padding: 3px; } .emotewrapper { position: relative; display: inline-flex; object-fit: contain; margin: -0.1em 0.05em -0.2em 0.1em; vertical-align: top; } .emotewrapper.jumboable { margin-bottom: 0; margin-top: 0.2em; vertical-align: -0.3em; } .emote { height: 1.45em; } .emote.jumboable { height: 2rem; } .fav { display: none; position: absolute; width: 15px; height: 15px; right: -7px; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAzFBMVEUAAABQUFBMTExLS0tNTU1MTExNTU1NTU1MTExMTExNTU1LS0tEREBEREBEREBEREBJSUhLS0tLS0tEREBNTU1NTU1NTU1EREArKyhNTU1NTU0AAABMTExKSklMTExNTU1NTU1NTU1KSkpMTExKSkhNTU1KSkpISEZNTU1LS0tAQDxOTk5KSkpLS0tNTU1MTExMTEx/f39MTExMTExLS0pLS0tMTExNTU1NTU1LS0pNTU1NTU1NTU1NTU1NTU1NTUxNTU1NTU1NTUxMTEzB8C/5AAAAOnRSTlMAI8X96oWAgYSF68QBAg0PMCb9BIuLgQUD4N0Bh0mKhZSOQ4gcrKscaW8QRE6fmJyjAshASceG7cIpqQOxTQAAALVJREFUGFddx6FOA0EYAOGZvd07Qm6vVCAAgUUgQEDfX/YZMAigqaFN7iC5tsmPqGPUN/AvUVeoEbGOCElJz08Uzeixqu4AqomVVSNngOVjTqDGZSl3UFtPGV2ot2zaq96YM9p5Ddzcf/nTTAlj+/sNtNu8OcwkIsbPBtrUfMQeEhGQmHbmGIFMwLPzu6UMIwBNgToshgq8Nr2ki+Oy7ebDHp70LRPWB6OZgfWLWei7fJonOOsPCGA9kVlssOoAAAAASUVORK5CYII="); border: none; background-size: 100% 100%; background-repeat: no-repeat; background-color: #303030; border-radius: 5px; top: -7px; cursor: pointer; } .fav.active { background-color: yellow; } .emotewrapper:hover .fav { display: block; } .emojiPicker-3m1S-j { box-shadow: none; border-top: none; border-radius: 0 0 5px 5px; } #bd-qem { border-radius: 5px 5px 0 0; background: #fff; border-bottom: 1px solid rgba(0, 0, 0, 0.1); height: 30px; display: flex; flex-direction: row; padding-right: 1px; } #bd-qem button { border-left: 1px solid #efefef; background: transparent; box-shadow: #cecece 1px 0 0 0; flex-grow: 1; } #bd-qem button:hover { background: #ececec; } #bd-qem-twitch { border-radius: 5px 0 0 0; order: 2; } #bd-qem-emojis { border-radius: 0 5px 0 0; order: 3; } #bd-qem-favourite { order: 3; } #bd-qem button.active { background-color: #e2e2e2; } #bd-qem-twitch-container, #bd-qem-favourite-container { width: 346px; height: 329px; background-color: #fff; border-radius: 0 0 5px 5px; } #bd-qem-twitch-container .scroller-wrap, #bd-qem-favourite-container .scroller-wrap { height: 100%; } .emote-menu-inner { padding: 5px 0 0 15px; } .bd-qme-hidden #bd-qem-emojis { display: none; } #emote-container { padding: 10px; } .emote-container { display: inline-block; padding: 2px; border-radius: 5px; width: 30px; height: 30px; position: relative; } .emote-icon { max-width: 100%; max-height: 100%; position: absolute; margin: auto; top: 0; right: 0; bottom: 0; left: 0; cursor: pointer; } .emote.stop-animation { animation: none; } .emote-container:hover { background: rgba(123, 123, 123, 0.37); } .emoteflip, .emotespinflip { transform: scaleX(-1); } .emotespin { animation: 1s emote-spin infinite linear; } .emote1spin { animation: 1s emote-spin-reverse infinite linear; } .emotespin2 { animation: 0.5s emote-spin infinite linear; } .emote2spin { animation: 0.5s emote-spin-reverse infinite linear; } .emotespin3 { animation: 0.2s emote-spin infinite linear; } .emote3spin { animation: 0.2s emote-spin-reverse infinite linear; } .emotepulse { animation: 1s emote-pulse infinite linear; } .emotetr { transform: translateX(-3px); } .emotebl { transform: translateY(-3px); } .emotebr { transform: translate(-3px, -3px); } .emoteshake { animation: 1s emote-shake infinite linear; } .emoteflap { transform: scaleY(-1); } .emoteshake2 { animation: emote-shake2 0.3s linear infinite; } .emoteshake3 { animation: emote-shake3 0.1s linear infinite; } @keyframes emote-shake2 { 25% { transform: translate(-1px, -1px); } 50% { transform: translate(-1px, 1px); } 75% { transform: translate(1px, 1px); } 75% { transform: translate(1px, -1px); } } @keyframes emote-shake3 { 25% { transform: translate(-1px, -1px); } 50% { transform: translate(-1px, 1px); } 75% { transform: translate(1px, 1px); } 75% { transform: translate(1px, -1px); } } @keyframes emote-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } @keyframes emote-spin-reverse { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } @keyframes emote-pulse { 0% { -webkit-transform: scale(1, 1); } 50% { -webkit-transform: scale(1.2, 1.2); } 100% { -webkit-transform: scale(1, 1); } } @keyframes emote-shake { 10%, 90% { transform: translate3d(-1px, 0, 0); } 20%, 80% { transform: translate3d(2px, 0, 0); } 30%, 50%, 70% { transform: translate3d(-4px, 0, 0); } 40%, 60% { transform: translate3d(4px, 0, 0); } } /* Messages */ .bd-minimal .divider-32i8lo { opacity: 0; } /* message avatars */ .bd-minimal .large-3ChYtB { max-width: 20px; max-height: 20px; background-size: 100%; margin-right: 2px; margin-top: 0; border-radius: 0; } /* message content */ .bd-minimal .content-3dzVd8 { border-left: 2px solid #ebebeb; padding-left: 2px; } .bd-minimal .theme-dark .content-3dzVd8 { border-left: 2px solid #303030; } /* message username */ .bd-minimal .username-_4ZSMR { font-size: small; } /* message group */ .bd-minimal .container-1YxwTf { padding: 5px; } /* message embed */ .bd-minimal .embed-IeVjo6 { padding: 2px; } /* Member List */ .bd-minimal .membersWrap-2h-GB4 { min-width: 0; } /* member list avatars */ .bd-minimal .members-1998pB .small-5Os1Bb { max-width: 15px; max-height: 15px; background-size: 15px 15px; } /* member list avatars */ .bd-minimal .members-1998pB .small-5Os1Bb .status-oxiHuE { height: 5px; width: 5px; } /* member list list item */ .bd-minimal .members-1998pB .member-3W1lQa { padding: 5px; } /* member list item inner */ .bd-minimal .members-1998pB .memberInner-2CPc3V { transform: scale(0.9); } /* member list role label */ .bd-minimal .members-1998pB .membersGroup-v9BXpm { margin-top: 3px; transform: scale(0.9); } /* channel list */ .bd-minimal .channels-Ie2l6A { width: 160px; } /* Channel List */ .bd-minimal.bd-minimal-chan .channels-Ie2l6A { display: none; } /* channel list guild name */ .bd-minimal .channels-Ie2l6A header span { font-size: 12px; } /* channel item */ .bd-minimal .containerDefault-3GGEv_ { transform: scale(0.9); } /* channel name */ .bd-minimal .content-3at_AU { transform: scale(0.9); } /* channel icon */ .bd-minimal .icon-1_QxNX { width: 14px; height: 14px; } /* Guild List */ .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG .listItem-2P_4kh { width: 20px; height: 20px; background-size: 100%; font-size: 15px; line-height: 20px; margin: 0 12.5px 8px; } /* guild link and icon */ .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG .wrapper-25eVIn a, .bd-minimal .listItem-2P_4kh .wrapper-25eVIn .icon-27yU2q { width: 20px; height: 20px; background-size: 100%; font-size: 15px; line-height: 20px; } /* guild inner */ .bd-minimal .listItem-2P_4kh .wrapper-25eVIn { width: 20px; height: 20px; background-size: 100%; font-size: 15px; line-height: 20px; } .bd-minimal .listItem-2P_4kh svg, .bd-minimal .listItem-2P_4kh foreignObject[mask] { mask: none; } /* home icon */ .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG .homeIcon-tEMBK1 { width: 10px; height: 10px; background-size: 100%; font-size: 15px; line-height: 20px; } /* add and search */ .bd-minimal .circleIconButton-jET_ig { height: 20px; width: 20px; } .bd-minimal .circleIconButton-jET_ig svg { height: 14px; width: 14px; } /* friends online */ .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG .friendsOnline-_wi_fM { margin-left: -15px; font-size: 7px; } /* public servers button */ .bd-minimal #bd-pub-li { height: 16px; } .bd-minimal #bd-pub-button { font-size: 8px; line-height: 16px; height: 16px; } /* guild list */ .bd-minimal .wrapper-1Rf91z, .bd-minimal .wrapper-1Rf91z .scrollerWrap-1IAIlv, .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG { width: 45px; } /* separator */ .bd-minimal .wrapper-1Rf91z .guildSeparator-3s64Iy { margin-left: -15px; } /* unread icon */ .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG .listItem-2P_4kh .wrapper-sa6paO { height: 20px; margin-top: 0; margin-left: -12.5px; } /* audio/video */ .bd-minimal .wrapper-1Rf91z .scroller-2FKFPG .iconBadge-2wi9r4 { width: 12px; height: 12px; background-size: 12px; } /* Account Container */ .bd-minimal .container-2Thooq .avatarSmall-3ACRaI { width: 15px; height: 15px; background-size: 15px 15px; } /* status */ .bd-minimal .container-2Thooq .avatarSmall-3ACRaI .status-oxiHuE { height: 5px; width: 5px; } /* username and discrim */ .bd-minimal .container-2Thooq .accountDetails-3k9g4n { transform: scale(0.8); } /* 3 buttons */ .bd-minimal .container-2Thooq .button-2b6hmh { height: 14px; width: 14px; background-size: 14px 14px; margin-left: 3px; } /* 3 buttons icons */ .bd-minimal .container-2Thooq .button-2b6hmh svg { height: 14px; width: 14px; } #bd-pub-li { height: 20px; margin-bottom: 10px; overflow: hidden; } #bd-pub-button { border-radius: 4px; background-color: rgb(47, 49, 54); color: #b9bbbe; text-align: center; font-size: 12px; line-height: 20px; height: 20px; } .bd-server-card .bd-server-tags { flex: 1 1 auto; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; width: 0; line-height: 24px; font-size: 12px; color: #b9bbbe; font-weight: 700; margin-right: 10px; } /* .ui-card.ui-card-primary.bd-server-card:first-child { margin-bottom: 13px; } .ui-card.ui-card-primary.bd-server-card:first-child:after { border: 3px solid #7289da; content: ""; display: block; position: absolute; left: 0; right: 0; margin-top: 4px; } */ .bd-server-card.bd-server-card-pinned { margin-bottom: 15px; } .bd-server-card.bd-server-card-pinned::after { background: #3a71c1; content: ""; height: 3px; width: 100%; display: block; margin-top: 7px; position: absolute; top: 100%; } .bd-server-description-container { color: #b9bbbe; min-height: 65px; max-height: 65px; border-top: 1px solid #3f4146; border-bottom: 1px solid #3f4146; padding-top: 5px; font-size: 13px; } .bd-server-header { text-transform: uppercase; letter-spacing: 0.5px; justify-content: space-between; font-weight: 600; } .bd-server-card { display: flex; position: relative; border-width: 1px; border-style: solid; border-radius: 5px; background: rgba(32, 34, 37, 0.6); border-color: #202225; margin-bottom: 8px; } .bd-server-header, .bd-server-footer { display: flex; color: #b9bbbe; } .bd-server-card .bd-button { margin-top: 4px; } .bd-server-content { padding: 5px 10px; flex: 1; } .bd-server-image { min-width: 115px; min-height: 115px; max-width: 115px; max-height: 115px; } .bd-server-name { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding-right: 15px; max-width: 330px; flex: 1 1 50%; } .bd-layer { -ms-flex-direction: column; -webkit-box-direction: normal; -webkit-box-orient: vertical; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; flex-direction: column; left: 0; position: absolute; right: 0; top: 0; } /* #pubslayer .ui-tab-bar-item { color: #b9bbbe; padding-top: 6px; padding-bottom: 6px; margin-bottom: 2px; padding: 6px 10px; position: relative; font-size: 16px; line-height: 20px; border-radius: 3px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; flex-shrink: 0; font-weight: 500; cursor: pointer; } #pubslayer .ui-tab-bar-item:hover { color: #f6f6f7; background-color: hsla(216,4%,74%,.1); } #pubslayer .ui-tab-bar-item.selected { color: #fff; background-color: #7289da; } #pubslayer .ui-tab-bar-header { color: #72767d; padding: 6px 10px; font-size: 12px; line-height: 16px; text-transform: uppercase; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; flex-shrink: 0; font-weight: 500; } #pubslayer #bd-settings-sidebar .ui-tab-bar-separator { background-color: hsla(218,5%,47%,.3); margin-left: 10px; margin-right: 10px; height: 1px; margin-bottom: 8px; margin-top: 8px; } #pubslayer h2.ui-form-title { color: #f6f6f7; text-transform: uppercase; font-weight: 600; } #pubslayer h5.ui-form-title { color: #f6f6f7; } */ #pubslayer button { background: #7289da; color: #fff; font-size: 14px; font-weight: 500; line-height: 16px; padding: 2px 16px; border: none; border-radius: 3px; transition: background-color 0.17s ease; } #pubslayer button:hover { background-color: #677bc4; } #pubslayer input { color: #f6f6f7; background-color: rgba(0, 0, 0, 0.1); border-color: rgba(0, 0, 0, 0.3); padding: 10px; height: 30px; border-width: 1px; border-style: solid; border-radius: 3px; outline: none; transition: background-color 0.15s ease, border 0.15s ease; } #bd-connection { margin-left: 10px; } .bd-footnote { color: #b9bbbe; font-size: 11px; } .bd-button-next, .bd-button-reconnect { margin: 5px 10px 10px 0; width: 100%; min-height: 20px; } .bd-reload { cursor: pointer; vertical-align: top; fill: #dcddde; } .bd-reload:hover { fill: #fff; } .bd-reload-header { margin-left: 5px; } .bd-reload-card { margin-right: 5px; } .bd-controls { display: flex; } .bd-addon-list { user-select: text; } .bd-addon-list .bd-addon-card { max-height: 175px; margin-bottom: 20px; padding: 5px 8px; border: 1px solid transparent; border-radius: 5px; overflow: hidden; } .theme-dark .bd-addon-list .bd-addon-card { background-color: rgba(32, 34, 37, 0.6); color: #f6f6f7; border-color: #202225; } .theme-light .bd-addon-list .bd-addon-card { background-color: #f8f9f9; color: #4f545c; border-color: #dcddde; } .bd-addon-list .bd-addon-card.settings-open { max-height: 800px; overflow-y: auto; } .bd-addon-list .bd-addon-header { font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: space-between; padding-bottom: 5px; border-bottom: 1px solid transparent; overflow: hidden; } .theme-dark .bd-addon-list .bd-addon-header { color: #f6f6f7; border-bottom-color: rgba(114, 118, 125, 0.3); } .theme-light .bd-addon-list .bd-addon-header { color: #4f545c; border-bottom-color: rgba(185, 187, 190, 0.3); } .bd-addon-list .bd-description { word-break: break-word; max-height: 100px; margin: 5px 0; padding: 5px 0; overflow-y: auto; } .theme-dark .bd-addon-list .bd-description { color: #b9bbbe; } .theme-light .bd-addon-list .bd-description { color: #72767d; } .bd-addon-list .scroller::-webkit-scrollbar-track-piece, .bd-addon-list .scroller::-webkit-scrollbar-thumb { border-radius: 0 !important; border-color: transparent; } .bd-addon-list .bd-footer { font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: space-between; padding-top: 5px; border-top: 1px solid transparent; overflow: hidden; } .theme-dark .bd-addon-list .bd-footer { border-top-color: rgba(114, 118, 125, 0.3); } .theme-light .bd-addon-list .bd-footer { border-top-color: rgba(185, 187, 190, 0.3); } .bd-addon-list .bd-footer button { padding: 3px 16px; transition: opacity 250ms ease; } .bd-addon-list .bd-footer button:disabled { opacity: 0.4; } .bd-addon-list .bd-footer a { color: #3e82e5; } .bd-addon-list .bd-footer a:hover { text-decoration: underline; } .bd-controls + .bd-addon-list { margin-top: 10px; } .bd-addon-button { cursor: pointer; } .bd-addon-button + .bd-addon-button { margin-left: 5px; } .bd-search-wrapper { padding: 3px; border-radius: 3px; outline: none; border: 0; background-color: #202225; color: #fff; display: flex; align-items: center; } .bd-search { padding: 2px 3px; background: none; border: 0; color: #fff; flex: 1; } .bd-search-wrapper > svg { margin-right: 2px; } .bd-addon-controls { display: flex; align-items: center; justify-content: space-between; } .bd-addon-controls .bd-search { font-size: 13px; margin: 0; width: 200px; } .bd-addon-dropdowns { display: flex; } /* Error Boundary stuff */ .react-error { color: red; font-weight: bold; font-family: Arial, Helvetica, sans-serif; cursor: pointer; } .settings-open .bd-close { cursor: pointer; float: right; } .bd-social-logo { opacity: 0.6; } .bd-social-link:hover .bd-social-logo { opacity: 1; } .standardSidebarView-3F1I7i .bd-versioninfo-wrapper { bottom: 0; left: 0; position: fixed; background: inherit; right: 0; padding: 5px; } .standardSidebarView-3F1I7i .bd-versioninfo-wrapper span { color: #b9bbbe; font-weight: 600; font-size: 11px; } .standardSidebarView-3F1I7i .bd-versioninfo-wrapper a { font-size: 11px; } .bd-button-title { margin-left: 10px; } /* #bd-settings-sidebar .ui-tab-bar-item { font-size: 16px; font-weight: 500; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; flex-shrink: 0; padding: 6px 10px; border-radius: 3px; position: relative; overflow: hidden; } #bd-settings-sidebar .ui-tab-bar-item.selected { cursor: default; } .theme-dark #bd-settings-sidebar .ui-tab-bar-item { color: #b9bbbe; } .theme-dark #bd-settings-sidebar .ui-tab-bar-item:hover { background-color: rgba(185,187,190,.1); color: #f6f6f7; } .theme-dark #bd-settings-sidebar .ui-tab-bar-item.selected { background-color: #7289da; color: #fff; } .theme-light #bd-settings-sidebar .ui-tab-bar-item { color: #72767d; } .theme-light #bd-settings-sidebar .ui-tab-bar-item:hover { background-color: rgba(79,84,92,.1); color: #4f545c; } .theme-light #bd-settings-sidebar .ui-tab-bar-item.selected { background-color: #7289da; color: #fff; } #bd-settings-sidebar .ui-tab-bar-header { font-size: 12px; font-weight: 700; line-height: 16px; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 0; padding: 6px 10px; overflow: hidden; } .theme-dark #bd-settings-sidebar .ui-tab-bar-header { color: #72767d; } .theme-light #bd-settings-sidebar .ui-tab-bar-header { color: #b9bbbe; } #bd-settings-sidebar .ui-tab-bar-separator { height: 1px; margin: 8px 10px; } .theme-dark #bd-settings-sidebar .ui-tab-bar-separator { background-color: rgba(114,118,125,.3); } .theme-light #bd-settings-sidebar .ui-tab-bar-separator { background-color: rgba(185,187,190,.3); } .ui-flex { display: flex; } #bd-settingspane-container h2.ui-form-title { font-size: 16px; font-weight: 600; line-height: 20px; text-transform: uppercase; display: inline-block; margin-bottom: 20px; } .theme-dark #bd-settingspane-container h2.ui-form-title { color: #f6f6f7; } .theme-light #bd-settingspane-container h2.ui-form-title { color: #4f545c; } */ .bd-switch { background-color: #72767d; border-radius: 14px; width: 42px; height: 24px; opacity: 1; overflow: hidden; user-select: none; position: relative; display: block; flex: 0 0 auto; transition: background 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border 0.15s ease-in-out, opacity 0.15s ease-in-out; margin-left: 10px; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.15); } .bd-switch::before { content: ""; display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 0; opacity: 0; background-color: #000; } .bd-switch::after { content: ""; display: block; position: absolute; background-color: #fff; z-index: 1; width: 18px; margin: 3px; border-radius: 9px; height: 18px; left: 0; transition: transform 0.15s ease-in-out, width 0.1s ease-in-out, left 0.1s ease-in-out; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); } .bd-switch .bd-checkbox { position: absolute; width: 100%; height: 100%; opacity: 0; padding: 0; margin: 0; z-index: 2; cursor: pointer; } .bd-switch-checked { background-color: #3e82e5; } .bd-switch-checked::after { transform: translate3d(18px, 0, 0); } .bd-switch-disabled { opacity: 0.3; cursor: not-allowed; } .bd-switch-item { flex-direction: column; margin-top: 8px; } .bd-switch-item h3 { font-size: 16px; font-weight: 500; line-height: 24px; flex: 1; } .theme-dark .bd-switch-item h3 { color: #f6f6f7; } .theme-light .bd-switch-item h3 { color: #4f545c; } /* .ui-switch-item .style-description { font-size: 14px; font-weight: 500; line-height: 20px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid hsla(218,5%,47%,.3); } .theme-dark .ui-switch-item .style-description { color: #72767d; } .theme-light .ui-switch-item .style-description { color: rgba(114,118,125,.6); } */ .bd-switch-item .bd-switch-wrapper { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: relative; width: 44px; height: 24px; display: block; flex: 0 0 auto; } .bd-switch-item .bd-switch-wrapper input { position: absolute; opacity: 0; cursor: pointer; width: 100%; height: 100%; z-index: 1; } .bd-switch-item .bd-switch-wrapper .bd-switch { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #72767d; border-radius: 14px; transition: background 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border 0.15s ease-in-out; } .bd-switch-item .bd-switch-wrapper .bd-switch::before { content: ""; display: block; width: 18px; height: 18px; position: absolute; top: 3px; left: 3px; bottom: 3px; background: #f6f6f7; border-radius: 10px; transition: all 0.15s ease; box-shadow: 0 3px 1px 0 rgba(0, 0, 0, 0.05), 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.05); } .bd-switch-item .bd-switch-wrapper .bd-switch.checked { background: #7289da; } .bd-switch-item .bd-switch-wrapper .bd-switch.checked::before { transform: translateX(20px); } #bd-settingspane-container .scroller-wrap { height: 100%; } #bd-settingspane-container .scroller-wrap .scroller { display: flex; } .bd-select-wrapper { color: #f6f6f7; font-size: 13px; display: flex; align-items: center; } .bd-select-wrapper + .bd-select-wrapper { margin-left: 10px; } .bd-select-wrapper label { opacity: 0.3; margin-right: 5px; } .bd-select { position: relative; cursor: pointer; color: #f6f6f7; font-size: 13px; display: flex; align-items: center; justify-content: space-between; background-color: rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 3px; padding: 5px 5px 5px 0; } .bd-select.bd-select-transparent { background: none; border: none; padding: 0; } .bd-select-value { padding-left: 12px; } .bd-select-arrow { margin-left: 10px; } .bd-select .bd-select-options { position: absolute; background: #2f3136; border-radius: 0 0 3px 3px; max-height: 300px; min-width: calc(100% + 2px); overflow-y: auto; box-shadow: rgba(0, 0, 0, 0.3) 0 1px 5px 0; border: 1px solid rgba(0, 0, 0, 0.3); border-top: 0; margin-top: -1px; margin-left: -1px; z-index: 2; top: 100%; } .bd-select-transparent .bd-select-options { border: 1px solid rgba(0, 0, 0, 0.3); margin-top: 3px; border-radius: 3px; } .bd-select .bd-select-option { padding: 8px 12px; cursor: pointer; white-space: pre; } .bd-select .bd-select-option:hover, .bd-select .bd-select-option.selected { background: #26272b; } .bd-setting-item .bd-select { min-width: 200px; } .bd-setting-item { display: flex; flex-direction: column; margin-bottom: 20px; } .bd-setting-header { display: flex; justify-content: space-between; align-items: center; } .bd-setting-header label { font-weight: 500; cursor: pointer; overflow: hidden; word-wrap: break-word; font-size: 16px; line-height: 24px; color: #f6f6f7; } .bd-setting-note { color: #72767d; margin-top: 4px; font-size: 14px; line-height: 20px; font-weight: 500; } .bd-setting-divider { width: 100%; height: 1px; margin-top: 20px; background-color: rgba(114, 118, 125, 0.3); } .bd-settings-container { height: auto; overflow: hidden; transition: height 300ms cubic-bezier(0.47, 0, 0.745, 0.715); } .bd-settings-group.collapsed .bd-settings-container { height: 0; } .bd-settings-group.expanded .bd-settings-container:not(.animating) { overflow: visible; } .bd-settings-group.collapsible .bd-settings-title { display: flex; justify-content: space-between; align-items: center; order: 1; } .bd-settings-group.collapsible .bd-settings-title::before { content: ""; background-color: rgba(114, 118, 125, 0.3); height: 2px; order: 2; flex: 1; margin: 0 10px 0 15px; } .bd-settings-group.collapsible .bd-settings-title::after { content: ""; background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOS4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FscXVlXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSItOTUwIDUzMiAxOCAxOCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAtOTUwIDUzMiAxOCAxODsiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4NCgkuc3Qwe2ZpbGw6bm9uZTt9DQoJLnN0MXtmaWxsOm5vbmU7c3Ryb2tlOiNGRkZGRkY7c3Ryb2tlLXdpZHRoOjEuNTtzdHJva2UtbWl0ZXJsaW1pdDoxMDt9DQo8L3N0eWxlPg0KPHBhdGggY2xhc3M9InN0MCIgZD0iTS05MzIsNTMydjE4aC0xOHYtMThILTkzMnoiLz4NCjxwb2x5bGluZSBjbGFzcz0ic3QxIiBwb2ludHM9Ii05MzYuNiw1MzguOCAtOTQxLDU0My4yIC05NDUuNCw1MzguOCAiLz4NCjwvc3ZnPg0K"); height: 20px; width: 20px; display: inline-block; vertical-align: bottom; transition: transform 0.3s ease; transform: rotate(0); order: 3; } .bd-settings-group.collapsed .bd-settings-title::after { transition: transform 0.3s ease; transform: rotate(90deg); } .bd-settings-group ~ .bd-settings-group .bd-settings-title { margin-top: 30px; transition: margin-top 300ms ease; } .bd-settings-group.collapsed + .bd-settings-group .bd-settings-title { margin-top: 0; } .bd-settings-title.bd-settings-group-title { margin-bottom: 10px; } .checkbox-item { display: flex; } .checkbox-item .checkbox-label { margin-right: 8px; } @keyframes open-window { from { transform: scale(0.9); } to { transform: none; } } .floating-window { animation: open-window 200ms ease; min-width: 200px; min-height: 300px; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); display: flex; flex-direction: column; -webkit-app-region: no-drag; position: fixed; z-index: 1001; box-sizing: border-box; } .floating-window.modal-open { z-index: 999; } .floating-window.resizable { overflow: auto; resize: both; padding-bottom: 10px; background: #202225; } .floating-window-titlebar { width: 100%; display: flex; justify-content: space-between; align-items: center; background: #202225; /* #2F3129background-color: #202225; */ color: white; border-bottom: 1px solid #272822; } .floating-window-content { display: flex; flex-direction: column; background: #2f3129; color: white; flex: 1; } .floating-window-titlebar .title { /* font-weight: bold; */ flex: 1; text-align: center; padding: 2px 0; } .floating-window-buttons { display: flex; } .floating-window-buttons .button { cursor: pointer; padding: 0 2px; } .floating-window-buttons .button svg { fill: #dcddde; margin-top: 1.5px; } .floating-window-buttons .button:hover svg { fill: white; } .floating-window-buttons .button:hover { background-color: #36393f; } .floating-window-buttons .close-button:hover { background-color: #f04747; } .floating-window-buttons .close-button:hover svg path.fill { fill: white; } .floating-window-content #bd-editor-panel { display: flex; flex-direction: column; flex: 1; } .floating-window .editor-wrapper { flex: 1; } .floating-window .ace_editor { height: auto; flex: 1; } .floating-window #bd-editor-controls { height: auto; background: #202225; border: none; box-shadow: 0 1px 0 0 #2f3129 inset; } #floating-editor-window { min-width: 340px; min-height: 280px; max-height: 900px; max-width: 750px; } .floating-addon-window { min-width: 535px; min-height: 605px; max-height: 90%; max-width: 90%; } @keyframes bd-backdrop { to { opacity: 0.85; } } @keyframes bd-modal-wrapper { to { transform: scale(1); opacity: 1; } } @keyframes bd-backdrop-closing { to { opacity: 0; } } @keyframes bd-modal-wrapper-closing { to { transform: scale(0.7); opacity: 0; } } .bd-backdrop { animation: bd-backdrop 250ms ease; animation-fill-mode: forwards; opacity: 0; background-color: rgb(0, 0, 0); transform: translateZ(0); } .bd-modal-wrapper.closing .bd-backdrop { animation: bd-backdrop-closing 200ms linear; animation-fill-mode: forwards; animation-delay: 50ms; opacity: 0.85; } .bd-modal-wrapper .bd-modal { animation: bd-modal-wrapper 250ms cubic-bezier(0.175, 0.885, 0.32, 1.275); animation-fill-mode: forwards; transform: scale(0.7); transform-origin: 50% 50%; display: flex; align-items: center; box-sizing: border-box; contain: content; justify-content: center; top: 0; left: 0; bottom: 0; right: 0; opacity: 0; pointer-events: none; position: absolute; z-index: 1000; } .bd-modal-wrapper.closing .bd-modal { animation: bd-modal-wrapper-closing 250ms cubic-bezier(0.19, 1, 0.22, 1); animation-fill-mode: forwards; opacity: 1; transform: scale(1); } .bd-modal-wrapper .bd-modal-inner { display: flex; contain: layout; flex-direction: column; pointer-events: auto; border: 1px solid rgba(28, 36, 43, 0.6); border-radius: 5px; box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.2); overflow: hidden; max-height: 660px; min-height: 200px; width: 440px; user-select: text; } .bd-modal-wrapper .bd-content-modal .bd-modal-inner { height: 500px; width: 700px; } .bd-modal-wrapper .header { background-color: #35393e; box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2); padding: 12px 20px; z-index: 1; color: #fff; font-size: 16px; font-weight: 700; line-height: 19px; } .bd-modal-wrapper .bd-modal-body { background-color: #36393f; color: #fff; overflow: hidden; display: flex; flex-direction: column; flex: 1; contain: layout; position: relative; } .bd-modal-wrapper .scroller { padding: 10px; overflow-y: auto; } .bd-modal-wrapper .bd-content-modal .bd-modal-body { padding: 0; } .bd-modal-wrapper .footer { display: flex; justify-content: flex-end; padding: 10px 20px; } .bd-modal-wrapper .footer button { min-height: 32px; min-width: 60px; align-items: center; display: flex; font-size: 14px; font-weight: 500; justify-content: center; line-height: 16px; padding: 2px 16px; user-select: none; } .bd-modal-wrapper .tab-bar-container { align-items: center; border-bottom: 0; background: rgba(0, 0, 0, 0.2); box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1); display: flex; flex-direction: row; justify-content: space-between; margin-bottom: 15px; } .bd-modal-wrapper .tab-bar.TOP { margin: 0; border: 0; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .bd-modal-wrapper .tab-bar-container .tab-bar-item { margin: 0 15px; padding: 15px 0; color: #fff; opacity: 0.5; transition: opacity 200ms ease; border-bottom: 2px solid transparent; } .bd-modal-wrapper .tab-bar-container .tab-bar-item:hover { border-color: #fff; cursor: pointer; } .bd-modal-wrapper .tab-bar-container .tab-bar-item.selected { opacity: 1; border-color: #fff; } .bd-modal-wrapper .tab-bar.TOP .tab-bar-item + .tab-bar-item { margin: 0; } .bd-modal-wrapper .table-header { display: flex; justify-content: space-between; color: #fff; font-weight: 700; padding-bottom: 10px; margin: 3px 15px 0 15px; border-bottom: 1px solid #fff; font-size: 14px; } .bd-modal-wrapper .table-column { width: 25%; word-wrap: break-word; } .bd-modal-wrapper .table-column.column-error { width: 50%; } .bd-modal-wrapper .errors { display: flex; flex-direction: column; font-size: 14px; padding: 0 5px; } .bd-modal-wrapper .error { display: flex; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, 0.25); padding: 15px 0; align-items: center; } .bd-modal-wrapper .error-link { color: #3e82e5; font-weight: 500; } .bd-modal-wrapper .bd-content-modal .scroller { padding-top: 0; } .bd-sidebar-header { display: flex; justify-content: space-between; } .bd-sidebar-header .bd-changelog-button { height: 16px; } .bd-sidebar-header .bd-icon { cursor: pointer; fill: #72767d; } .bd-sidebar-header .bd-icon:hover { fill: #fff; } .bd-toasts { position: fixed; display: flex; top: 0; flex-direction: column; align-items: center; justify-content: flex-end; pointer-events: none; z-index: 4000; } @keyframes bd-toast-up { from { transform: translateY(0); opacity: 0; } } .bd-toast { animation: bd-toast-up 300ms ease; transform: translateY(-10px); background: #36393f; padding: 10px; border-radius: 5px; box-shadow: 0 0 0 1px rgba(32, 34, 37, 0.6), 0 2px 10px 0 rgba(0, 0, 0, 0.2); font-weight: 500; color: #fff; font-size: 14px; opacity: 1; margin-top: 10px; pointer-events: none; user-select: none; } @keyframes bd-toast-down { to { transform: translateY(0); opacity: 0; } } .bd-toast.closing { animation: bd-toast-down 200ms ease; animation-fill-mode: forwards; opacity: 1; transform: translateY(-10px); } .bd-toast.icon { padding-left: 30px; background-size: 20px 20px; background-repeat: no-repeat; background-position: 6px 50%; } .bd-toast.toast-info { background-color: #4a90e2; } .bd-toast.toast-info.icon { background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptMSAxNWgtMnYtNmgydjZ6bTAtOGgtMlY3aDJ2MnoiLz48L3N2Zz4="); } .bd-toast.toast-success { background-color: #43b581; } .bd-toast.toast-success.icon { background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptLTIgMTVsLTUtNSAxLjQxLTEuNDFMMTAgMTQuMTdsNy41OS03LjU5TDE5IDhsLTkgOXoiLz48L3N2Zz4="); } .bd-toast.toast-danger, .bd-toast.toast-error { background-color: #f04747; } .bd-toast.toast-danger.icon, .bd-toast.toast-error.icon { background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTEyIDJDNi40NyAyIDIgNi40NyAyIDEyczQuNDcgMTAgMTAgMTAgMTAtNC40NyAxMC0xMFMxNy41MyAyIDEyIDJ6bTUgMTMuNTlMMTUuNTkgMTcgMTIgMTMuNDEgOC40MSAxNyA3IDE1LjU5IDEwLjU5IDEyIDcgOC40MSA4LjQxIDcgMTIgMTAuNTkgMTUuNTkgNyAxNyA4LjQxIDEzLjQxIDEyIDE3IDE1LjU5eiIvPiAgICA8cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PC9zdmc+"); } .bd-toast.toast-warning, .bd-toast.toast-warn { background-color: #ffa600; color: white; } .bd-toast.toast-warning.icon, .bd-toast.toast-warn.icon { background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMSAyMWgyMkwxMiAyIDEgMjF6bTEyLTNoLTJ2LTJoMnYyem0wLTRoLTJ2LTRoMnY0eiIvPjwvc3ZnPg=="); } .bd-button { background-color: #3e82e5; color: white; border-radius: 3px; padding: 2px 6px; } .bd-button:hover { background-color: rgb(56, 117, 206); } .bd-button:active { background-color: rgb(50, 104, 183); } .bd-button.bd-button-success { background-color: #3ac15c; } .bd-button.bd-button-success:hover { background-color: rgb(52, 174, 83); } .bd-button.bd-button-success:active { background-color: rgb(46, 154, 74); } .bd-chat-badge { vertical-align: bottom; line-height: 1.375rem; display: inline-block; height: 1.25rem; } .bd-member-badge { height: 15px; margin-left: 4px; }