Advertisement
llcoll

Untitled

Apr 8th, 2016
106
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 51.92 KB | None | 0 0
  1. /* EVERY LINK HAS TO BE HTTPS:// TO WORK IN DISCORD */
  2. .app {
  3. background-image: url("https://thentirety.com/wp-content/uploads/2015/09/esdeath-frozen-swords-anime-girl-akame-ga-kill-1920x1080.jpg") !important;
  4. background-size: cover !important;
  5. }
  6.  
  7. .Select-control {
  8. background: #2E3136;
  9. border: #3DA9A9;
  10. border-color: #3DA9A9 #3DA9A9 #3DA9A9;
  11. }
  12. .form .control-group .Select-control {
  13. border: 1px solid #3DA9A9;
  14. }
  15. .form .control-group .Select-control:hover {
  16. border: 1px solid #3DA9A9;
  17. }
  18. .form .control-group .is-focused:not(.is-open)>.Select-control {
  19. border: 1px solid #3DA9A9;
  20. }
  21. .slider-bar {
  22. background: #393C42;
  23. }
  24. .slider-handle,
  25. .slider-handle span {
  26. background-color: #393C42;
  27. }
  28. .form .control-group .Select-control .Select-placeholder {
  29. color: #787A7B;
  30. }
  31. .tab-bar.SIDE {
  32. overflow-y: hidden;
  33. background-color: #25282B;
  34. }
  35. .create-guild-container .join-server .link-container input {
  36. border: 1px solid #3DA9A9;
  37. }
  38. .create-guild-container .join-server .sample-link {
  39. color: #3DA9A9;
  40. }
  41. .theme-dark .chat>.content .messages .message-group a {
  42. color: #3DA9A9;
  43. }
  44. .need-help-modal .footer {
  45. background-color: #282b30;
  46. border-top: 1px solid #1D1F23;
  47. }
  48. .need-help-modal .header {
  49. background-color: #3DA9A9;
  50. }
  51. .need-help-button:hover {
  52. border-color: #3DA9A9;
  53. color: #3DA9A9;
  54. }
  55. .need-help-button:hover .btn-help {
  56. color: #3DA9A9;
  57. }
  58. .settings .settings-inner {
  59. background-color: #36393e;
  60. }
  61. .notification-settings-modal .mute-server .checkbox .label {
  62. color: #fff;
  63. }
  64. .notification-settings-modal .settings-section {
  65. color: #fff;
  66. }
  67. .channel-notification-settings .content label {
  68. color: #ABAAAA;
  69. }
  70. .scroller-wrap .scroller {
  71. overflow-y: scroll;
  72. }
  73. .channel-notification-settings {
  74. border-bottom: 1px solid #3DA9A9;
  75. }
  76. .notification-settings-modal .notification-settings-modal-channel-settings-list {
  77. box-shadow: 0 -1px #3DA9A9;
  78. }
  79. .chat .new-messages-bar button {
  80. background: #3DA9A9;
  81. border-radius: 5px;
  82. }
  83. .chat .new-messages-bar button:last-child {
  84. color: #fff;
  85. }
  86. .download-apps .platforms .platform.active .download-button,
  87. .change-log .changelog-fixed,
  88. .modal-new-user .steps-wrap .steps li.on,
  89. .modal-new-user .steps-wrap .steps li.on+.divider,
  90. .modal-new-user .steps-wrap .steps li.on:before,
  91. .chat .new-messages-bar:hover {
  92. background-color: #3DA9A9;
  93. }
  94. .radio-image .radio-inner span:after {
  95. opacity: 0;
  96. filter: alpha(opacity=0);
  97. content: '';
  98. position: absolute;
  99. width: 100%;
  100. height: 100%;
  101. border: 2px solid #3DA9A9;
  102. border-radius: 3px;
  103. -webkit-transition: .3s ease;
  104. transition: .3s ease;
  105. left: -2px;
  106. top: -2px;
  107. }
  108. .radio-image:hover span:after {
  109. opacity: .5;
  110. filter: alpha(opacity=50);
  111. border-color: #3DA9A9;
  112. }
  113. .guilds li.active .guild-inner,
  114. .guilds li:hover .guild-inner {
  115. border-radius: 15px;
  116. background: #3DA9A9;
  117. }
  118. .guild-channels ul .channel-voice-states li.speaking .avatar-small {
  119. background-color: #3DA9A9;
  120. cursor: pointer;
  121. border: 2px solid #43b581;
  122. box-shadow: inset 0 0 0 2px #2e3136;
  123. }
  124. #unsupported-browser li:hover {
  125. -webkit-transform: scale(1.04);
  126. transform: scale(1.04);
  127. border-color: #3DA9A9;
  128. }
  129. #unsupported-browser li:hover .browser {
  130. background-position-y: 100px;
  131. }
  132. #unsupported-browser li:hover .btn {
  133. background-color: #3DA9A9;
  134. color: #fff;
  135. border-color: #3DA9A9;
  136. }
  137. .mentioned .highlight:hover {
  138. color: #3DA9A9;
  139. text-decoration: underline;
  140. }
  141. .highlight:hover {
  142. cursor: pointer;
  143. color: #fff;
  144. background-color: #3DA9A9;
  145. }
  146. .tooltip.tooltip-left:after {
  147. position: absolute;
  148. left: 100%;
  149. top: 50%;
  150. border-left-color: #3DA9A9;
  151. margin-top: -5px;
  152. }
  153. .tooltip.tooltip-right:after {
  154. position: absolute;
  155. right: 100%;
  156. top: 50%;
  157. border-right-color: #3DA9A9;
  158. margin-top: -5px;
  159. }
  160. .tooltip {
  161. position: absolute;
  162. background-color: #3DA9A9;
  163. box-shadow: 0 2px 4px 1px rgba(0, 0, 0, .1);
  164. border-radius: 3px;
  165. font-weight: 600;
  166. font-size: 12px;
  167. color: #fff;
  168. z-index: 1002;
  169. max-width: 160px;
  170. box-sizing: border-box;
  171. word-wrap: break-word;
  172. padding: 5px 10px;
  173. }
  174. .tooltip.tooltip-bottom:after {
  175. position: absolute;
  176. bottom: 100%;
  177. left: 50%;
  178. border-bottom-color: #3DA9A9;
  179. margin-left: -5px;
  180. }
  181. .tooltip.tooltip-top:after {
  182. position: absolute;
  183. top: 100%;
  184. left: 50%;
  185. margin-left: -5px;
  186. border-top-color: #3DA9A9;
  187. }
  188. .region-select-modal {
  189. background: #36393e;
  190. }
  191. .region-select-modal .region-select-modal-header {
  192. color: #3DA9A9;
  193. }
  194. .region-select-modal .region-select-modal-option {
  195. background-color: #2e3338;
  196. border: 2px solid #25292d;
  197. }
  198. .region-select-modal .region-select-modal-option:hover {
  199. border-color: #3DA9A9;
  200. }
  201. .form .radio-group .radio {
  202. color: #fff;
  203. }
  204. .need-help-modal .header input[type=text] {
  205. box-shadow: 0 2px 1px #3DA9A9;
  206. }
  207. .change-log {
  208. background: #282D2F;
  209. }
  210. .change-log .header {
  211. color: #2C7E7B;
  212. border-bottom: 1px solid #4C4C4C;
  213. }
  214. .change-log ul li {
  215. color: #2C7E7B;
  216. }
  217. .change-log .footer {
  218. border-top: 1px solid #4C4C4C;
  219. color: #2C7E7B;
  220. background-color: #282D2F;
  221. }
  222. .callout-backdrop {
  223. background-color: rgb(0, 0, 0) !important;
  224. }
  225. .download-apps .platforms .platform {
  226. border: 2px solid #2C7E7B;
  227. }
  228. .download-apps .footer {
  229. color: #2C7E7B;
  230. }
  231. .download-apps .footer a {
  232. color: #3DA9A9;
  233. }
  234. .download-apps .header {
  235. color: #3DA9A9;
  236. }
  237. .download-apps .platforms .platform.active {
  238. border-color: #3DA9A9;
  239. }
  240. .user-settings-modal a:hover {
  241. color: #2C7E7B;
  242. }
  243. .private-channels .channel.selected:before {
  244. border-left: 4px solid #3DA9A9;
  245. }
  246. .private-channels .channel:hover:before {
  247. border-left: 4px solid #3DA9A9;
  248. }
  249. .user-settings-modal .voice-settings .reset-voice-settings {
  250. color: #3DA9A9;
  251. }
  252. .user-settings-modal .voice-settings .reset-voice-settings:hover {
  253. color: #2C7E7B;
  254. }
  255. .modal-content .form-inner p {
  256. color: #E6E6E6;
  257. }
  258. .form .form-inner {
  259. background: #34383e;
  260. }
  261. .form .form-actions {
  262. border-top: 1px solid #414958;
  263. }
  264. .form .form-header {
  265. background: #353940;
  266. border-bottom: 1px solid #494C50;
  267. }
  268. .popout header {
  269. background-color: #3DA9A9;
  270. }
  271. .popout section {
  272. background-color: hsl(218, 7%, 23%);
  273. }
  274. #voice-connection-popout hr {
  275. border: 1px solid #4C4C4C;
  276. }
  277. .small-popout-box {
  278. background: #282B30;
  279. border: 1px solid #24272B;
  280. }
  281. .option-popout .btn-item:hover {
  282. color: #BBBBBB;
  283. }
  284. .member-roles .member-role {
  285. background-color: #3DA9A9;
  286. color: #ffffff;
  287. border: 1px solid #3DA9A9;
  288. }
  289. .user-popout .user-popout-options .btn {
  290. background-color: #3DA9A9;
  291. border: 1px solid #3DA9A9;
  292. }
  293. .user-popout .user-popout-options .btn:hover {
  294. background-color: #2C7E7B;
  295. }
  296. .chat .welcome-message h1 {
  297. color: #3DA9A9;
  298. width: 260px;
  299. }
  300. .channel-members .invite-btn {
  301. background-color: #3DA9A9;
  302. }
  303. .channel-members .invite-btn:hover {
  304. background-color: #2C7E7B;
  305. }
  306. .instant-invite-popout hr {
  307. border: 1px solid #3DA9A9;
  308. }
  309. .instant-invite-popout a {
  310. color: #3DA9A9;
  311. }
  312. .instant-invite-popout a:hover {
  313. color: #2C7E7B;
  314. }
  315. .clipboard-input-inner input::selection {
  316. background: #3DA9A9;
  317. }
  318. .clipboard-input-inner button {
  319. border-left: 1px solid #424549;
  320. background-color: #282B30;
  321. }
  322. .clipboard-input-inner input {
  323. color: #2C7E7B;
  324. background: #424549;
  325. }
  326. .clipboard-input-inner {
  327. background: #1C1E22;
  328. border: 1px solid #2E3136;
  329. }
  330. .clipboard-input-inner button:first-of-type:before {
  331. background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), #313131);
  332. }
  333. ::selection {
  334. color: #fff;
  335. background: #3DA9A9;
  336. }
  337. .theme-dark .chat .welcome-message a {
  338. color: #3DA9A9;
  339. }
  340. #settings-roles .roles li.selected {
  341. background: none;
  342. }
  343. #permissions ul li {
  344. color: #F4F4F4;
  345. }
  346. #permissions .permission-actions>div {
  347. background-color: #2E3136;
  348. border: 2px solid #2A2C31;
  349. }
  350. #permissions .permission-actions>div.PASSTHROUGH:hover {
  351. border: #51555F;
  352. }
  353. #settings-roles .roles header {
  354. border-bottom: 1px solid #2A2C31;
  355. }
  356. #settings-roles .roles {
  357. border-right: 1px solid #3DA9A9;
  358. }
  359. .btn-help:hover {
  360. background: #3DA9A9;
  361. }
  362. #permissions .permissions-helpdesk {
  363. color: #3DA9A9;
  364. }
  365. #permissions .permissions-helpdesk:hover {
  366. color: #2C7E7B;
  367. }
  368. #settings-roles .roles li.selected:before {
  369. background-color: #3DA9A9;
  370. }
  371. #settings-roles .roles li:hover:before {
  372. background-color: #2C7E7B;
  373. }
  374. .instant-invites .instant-invites-header {
  375. border-bottom: 1px solid #3DA9A9;
  376. }
  377. .instant-invites .instant-invite-buttons .btn {
  378. background: #3DA9A9;
  379. }
  380. .instant-invites .instant-invite-buttons .btn.btn-danger {
  381. border: 1px solid #AD392D;
  382. color: #fff
  383. }
  384. .instant-invites .instant-invite-buttons .btn.btn-danger:hover {
  385. background: #FF1700;
  386. }
  387. .instant-invites .instant-invites-list .instant-invite .member {
  388. color: #C3C3C3;
  389. }
  390. #permissions .permission-actions.disabled>div {
  391. border: #565963;
  392. background: #565963;
  393. position: relative;
  394. }
  395. .checkbox .checkbox-inner span {
  396. border: 2px solid #8E8E8E;
  397. }
  398. .form .control-group .help-text {
  399. color: #B6BBC1;
  400. }
  401. .avatar-uploader a {
  402. color: #3DA9A9;
  403. }
  404. .avatar-uploader a:hover {
  405. color: #2C7E7B;
  406. }
  407. .instant-invites .instant-invites-list .instant-invite .show-channel .channel {
  408. color: #B3B3B3;
  409. }
  410. .instant-invites .instant-invites-list .instant-invite+.instant-invite {
  411. border-top: 1px solid #3DA9A9;
  412. }
  413. .form .control-groups.control-separator {
  414. border-top: 1px solid #3DA9A9;
  415. }
  416. .guild-settings-modal-integrations .guild-settings-modal-integrations-header {
  417. color: #CCCCCC;
  418. border-bottom: 1px solid #2A2C31;
  419. box-shadow: none;
  420. }
  421. .guild-settings-modal-integrations .guild-settings-modal-integrations-body.no-integrations p {
  422. color: rgb(220, 220, 220);
  423. }
  424. .guild-settings-modal-integrations .guild-settings-modal-integrations-body.no-integrations p a {
  425. color: #F40000;
  426. }
  427. .guild-settings-modal-members .guild-settings-modal-list .member .member-username {
  428. color: #CECECE;
  429. }
  430. .guild-settings-modal-members .guild-settings-modal-members-header {
  431. border-bottom: 1px solid #2E3136;
  432. }
  433. #autocomplete-popout .empty:hover {
  434. background-color: #2E3136;
  435. }
  436. #autocomplete-popout .empty h4 {
  437. color: #3DA9A9;
  438. }
  439. #autocomplete-popout h3 {
  440. color: #ECECEC;
  441. }
  442. .popout.popout-bottom header:before {
  443. border-bottom-color: #3DA9A9;
  444. }
  445. .guild-settings-modal .guild-settings-modal-search {
  446. border: 1px solid #2E3136;
  447. }
  448. .guild-settings-modal .guild-settings-modal-search:focus {
  449. border: 1px solid #24272b;
  450. }
  451. .guild-settings-modal-members .guild-settings-modal-members-footer a {
  452. color: #3DA9A9;
  453. }
  454. .guild-settings-modal-members .guild-settings-modal-members-footer a:hover {
  455. color: #2C7E7B;
  456. }
  457. .guild-settings-modal-members .guild-settings-modal-members-footer {
  458. border-top: 1px solid #2E3136;
  459. }
  460. #settings-roles .roles li:hover {
  461. background: none;
  462. }
  463. .form hr {
  464. border-bottom: 1px solid #3DA9A9;
  465. }
  466. .user-popout .user-popout-options .btn.btn-server {
  467. color: #fff;
  468. background-color: #3DA9A9;
  469. border-color: #3DA9A9;
  470. }
  471. .user-popout .user-popout-options .btn.btn-server:hover {
  472. border-color: #3DA9A9;
  473. background-color: #2C7E7B;
  474. }
  475. .member-roles .manipulate:hover {
  476. border-color: #3DA9A9;
  477. background-color: #2C7E7B;
  478. }
  479. #user-profile-modal header {
  480. background-image: none;
  481. background-color: #3DA9A9;
  482. }
  483. #user-profile-modal .scroller {
  484. background: #2E3136;
  485. }
  486. #user-profile-modal .friends .friend:hover {
  487. background: #26292D;
  488. color: #ADADAD;
  489. }
  490. .need-help-modal a:hover {
  491. color: #2C7E7B;
  492. }
  493. #user-profile-modal footer {
  494. background: #1e2124;
  495. }
  496. #user-profile-modal footer button {
  497. color: #3DA9A9
  498. }
  499. .avatar-large {
  500. width: 33px;
  501. height: 33px;
  502. background-size: 33px 33px;
  503. left: 8px;
  504. }
  505. .channel-textarea {
  506. margin: 10px 0 30px;
  507. }
  508. .theme-dark .chat form {
  509. border-top: none;
  510. }
  511. .guilds li.active .guild-inner:before {
  512. background: #3DA9A9;
  513. }
  514. .guilds li.unread .guild-inner:before {
  515. background: #2C7E7B;
  516. }
  517. .guild-channels ul .channel-text.unread:not(.selected):not(.channel-muted):before {
  518. background: #2C7E7B;
  519. }
  520. .theme-dark .hljs {
  521. border: 1px solid transparent;
  522. border-radius: 4px;
  523. }
  524. .theme-dark .chat>.content .messages .divider:not(.red) div {
  525. background: transparent;
  526. }
  527. .theme-dark .chat>.content .messages .divider span {
  528. background: transparent;
  529. }
  530. .chat .divider>span {
  531. color: #F1F1F1;
  532. }
  533. .message-group .comment .markup pre {
  534. background: #282B30;
  535. border: 2px solid #282B30;
  536. }
  537. .message-group .comment .markup pre code {
  538. background: #282B30;
  539. color: #D4D4D4;
  540. }
  541. .theme-dark .chat .title-wrap .topic a {
  542. color: #3DA9A9;
  543. }
  544. .guilds .friends-icon:hover {
  545. color: transparent;
  546. background-color: #3DA9A9;
  547. }
  548. #autocomplete-popout .row.selected a,
  549. #autocomplete-popout .row:hover a {
  550. color: #D4D4D5;
  551. }
  552. #autocomplete-popout .row.selected,
  553. #autocomplete-popout .row:hover {
  554. background: linear-gradient(90deg, #36393F, #303238);
  555. }
  556. .download-apps .platforms .platform.active p {
  557. color: #3DA9A9;
  558. }
  559. .download-apps .platforms .platform .icon.apple.active {
  560. background-image: url(https://discordapp.com/assets/57568e1cfc37c81cf56db9498b4f128a.svg);
  561. }
  562. .download-apps .platforms .platform .icon.windows.active {
  563. background-image: url(https://discordapp.com/assets/d6221c5e88f5cb89f125868c077e9859.svg);
  564. }
  565. .download-apps .platforms .platform .icon.ios.active {
  566. background-image: url(https://discordapp.com/assets/0c460e9b848f5c4cc964ae9c62c0f9b9.svg);
  567. }
  568. .download-apps .platforms .platform .icon.android.active {
  569. background-image: url(https://discordapp.com/assets/d73fd4014c02b360d9529a720ecb7c44.svg);
  570. }
  571. .create-guild-container {
  572. background-color: transparent;
  573. }
  574. .form .form-inner {
  575. background-image: Justincase("https://i.imgur.com/KCLIPt4.gif");
  576. background-size: 40px 40px;
  577. background-repeat: no-repeat;
  578. background-position: 50% 74%;
  579. }
  580. .need-help-button {
  581. visibility: hidden;
  582. }
  583. .guilds-add {
  584. color: transparent !important;
  585. background-image: url("https://i.imgur.com/1MfzLoF.png") !important;
  586. background-size: 30px 30px !important;
  587. background-repeat: no-repeat !important;
  588. background-position: 9px 9px !important;
  589. background-color: rgba(21, 21, 21, 0.41) !important;
  590. opacity: 0.7 !important;
  591. }
  592. .slider-handle span {
  593. border: 1px solid #3DA9A9;
  594. }
  595. .slider-handle span:after,
  596. .slider-handle span:before {
  597. content: none;
  598. }
  599. .popout section:after,
  600. .popout section:before {
  601. content: none;
  602. }
  603. .chat .welcome-message .item-container .icon.exclamation {
  604. background-image: url("https://i.imgur.com/DYPXksE.png");
  605. background-repeat: no-repeat;
  606. background-size: 20px 20px;
  607. background-position: 29px 13px;
  608. }
  609. .chat .welcome-message .item-container .icon.share {
  610. background-image: url("https://i.imgur.com/DYPXksE.png");
  611. background-repeat: no-repeat;
  612. background-size: 20px 20px;
  613. background-position: 29px 13px;
  614. }
  615. .chat .welcome-message .item-container .icon.apps {
  616. background-image: url("https://i.imgur.com/DYPXksE.png");
  617. background-repeat: no-repeat;
  618. background-size: 20px 20px;
  619. background-position: 29px 13px;
  620. }
  621. .chat .welcome-message .item-container .icon.mobile {
  622. background-image: url("https://i.imgur.com/DYPXksE.png");
  623. background-repeat: no-repeat;
  624. background-size: 20px 20px;
  625. background-position: 29px 13px;
  626. }
  627. .chat .welcome-message .item-container .icon.twitter {
  628. background-image: url("https://i.imgur.com/DYPXksE.png");
  629. background-repeat: no-repeat;
  630. background-size: 20px 20px;
  631. background-position: 29px 13px;
  632. }
  633. .user-settings-modal button.preview-sound:before {
  634. background-image: url("https://i.imgur.com/E8gsoBs.png");
  635. }
  636. .chat .new-messages-bar button:first-child {
  637. border-radius: 5px;
  638. margin-right: -14px;
  639. }
  640. .chat .new-messages-bar {
  641. background-color: transparent !important;
  642. opacity: 0.8;
  643. }
  644. .account {
  645. background-repeat: no-repeat;
  646. background-position: 12px 11px;
  647. }
  648. .create-guild-container .action.create .action-icon {
  649. background-image: url("https://i.imgur.com/MW4Ddjc.png");
  650. height: 78px;
  651. background-size: 112px 78px;
  652. background-repeat: no-repeat;
  653. background-position: 55px 0px;
  654. }
  655. .user-settings-modal-games {
  656. background: #2E3136;
  657. border-top: 1px solid #404040;
  658. color: #E2E2E3;
  659. }
  660. .user-settings-modal-games .games-table .games-row .item-game .last-played {
  661. color: #E2E2E3;
  662. }
  663. .user-settings-modal-games .games-table .games-row .item-game .game-input {
  664. color: #E2E2E3;
  665. }
  666. .user-settings-modal-games .games-table .games-row .item-game {
  667. border-bottom: 1px solid #404040;
  668. }
  669. .user-settings-modal-games .games-table .games-row .item-overlay {
  670. border-bottom: 1px solid #404040;
  671. }
  672. .now-playing {
  673. background: #3DA9A9;
  674. }
  675. .checkbox .checkbox-inner.alt input[type=checkbox]+span {
  676. background: #2E3136;
  677. border-color: #8E8E8E;
  678. }
  679. .checkbox .checkbox-inner.alt input[type=checkbox]:checked+span:after {
  680. border-color: #43B581;
  681. }
  682. .sensitivity .slider .slider-bar-auto {
  683. background-color: #393C42;
  684. }
  685. .user-settings-modal-keybinds .user-settings-modal-keybinds-header {
  686. border-bottom: 1px solid #404040;
  687. }
  688. .user-settings-modal-connections .user-settings-modal-accounts-list .connect-container .btn {
  689. background: #2E3136;
  690. border: 2px solid #282B2F;
  691. background-repeat: no-repeat;
  692. background-position: 50%;
  693. }
  694. .alert.form .form-inner .btn {
  695. border: 1px solid #2C7E7B;
  696. }
  697. .alert.form .form-inner .cancel {
  698. border-color: #99aab5 !important;
  699. }
  700. .user-settings-modal .account-warning {
  701. border: 1px solid #B54343;
  702. background: #B54343;
  703. color: #F5FBF9;
  704. }
  705. .user-settings-modal-games .games-table .games-row .item-game .icon {
  706. background-image: url(https://i.imgur.com/DYCx6qB.png);
  707. background-repeat: no-repeat;
  708. background-position: -13px -14px;
  709. background-size: 42px;
  710. }
  711. .theme-dark .chat>.content .messages .divider:not(.red) span {
  712. opacity: .9;
  713. }
  714. .create-guild-container .action.join .action-icon {
  715. background: url(https://i.imgur.com/5s2wOtM.png) 50% no-repeat;
  716. height: 78px;
  717. background-size: 178.5px 78px;
  718. }
  719.  
  720. .links li+li:after {
  721. content: '\2022';
  722. color: #535559;
  723. margin-left: 6px;
  724. }
  725. .message-group h2 strong {
  726. color: #aaaba7;
  727. }
  728. #emote-menu,
  729. #tc-settings-panel,
  730. .tc-switch {
  731. border: 1px solid #2B2B2B;
  732. }
  733. .emote-container:hover {
  734. background: #3DA9A9;
  735. }
  736. .spinner-wandering-cubes .spinner-item {
  737. background-color: #3DA9A9;
  738. }
  739. #bd-ps-container {
  740. border: 1px solid transparent;
  741. border-radius: 4px;
  742. opacity: 0.9;
  743. }
  744. #bd-ps-header {
  745. background: #1E2124;
  746. border-bottom: 1px solid #24272B;
  747. }
  748. #bd-ps-body table tr {
  749. border-bottom: 1px solid #2E3136 !important;
  750. background-color: none;
  751. }
  752. #bd-ps-body table th {
  753. background-color: #25272B;
  754. }
  755. textarea {
  756. background: transparent !important;
  757. }
  758. .help-container {
  759. display: none;
  760. }
  761. .links {
  762. border-top: 0px solid transparent;
  763. }
  764. .links li a {
  765. color: #8C8F94;
  766. }
  767. .links,
  768. .chat,
  769. .typing,
  770. .content,
  771. .guild-channels,
  772. .private-channels,
  773. .guild-header header,
  774. .divider-red span,
  775. .messages-wrapper,
  776. #voice-connection {
  777. background: transparent !important;
  778. }
  779. .guilds-wrapper {
  780. background: rgba(0, 0, 0, 0.6) !important
  781. }
  782. .channels-wrap {
  783. background: rgba(0, 0, 0, 0.75)
  784. }
  785. .content .flex-spacer {
  786. background: rgba(0, 0, 0, 0.85)
  787. }
  788. .channel-members {
  789. background: rgba(0, 0, 0, 0.9) !important
  790. }
  791. .guilds-wrapper {
  792. box-shadow: inset -10px 0px 20px -10px rgba(0, 0, 0, 0.2);
  793. }
  794. .guild-header ul {
  795. background: rgba(0, 0, 0, 0.52) !important;
  796. transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28) !important;
  797. padding-top: 100px;
  798. top: -56px;
  799. }
  800. .guilds-add {
  801. opacity: 0.5;
  802. }
  803. .guilds-wrapper {
  804. border-right: 1px solid rgba(0, 0, 0, 0.4);
  805. }
  806. .guild-header header span {
  807. margin-left: -5px;
  808. }
  809. .guild-header header {
  810. box-shadow: none !important;
  811. color: #ddd;
  812. }
  813. .guild-channels header h2,
  814. .guild-channels ul .channel a {
  815. color: #fff;
  816. }
  817. .guilds {
  818. padding: 18px 20px 85px 20px;
  819. }
  820. .guilds-add {
  821. font-size: 30px;
  822. background: #000;
  823. }
  824. .guilds .friends-online {
  825. margin-left: -5px;
  826. }
  827. .guilds li .guild-inner {
  828. background: rgba(21, 21, 21, 0.41) !important;
  829. }
  830. .guilds li .guild-inner a,
  831. .guilds li,
  832. .guilds li .avatar-small {
  833. width: 50px;
  834. height: 50px;
  835. }
  836. .guilds li .avatar-small {
  837. width: 50px;
  838. height: 50px;
  839. background-size: 50px 50px;
  840. }
  841. .guilds li .guild-inner {
  842. line-height: 50px;
  843. }
  844. .guilds .friends-icon {
  845. width: 50px;
  846. height: 50px;
  847. background-size: 25px 19px;
  848. }
  849. .guilds li.audio .guild-inner:after {
  850. background-size: 12px;
  851. background-color: rgba(0, 0, 0, 0.8);
  852. }
  853. .guilds-separator:after {
  854. background: rgba(28, 28, 28, 0.52) !important;
  855. }
  856. .guilds li .guild-inner:before {
  857. left: -26px;
  858. }
  859. .guild-channels header h2,
  860. .private-channels header {
  861. opacity: .6;
  862. }
  863. .private-channels .search-bar {
  864. background: rgba(10, 13, 16, 0) !important;
  865. }
  866. .private-channels .search-bar input {
  867. background: rgba(0, 0, 0, 0.4) !important;
  868. }
  869. .search-bar-clear:before {
  870. background: rgba(0, 0, 0, 0.68);
  871. }
  872. .guild-channels ul .channel.selected,
  873. .private-channels .channel.selected,
  874. .private-channels .search-result.selected,
  875. .private-channels .search-result:hover {
  876. background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.6) 85%, rgba(46, 49, 54, 0)) !important;
  877. }
  878. .guild-channels ul .channel:not(.selected):hover,
  879. .private-channels .channel:not(.selected):hover {
  880. background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.3) 85%, rgba(46, 49, 54, 0)) !important;
  881. }
  882. .btn-hamburger {
  883. margin-right: -25px;
  884. }
  885. .btn-hamburger span {
  886. background: #fff;
  887. }
  888. .account {
  889. padding: 0 15px !important;
  890. background: rgba(0, 0, 0, 0);
  891. height: 77px;
  892. border: 0px solid transparent;
  893. }
  894. .account .status {
  895. border: 2px solid rgba(0, 0, 0, 1);
  896. }
  897. .account .btn {
  898. background: transparent;
  899. box-shadow: none !important;
  900. }
  901. .account .btn:active {
  902. background: rgba(0, 0, 0, 0.26);
  903. }
  904. .account .btn-deafen,
  905. .account .btn-mute {
  906. border-right: none;
  907. }
  908. #voice-connection {
  909. border-top: none !important;
  910. padding: 15px 20px 15px 18px !important;
  911. }
  912. #voice-connection .btn {
  913. background: rgba(0, 0, 0, 0.45);
  914. box-shadow: none !important;
  915. }
  916. #voice-connection .btn:active {
  917. background: rgba(0, 0, 0, 0.6);
  918. }
  919. .account .btn-deafen,
  920. .account .btn-settings {
  921. box-shadow: none !important;
  922. }
  923. .account .btn-group,
  924. #voice-connection .btn-group {
  925. border: none;
  926. }
  927. .title-wrap {
  928. border-bottom: 1px solid rgba(0, 0, 0, 0.3) !important;
  929. background: rgba(0, 0, 0, 0.88) !important;
  930. }
  931. .chat .divider:not(.divider-red)>div {
  932. background: rgba(255, 255, 255, 0.2) !important;
  933. }
  934. .chat .divider>span {
  935. background: rgba(255, 255, 255, 0.2) !important;
  936. font-size: 12px;
  937. text-transform: uppercase;
  938. margin: 10px 0px;
  939. border-radius: 3px;
  940. opacity: 1;
  941. padding: 5px 15px;
  942. width: 100%;
  943. text-align: center;
  944. }
  945. .chat .divider.divider-red>span {
  946. background: rgba(240, 71, 71, .6) !important;
  947. color: rgba(255, 255, 255, 0.8) !important;
  948. }
  949. .chat .divider:not(.divider-red)>span {
  950. color: rgba(255, 255, 255, 1) !important;
  951. }
  952. .chat .divider>div {
  953. display: none;
  954. }
  955. .chat .new-messages-bar {
  956. background-color: rgba(29, 101, 134, .9);
  957. }
  958. .chat .new-messages-bar:hover {
  959. background-color: rgba(29, 101, 134, 1);
  960. }
  961. .chat .new-messages-bar button:last-child {
  962. color: rgba(255, 255, 255, 0.5);
  963. }
  964. .chat-empty {
  965. background: rgba(20, 23, 27, 0.95);
  966. }
  967. .chat>.title-wrap>.topic {
  968. font-size: 12px;
  969. margin-top: 5px;
  970. color: #656565 !important;
  971. }
  972. .chat>.content .messages .message-group:not(.has-divider) {
  973. border-bottom-color: hsla(0, 0%, 100%, .04) !important;
  974. }
  975. .chat>.content .messages .message-group .markup .highlight {
  976. color: #ddd !important;
  977. padding: 1px 4px;
  978. border-radius: 6px;
  979. -webkit-transition: all 0.3s ease;
  980. -moz-transition: all 0.3s ease;
  981. -o-transition: all 0.3s ease;
  982. -ms-transition: all 0.3s ease;
  983. }
  984. .chat>.content .messages .message-group .markup .highlight:hover {
  985. color: #fff !important;
  986. }
  987. .chat>.content .messages .message-group .markup {
  988. color: rgba(255, 255, 255, 0.5) !important;
  989. line-height: 1.5em;
  990. }
  991. .chat>.content .messages .message-group h2 .user-name {
  992. color: rgba(255, 255, 255, 0.8);
  993. }
  994. .chat>.content .messages .message-group h2 span {
  995. color: rgba(255, 255, 255, 0.2) !important;
  996. }
  997. .chat>.content .messages .message-group .markup pre {
  998. background: transparent !important;
  999. border-color: rgba(255, 255, 255, 0.1) !important;
  1000. }
  1001. .chat>.content .messages .message-group .markup pre code.hljs {
  1002. background: rgba(0, 0, 0, 0.42) !important;
  1003. color: rgba(255, 255, 255, 0.7) !important;
  1004. padding: 1em !important;
  1005. }
  1006. .chat>.content .messages .message-group .markup code.inline {
  1007. background: rgba(255, 255, 255, 0.1) !important;
  1008. color: rgba(255, 255, 255, 0.7) !important;
  1009. padding: 0.3em 0.6em;
  1010. }
  1011. .channel-textarea-upload {
  1012. border-right-color: hsla(0, 0%, 100%, .1) !important;
  1013. }
  1014. .channel-textarea-inner {
  1015. border: 2px solid rgba(255, 255, 255, 0.1) !important;
  1016. background: rgba(0, 0, 0, 0.6) !important;
  1017. }
  1018. .typing {
  1019. font-size: 11px;
  1020. }
  1021. .spoiler span {
  1022. display: none;
  1023. }
  1024. .spoiler:before {
  1025. padding-top: 7px;
  1026. padding-bottom: 3px;
  1027. min-height: 18px;
  1028. background: none;
  1029. }
  1030. #twitchcord-button {
  1031. background-size: 24px;
  1032. background-position: 20px;
  1033. background-color: transparent;
  1034. }
  1035. .message-group.compact .timestamp {
  1036. position: relative;
  1037. top: -4px;
  1038. }
  1039. .message-group.compact .message .markup .user-name {
  1040. margin-right: 10px;
  1041. }
  1042. .add-friend-popout .btn:disabled {
  1043. opacity: 0.4;
  1044. }
  1045. .private-channels .channel.btn-friends .badge {
  1046. margin-right: 10px;
  1047. }
  1048. #friends {
  1049. background: transparent !important;
  1050. }
  1051. .friends-header {
  1052. background: rgba(0, 0, 0, 0.88) !important;
  1053. }
  1054. .friends-table {
  1055. background: rgba(0, 0, 0, 0.85) !important;
  1056. margin-top: 0 !important;
  1057. }
  1058. .friends-table .friends-table-body {
  1059. padding-top: 20px !important;
  1060. }
  1061. .friends-table .friends-row:hover {
  1062. background: rgba(0, 0, 0, 0.35) !important;
  1063. }
  1064. .channel-members .member:hover {
  1065. background: rgba(255, 255, 255, 0.07) !important;
  1066. }
  1067. .channel-members .member .member-username {
  1068. font-size: 14px;
  1069. }
  1070. .channel-members .avatar-small .status {
  1071. border-color: rgba(0, 0, 0, 0.7) !important;
  1072. }
  1073. .user-popout .user-popout-options .btn:hover {
  1074. border: 1px solid #3DA9A9;
  1075. }
  1076. .tooltip {
  1077. color: #e0e0e0;
  1078. }
  1079. .bd-minimal .guilds {
  1080. padding-left: 10px !important;
  1081. }
  1082. .bd-minimal .guilds .friends-icon {
  1083. background-size: 60%;
  1084. }
  1085. .bd-minimal .guilds li .guild-inner:before {
  1086. height: 25px;
  1087. border-radius: 5px;
  1088. margin-top: -13px;
  1089. }
  1090. .bd-minimal .guilds li.unread .guild-inner:before {
  1091. width: 10px;
  1092. height: 10px;
  1093. margin-top: -5px;
  1094. left: -16px;
  1095. }
  1096. .bd-minimal .guilds li.active .guild-inner:before {
  1097. left: -18px;
  1098. border-radius: 5px;
  1099. height: 25px;
  1100. margin-top: -13px;
  1101. }
  1102. .bd-minimal .guilds li,
  1103. .bd-minimal .guilds li .avatar-small,
  1104. .bd-minimal .guilds li .guild-inner,
  1105. .bd-minimal .guilds li .guild-inner a,
  1106. .bd-minimal .guilds .friends-icon {
  1107. width: 25px;
  1108. height: 25px;
  1109. line-height: 25px;
  1110. }
  1111. .bd-minimal .guilds li .avatar-small,
  1112. #bd-pub-button {
  1113. font-size: 10px !important;
  1114. }
  1115. .bd-minimal .chat>.title-wrap>.title {
  1116. font-size: 16px;
  1117. }
  1118. .bd-minimal .theme-dark .comment {
  1119. border-left: none !important;
  1120. padding-left: 10px;
  1121. }
  1122. .bd-minimal .message-group {
  1123. padding: 10px 5px;
  1124. }
  1125. .bd-minimal .guild-channels ul .channel-text .channel-name {
  1126. padding-left: 5px;
  1127. }
  1128. .bd-minimal .avatar-large {
  1129. border-radius: 100%;
  1130. }
  1131. .bd-minimal .message-group .edit-message .edit-container-outer {
  1132. margin-left: 50px;
  1133. }
  1134. .bd-minimal .message-group .edit-message .edit-container-inner {
  1135. margin-left: 10px;
  1136. }
  1137. .bd-minimal .channel-members h2 {
  1138. margin-top: 20px;
  1139. margin-bottom: 3px;
  1140. padding-left: 20px;
  1141. }
  1142. .bd-minimal .channel-members h2:first-of-type {
  1143. margin-top: 0px;
  1144. margin-bottom: 3px;
  1145. }
  1146. .bd-minimal .channel-members .member {
  1147. padding: 5px 15px 8px 20px;
  1148. }
  1149. .bd-minimal .guild-header header span {
  1150. margin-left: -13px;
  1151. font-size: 14px;
  1152. }
  1153. .bd-minimal .guild-channels ul .channel-text.unread:not(.selected):not(.channel-muted):before {
  1154. top: 9px;
  1155. width: 10px;
  1156. height: 10px;
  1157. }
  1158. .bd-minimal .guild-channels h2 {
  1159. margin-left: 10px;
  1160. }
  1161. .bd-minimal #voice-connection {
  1162. width: 176px;
  1163. margin-left: -46px;
  1164. }
  1165. .bd-minimal .account {
  1166. width: 176px;
  1167. margin-left: -46px;
  1168. }
  1169. .bd-minimal .account .avatar-small {
  1170. display: block !important;
  1171. }
  1172. .bd-minimal .account .username {
  1173. display: none;
  1174. }
  1175. .bd-minimal .account .btn-group {
  1176. margin-left: 10px;
  1177. }
  1178. .bd-minimal .account .btn-group .btn {
  1179. width: 30px;
  1180. }
  1181. .settings .settings-header {
  1182. background: #1a1d20 !important;
  1183. }
  1184. .channel-notification-settings .content .content-inner {
  1185. background: transparent !important;
  1186. }
  1187. .theme-dark .chat>.content .messages .message-group .comment .markup {
  1188. color: #fff;
  1189. }
  1190. .guild-channels ul .channel-text:hover:not(.unread):before {
  1191. border-left: 4px solid #3DA9A9;
  1192. }
  1193. .guild-channels ul .channel-text.selected:before {
  1194. border-left: 4px solid #3DA9A9;
  1195. }
  1196. .guilds li.active .guild-inner,
  1197. .guilds li:hover .guild-inner {
  1198. background: #3DA9A9 !important;
  1199. }
  1200. .theme-dark .chat>.content:first-child .scroller-wrap::-webkit-scrollbar-thumb {
  1201. background-color: #3DA9A9;
  1202. }
  1203. .guild-header ul a.red-highlight {
  1204. color: #3DA9A9;
  1205. }
  1206. .create-guild-container .create-or-join .form-inner {
  1207. background-color: #282b30;
  1208. }
  1209. .create-guild-container .action {
  1210. background: #31343A;
  1211. }
  1212. .create-guild-container .create-or-join .actions .or {
  1213. background-image: none;
  1214. color: #282B30;
  1215. }
  1216. .form .form-inner {
  1217. background-color: #282B30;
  1218. }
  1219. .form header {
  1220. color: #3DA9A9;
  1221. }
  1222. .form .control-group input[type=email],
  1223. .form .control-group input[type=password],
  1224. .form .control-group input[type=text],
  1225. .form .control-group textarea {
  1226. background: #32353A;
  1227. color: #90A0AA;
  1228. border-bottom: 1px solid #232529;
  1229. border-radius: 3px;
  1230. }
  1231. .form .control-group input[type=email]:focus,
  1232. .form .control-group input[type=password]:focus,
  1233. .form .control-group input[type=text]:focus,
  1234. .form .control-group textarea:focus {
  1235. border-bottom: 2px solid #3DA9A9;
  1236. }
  1237. .region-select {
  1238. background: #32353A;
  1239. }
  1240. .region-select .region-select-inner {
  1241. background: #32353A;
  1242. border: 1px solid #232529;
  1243. }
  1244. .region-select button {
  1245. background-color: #32353A;
  1246. border: 1px solid #232529;
  1247. color: #3DA9A9;
  1248. }
  1249. .region-select:hover .region-select-inner,
  1250. .region-select:hover button {
  1251. border-color: #3DA9A9;
  1252. }
  1253. .region-select:hover button {
  1254. background-color: #3DA9A9;
  1255. }
  1256. .create-guild-container h5 {
  1257. color: #3DA9A9;
  1258. }
  1259. .avatar-uploader .avatar-uploader-inner {
  1260. background-color: #3DA9A9;
  1261. border: 5px solid #2C7E7B;
  1262. }
  1263. .form .form-actions {
  1264. background-color: #282B30;
  1265. border-top: 1px solid #232529;
  1266. }
  1267. .form .btn-default {
  1268. background-color: #282B30;
  1269. border-bottom: 2px solid #282B30;
  1270. border-radius: 5px;
  1271. width: 62px;
  1272. }
  1273. .form .btn-primary {
  1274. background-color: #3DA9A9;
  1275. }
  1276. .create-guild-container .action.create .action-header {
  1277. color: #3DA9A9;
  1278. }
  1279. .create-guild-container .action:hover.create .btn {
  1280. background-color: #2C7E7B;
  1281. }
  1282. .form .btn-primary:hover {
  1283. background-color: #2C7E7B;
  1284. }
  1285. .scroller-wrap .scroller::-webkit-scrollbar-thumb {
  1286. background-color: #3DA9A9 !important;
  1287. border: 3px solid rgba(211, 5, 5, 0) !important;
  1288. }
  1289. .scroller-wrap .scroller::-webkit-scrollbar-track-piece {
  1290. background-color: #3DA9A9 !important;
  1291. border: 3px solid rgba(211, 5, 5, 0) !important;
  1292. }
  1293. .tab-bar.SIDE .tab-bar-item:before {
  1294. border-left: 4px solid #3DA9A9;
  1295. }
  1296. a:link {
  1297. color: #3DA9A9;
  1298. }
  1299. .user-settings-modal a {
  1300. color: #3DA9A9;
  1301. }
  1302. .user-settings-modal .settings-wrapper,
  1303. .user-settings-modal .voice-settings {
  1304. background: #2E3136;
  1305. }
  1306. .settings .settings-actions {
  1307. background-color: #2E3136;
  1308. border-top: 1px solid #3DA9A9;
  1309. }
  1310. .checkbox .checkbox-inner+span {
  1311. color: #fff
  1312. }
  1313. .highlight {
  1314. color: #3DA9A9;
  1315. }
  1316. .user-settings-modal-connections .user-settings-modal-accounts-list .connect-container .name {
  1317. color: #fff;
  1318. }
  1319. .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations.no-integrations {
  1320. color: rgba(222, 222, 222, 0.59);
  1321. }
  1322. .user-settings-modal-connections .user-settings-modal-connections-list .connection .connection-integrations {
  1323. border: 1px solid #404040;
  1324. }
  1325. .user-settings-modal-connections .user-settings-modal-connections-list {
  1326. box-shadow: 0 -1px #404040;
  1327. }
  1328. .tab-bar.TOP .tab-bar-item.selected {
  1329. border-bottom: 2px solid #3DA9A9;
  1330. color: #3DA9A9;
  1331. }
  1332. .checkbox .checkbox-inner input[type=checkbox]:checked+span {
  1333. background-color: #3DA9A9 !important;
  1334. border-color: #3DA9A9 !important;
  1335. }
  1336. .radio .radio-inner span:after {
  1337. background: #3DA9A9;
  1338. }
  1339. .slider-bar-fill {
  1340. background: #3DA9A9;
  1341. }
  1342. .slider-handle {
  1343. border: 1px solid #3DA9A9;
  1344. }
  1345. .radio .radio-inner {
  1346. background: #454950;
  1347. border: 2px solid #3DA9A9;
  1348. }
  1349. .tab-bar.TOP {
  1350. border-bottom: 1px solid #3DA9A9;
  1351. }
  1352. #bd-ps-body table tr:nth-child(odd):hover {
  1353. background-color: #3DA9A9;
  1354. }
  1355. .guild-settings-modal-members .member-buttons .btn {
  1356. background: #3DA9A9;
  1357. border: 1px solid #3DA9A9;
  1358. color: #EFEFEF;
  1359. }
  1360. .guild-settings-modal-members .member-buttons .btn.btn-danger:hover {
  1361. background: #2C7E7B;
  1362. }
  1363. .guild-settings-modal-members .member-buttons .btn.btn-danger {
  1364. border: 1px solid #2C7E7B;
  1365. color: #FFFFFF;
  1366. }
  1367. .guild-settings-modal-members .guild-settings-modal-list .member+.member {
  1368. border-top: 1px solid #2E3136;
  1369. }
  1370. .member-roles .member-role .member-role-remove {
  1371. background: url(https://i.imgur.com/O2TX2bn.png) 50% no-repeat;
  1372. width: 8px;
  1373. height: 12px;
  1374. background-size: 8px;
  1375. }
  1376. .member-roles .member-role .member-role-add {
  1377. background: url(https://i.imgur.com/1MfzLoF.png) 50% no-repeat;
  1378. width: 8px;
  1379. height: 12px;
  1380. background-size: 10px;
  1381. }
  1382. .member-roles .member-role:hover {
  1383. background-color: #2C7E7B;
  1384. }
  1385. .guilds-add:hover {
  1386. border-color: hsl(145, 64%, 50%);
  1387. color: transparent;
  1388. opacity: 1.0;
  1389. -webkit-animation: color_change 1s infinite alternate;
  1390. -moz-animation: color_change 1s infinite alternate;
  1391. -ms-animation: color_change 1s infinite alternate;
  1392. -o-animation: color_change 1s infinite alternate;
  1393. animation: color_change 1s infinite alternate;
  1394. }
  1395. @-webkit-keyframes color_change {
  1396. from {
  1397. border-color: #535559;
  1398. }
  1399. to {
  1400. border-color: green;
  1401. }
  1402. }
  1403. @-moz-keyframes color_change {
  1404. from {
  1405. border-color: #535559;
  1406. }
  1407. to {
  1408. border-color: green;
  1409. }
  1410. }
  1411. @-ms-keyframes color_change {
  1412. from {
  1413. border-color: #535559;
  1414. }
  1415. to {
  1416. border-color: green;
  1417. }
  1418. }
  1419. @-o-keyframes color_change {
  1420. from {
  1421. border-color: #535559;
  1422. }
  1423. to {
  1424. border-color: green;
  1425. }
  1426. }
  1427. @keyframes color_change {
  1428. from {
  1429. border-color: #535559;
  1430. }
  1431. to {
  1432. border-color: green;
  1433. }
  1434. }
  1435. .channel-members h2 {
  1436. color: #3DA9A9 !important;
  1437. font-size: 11px;
  1438. text-transform: uppercase;
  1439. letter-spacing: .08em;
  1440. font-weight: 600;
  1441. padding: 4px 58px;
  1442. background-color: rgba(0, 0, 0, 0.24);
  1443. border: 1px solid;
  1444. border-color: transparent;
  1445. border-radius: 3px;
  1446. width: 90px;
  1447. margin-left: 15px;
  1448. text-align: center
  1449. }
  1450. .private-channels .search-result.selected:before,
  1451. .private-channels .search-result:hover:before {
  1452. border-left: 4px solid #2C7E7B;
  1453. }
  1454. /*[[Onlineon]]*/
  1455. /*[[Onlineoff]]*/
  1456. .channel-members-wrap {
  1457. min-width: 240px;
  1458. display: -webkit-box;
  1459. display: -webkit-flex;
  1460. display: -ms-flexbox;
  1461. display: box;
  1462. display: flex;
  1463. }
  1464. .message-group .edit-message .channel-textarea-inner {
  1465. border-color: #3DA9A9;
  1466. }
  1467. .channel-members .member .member-game strong {
  1468. color: #3DA9A9;
  1469. }
  1470. .spoiler {
  1471. Background-color: rgba(125, 58, 114, 0.28);
  1472. border: 1px solid;
  1473. border-color: transparent;
  1474. border-radius: 6px;
  1475. cursor: pointer;
  1476. }
  1477. #bd-ps-body table tr:hover {
  1478. background-color: #3DA9A9;
  1479. }
  1480. @keyframes swing {
  1481. 0% {
  1482. transform: rotate(0deg);
  1483. -webkit-transform: rotate(0deg);
  1484. -moz-transform: rotate(0deg);
  1485. -o-transform: rotate(0deg);
  1486. -ms-transform: rotate(0deg);
  1487. }
  1488. 25% {
  1489. transform: rotate(-30deg);
  1490. -webkit-transform: rotate(-30deg);
  1491. -moz-transform: rotate(-30deg);
  1492. -o-transform: rotate(-30deg);
  1493. -ms-transform: rotate(-30deg);
  1494. }
  1495. 50% {
  1496. transform: rotate(0deg);
  1497. -webkit-transform: rotate(0deg);
  1498. -moz-transform: rotate(0deg);
  1499. -o-transform: rotate(0deg);
  1500. -ms-transform: rotate(0deg);
  1501. }
  1502. 75% {
  1503. transform: rotate(30deg);
  1504. -webkit-transform: rotate(30deg);
  1505. -moz-transform: rotate(30deg);
  1506. -o-transform: rotate(30deg);
  1507. -ms-transform: rotate(30deg);
  1508. }
  1509. 100% {
  1510. transform: rotate(0deg);
  1511. -webkit-transform: rotate(0deg);
  1512. -moz-transform: rotate(0deg);
  1513. -o-transform: rotate(0deg);
  1514. -ms-transform: rotate(0deg);
  1515. }
  1516. }
  1517. @-webkit-keyframes swing {
  1518. 0% {
  1519. transform: rotate(0deg);
  1520. -webkit-transform: rotate(0deg);
  1521. -moz-transform: rotate(0deg);
  1522. -o-transform: rotate(0deg);
  1523. -ms-transform: rotate(0deg);
  1524. }
  1525. 25% {
  1526. transform: rotate(-30deg);
  1527. -webkit-transform: rotate(-30deg);
  1528. -moz-transform: rotate(-30deg);
  1529. -o-transform: rotate(-30deg);
  1530. -ms-transform: rotate(-30deg);
  1531. }
  1532. 50% {
  1533. transform: rotate(0deg);
  1534. -webkit-transform: rotate(0deg);
  1535. -moz-transform: rotate(0deg);
  1536. -o-transform: rotate(0deg);
  1537. -ms-transform: rotate(0deg);
  1538. }
  1539. 75% {
  1540. transform: rotate(30deg);
  1541. -webkit-transform: rotate(30deg);
  1542. -moz-transform: rotate(30deg);
  1543. -o-transform: rotate(30deg);
  1544. -ms-transform: rotate(30deg);
  1545. }
  1546. 100% {
  1547. transform: rotate(0deg);
  1548. -webkit-transform: rotate(0deg);
  1549. -moz-transform: rotate(0deg);
  1550. -o-transform: rotate(0deg);
  1551. -ms-transform: rotate(0deg);
  1552. }
  1553. }
  1554. @keyframes swing1 {
  1555. 0% {
  1556. left: -15px;
  1557. right: 0;
  1558. }
  1559. 25% {
  1560. left: -100px;
  1561. right: 0;
  1562. }
  1563. 50% {
  1564. left: -15px;
  1565. right: 0;
  1566. }
  1567. 75% {
  1568. left: 0;
  1569. right: -100px;
  1570. }
  1571. 100% {
  1572. left: -15px;
  1573. right: 0;
  1574. }
  1575. }
  1576. @-webkit-keyframes swing1 {
  1577. 0% {
  1578. left: -15px;
  1579. right: 0;
  1580. }
  1581. 25% {
  1582. left: -100px;
  1583. right: 0;
  1584. }
  1585. 50% {
  1586. left: -15px;
  1587. right: 0;
  1588. }
  1589. 75% {
  1590. left: 0;
  1591. right: -100px;
  1592. }
  1593. 100% {
  1594. left: -15px;
  1595. right: 0;
  1596. }
  1597. }
  1598. .theme-dark .chat .title-wrap .channel-mute-button:hover {
  1599. animation: swing 4s infinite linear;
  1600. -webkit-animation: swing 4s infinite linear;
  1601. }
  1602. @-webkit-keyframes load8 {
  1603. 0% {
  1604. -webkit-transform: rotate(0deg);
  1605. transform: rotate(0deg);
  1606. }
  1607. 100% {
  1608. -webkit-transform: rotate(360deg);
  1609. transform: rotate(360deg);
  1610. }
  1611. }
  1612. @keyframes load8 {
  1613. 0% {
  1614. -webkit-transform: rotate(0deg);
  1615. transform: rotate(0deg);
  1616. }
  1617. 100% {
  1618. -webkit-transform: rotate(360deg);
  1619. transform: rotate(360deg);
  1620. }
  1621. }
  1622. .account .btn-settings:hover:after {
  1623. -webkit-transform: translateZ(0);
  1624. -ms-transform: translateZ(0);
  1625. transform: translateZ(0);
  1626. -webkit-animation: load8 2.8s infinite linear;
  1627. animation: load8 2.8s infinite linear;
  1628. }
  1629. .guilds li .badge {
  1630. animation: zoom 2s infinite;
  1631. }
  1632. @keyframes zoom {
  1633. 0% {
  1634. -webkit-transform: scale(1, 1);
  1635. }
  1636. 50% {
  1637. -webkit-transform: scale(1.2, 1.2);
  1638. }
  1639. 100% {
  1640. -webkit-transform: scale(1, 1);
  1641. }
  1642. }
  1643. .guild-channels ul .channel-voice.locked:hover .icon-lock {
  1644. animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
  1645. }
  1646. @keyframes shake {
  1647. 10%, 90% {
  1648. transform: translate3d(-1px, 0, 0);
  1649. }
  1650. 20%,
  1651. 80% {
  1652. transform: translate3d(2px, 0, 0);
  1653. }
  1654. 30%,
  1655. 50%,
  1656. 70% {
  1657. transform: translate3d(-4px, 0, 0);
  1658. }
  1659. 40%,
  1660. 60% {
  1661. transform: translate3d(4px, 0, 0);
  1662. }
  1663. }
  1664. .guild-channels ul .channel-voice.locked {
  1665. cursor: pointer;
  1666. }
  1667. .theme-dark #friends .friends-header .tab-bar .tab-bar-item.selected {
  1668. background-color: #43B581;
  1669. color: #fff;
  1670. }
  1671. #friends .btn {
  1672. background-color: #3DA9A9;
  1673. }
  1674. #friends .btn:hover {
  1675. background-color: #2C7E7B;
  1676. }
  1677. .private-channels .channel.selected .icon-friends {
  1678. background-color: #2C7E7B;
  1679. }
  1680. .add-friend-popout {
  1681. background: transparent;
  1682. }
  1683. .add-friend-popout header input:focus {
  1684. border-color: hsla(0, 0%, 100%, .3);
  1685. }
  1686. .add-friend-popout .btn:disabled {
  1687. background-color: #2C7E7B;
  1688. }
  1689. #user-profile-modal .sub-header {
  1690. background: #2E3136;
  1691. }
  1692. #user-profile-modal .tab-bar {
  1693. background: #2E3136;
  1694. border-bottom: 1px solid #2B2B2B;
  1695. }
  1696. #user-profile-modal .btn {
  1697. background-color: #3DA9A9;
  1698. }
  1699. #user-profile-modal .btn:hover {
  1700. background-color: #2C7E7B;
  1701. }
  1702. #user-profile-modal .header {
  1703. background-color: #3DA9A9;
  1704. background-image: none;
  1705. }
  1706. .context-menu {
  1707. background: #2E3136;
  1708. }
  1709. .context-menu .item:hover {
  1710. background: #292B2F;
  1711. }
  1712. #user-profile-modal .guilds .guild:hover {
  1713. background: linear-gradient(90deg, #27292D 90%, #2E3136);
  1714. color: #D8D8D8;
  1715. }
  1716. #user-profile-modal .empty {
  1717. background: #2E3136;
  1718. }
  1719. /*[[Hidden]]*/
  1720. /*[[Visible]]*/
  1721. .message-group-blocked {
  1722. background: #fcfcfc;
  1723. -webkit-box-pack: center;
  1724. -o-box-pack: center;
  1725. -ms-flex-pack: center;
  1726. -webkit-justify-content: center;
  1727. justify-content: center;
  1728. border: 1px solid #e3e5e7;
  1729. border-radius: 3px;
  1730. margin: 6px 6px 6px 19px;
  1731. display: none;
  1732. }
  1733. .user-settings-modal-account .discord-tag {
  1734. color: #3DA9A9;
  1735. }
  1736. .guilds .friends-online {
  1737. text-transform: uppercase;
  1738. font-weight: 600;
  1739. color: #DCDCDC;
  1740. margin: 10px -5px;
  1741. word-wrap: normal;
  1742. white-space: normal;
  1743. width: 50px;
  1744. cursor: pointer;
  1745. -webkit-transition: background-color .25s ease-in, border-radius .3s cubic-bezier(.68, -1.25, .228, 1.8);
  1746. transition: background-color .25s ease-in, border-radius .3s cubic-bezier(.68, -1.25, .228, 1.8);
  1747. overflow: hidden;
  1748. border-radius: 25px;
  1749. background: rgba(21, 21, 21, 0.41) !important;
  1750. font-size: 9px;
  1751. text-align: center;
  1752. line-height: 17px;
  1753. }
  1754. .guilds .friends-online:hover {
  1755. background: #43B581 !important;
  1756. }
  1757. .add-friend-popout-info .add-friend-popout-info-confirmation:before {
  1758. background: url(https://i.imgur.com/DYCx6qB.png) 50% no-repeat;
  1759. content: ' ';
  1760. width: 17px;
  1761. height: 16px;
  1762. background-size: 40px 39px;
  1763. display: inline-block;
  1764. vertical-align: middle;
  1765. margin-top: -8px;
  1766. margin-right: 4px;
  1767. }
  1768. .message-group .btn-option:hover {
  1769. -webkit-transform: translateZ(0);
  1770. -ms-transform: translateZ(0);
  1771. transform: translateZ(0);
  1772. -webkit-animation: load8 2.8s infinite linear;
  1773. animation: load8 2.8s infinite linear;
  1774. }
  1775. .chat .has-more button {
  1776. color: #3DA9A9;
  1777. }
  1778. .theme-dark #friends .friends-table .friends-table-header .friends-column:after {
  1779. content: "Actions";
  1780. color: hsla(0, 0%, 100%, .3);
  1781. font-size: 12px;
  1782. text-transform: uppercase;
  1783. letter-spacing: .025em;
  1784. font-weight: 600;
  1785. -webkit-flex-shrink: 0;
  1786. flex-shrink: 0;
  1787. }
  1788. .theme-dark .friends-table .messages .message-group .comment .markup pre,
  1789. .theme-dark .messages-wrapper .messages .message-group .comment .markup pre {
  1790. background: rgba(46, 49, 54, 0.32);
  1791. border-color: #282b30;
  1792. }
  1793. .theme-dark .channel-members .member.popout-open,
  1794. .theme-dark .channel-members .member:hover {
  1795. background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.3) 85%, rgba(46, 49, 54, 0)) !important;
  1796. }
  1797. .scroller-wrap .scroller::-webkit-scrollbar-track-piece {
  1798. border: 3px solid rgba(255, 255, 255, 0) !important;
  1799. background-color: rgba(0, 0, 0, 0.3) !important;
  1800. }
  1801. .theme-dark #friends .friends-header .tab-bar .tab-bar-item:hover:not(.selected) {
  1802. background: rgba(0, 0, 0, 0.29);
  1803. }
  1804. .theme-dark .friends-table .messages .message-group .comment .markup .highlight:hover, .theme-dark .messages-wrapper .messages .message-group .comment .markup .highlight:hover {
  1805. background-color: #3DA9A9;
  1806. }
  1807. .user-popout {
  1808. opacity: 1;
  1809. }
  1810. .user-settings-modal.settings {
  1811. opacity: 1;
  1812. /*[[NSFWON]]*/
  1813. /*[[NSFWOFF]]*/
  1814. }
  1815. .message-group .image {
  1816. -webkit-filter: none;
  1817. }
  1818. .message-group .image:hover {
  1819. -webkit-filter: none;
  1820. }
  1821. .channel-textarea-autocomplete-inner {
  1822. background:rgba(0,0,0,0.84)!important;
  1823. border:none !important;
  1824. }
  1825.  
  1826. .channel-textarea-autocomplete-inner:after {
  1827. display:none;
  1828. }
  1829.  
  1830. .channel-textarea-autocomplete-inner header {
  1831. background:rgba(0,0,0,0.84)!important;
  1832. border-radius:5px 5px 0 0;
  1833. border:none !important;
  1834. }
  1835.  
  1836. .channel-textarea-autocomplete ul li.active {
  1837. background:rgba(255,255,255,0.1)!important;
  1838. }
  1839. #user-profile-modal .avatar-profile {
  1840. border: 6px solid #3DA9A9 !important;
  1841. }
  1842. #user-profile-modal footer .btn.disabled {
  1843. background: #8E8E8E !important;
  1844. }
  1845. #user-profile-modal footer .btn.disabled:hover {
  1846. background: #777777 !important;
  1847. }
  1848. span.discriminator {
  1849. font-size: 11px !important;
  1850. color: hsla(0, 0%, 100%, 0.7) !important;
  1851. margin-left: 8px !important;
  1852. border-radius: 5px !important;
  1853. background: rgba(0, 0, 0, 0.19) !important;
  1854. font-weight: bold !important;
  1855. border: 3px solid transparent !important;
  1856. -webkit-transition: all 0.3s ease !important;
  1857. -moz-transition: all 0.3s ease !important;
  1858. -o-transition: all 0.3s ease !important;
  1859. -ms-transition: all 0.3s ease !important;
  1860. }
  1861. span.discriminator:hover {
  1862. background: rgba(0, 0, 0, 0.32) !important;
  1863. color: #fff !important;
  1864. font-size: 14px !important;
  1865. font-weight: bold !important;
  1866. }
  1867. .guilds-error {
  1868. width: 40px !important;
  1869. height: 40px !important;
  1870. line-height: 39px !important;
  1871. }
  1872. .theme-dark .friends-table .messages .invite-button, .theme-dark .messages-wrapper .messages .invite-button {
  1873. background-color: rgba(0, 0, 0, 0.54);
  1874. border-color: rgba(0, 0, 0, 0.35);
  1875. }
  1876. .invite-button-icon {
  1877. background-color: rgba(0, 0, 0, 0.62);
  1878. border: 1px solid #000000;
  1879. }
  1880. .private-channels .channel .icon-friends {
  1881. background-color: rgba(21, 21, 21, 0.41) !important;
  1882. }
  1883. .upload-modal {
  1884. background-color: rgba(30, 30, 30, 0.78);
  1885. }
  1886. .upload-modal .footer {
  1887. background-color: rgba(0, 0, 0, 0.44);
  1888. }
  1889. .upload-modal .inner {
  1890. border:2px dashed rgba(6, 6, 6, 0.52);
  1891. }
  1892. .upload-modal .footer .button {
  1893. background-color: #3DA9A9;
  1894. }
  1895. .upload-modal .footer .button-primary {
  1896. color: #3DA9A9;
  1897. background-color: #fff;
  1898. }
  1899. div.control-group .shortcut-recorder input[type=text] {
  1900. border: 1px solid #3DA9A9;
  1901. text-shadow: 0 0 0 #FFFFFF;
  1902. }
  1903. .private-channels .search-bar input:focus {
  1904. border: 2px solid #3DA9A9;
  1905. webkit-animation: input-pulse 1.5s infinite;
  1906. animation: input-pulse 1.5s infinite;
  1907. }
  1908. @-webkit-keyframes input-pulse {
  1909. 0% {
  1910. box-shadow: 0 0 0 0 #3DA9A9;
  1911. }
  1912. 70% {
  1913. box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0)
  1914. }
  1915. to {
  1916. box-shadow: 0 0 0 0 rgba(241, 71, 71, 0)
  1917. }
  1918. }
  1919. @keyframes input-pulse {
  1920. 0% {
  1921. box-shadow: 0 0 0 0 #3DA9A9;
  1922. }
  1923. 70% {
  1924. box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0)
  1925. }
  1926. to {
  1927. box-shadow: 0 0 0 0 rgba(241, 71, 71, 0)
  1928. }
  1929. }
  1930. .bot-tag {
  1931. background: rgba(255, 255, 255, 0.28);
  1932. color: rgba(255, 255, 255, 0.62);
  1933. }
  1934. .bot-tag.bot-tag-invert {
  1935. font-size: 11px !important;
  1936. color: hsla(0, 0%, 100%, 0.7) !important;
  1937. margin-left: 8px !important;
  1938. border-radius: 5px !important;
  1939. background: rgba(0, 0, 0, 0.19) !important;
  1940. font-weight: bold !important;
  1941. border: 3px solid transparent !important;
  1942. padding: 0px;
  1943. }
  1944. .channel-members .member.member-status-offline .avatar-small {
  1945. -webkit-filter: grayscale(100%) blur(1px);
  1946. position: relative;
  1947. -webkit-transition: all .8s ease;
  1948. -moz-transition: all .8s ease;
  1949. -o-transition: all .8s ease;
  1950. transition: all .8s ease;
  1951. -webkit-transform: translateZ(0px);
  1952. transform: translateZ(0px);
  1953. }
  1954. .channel-members .member.popout-open .avatar-small, .channel-members .member:hover .avatar-small {
  1955. -webkit-filter: none !important;
  1956. filter: none;
  1957. position: relative;
  1958. -webkit-transition: all .8s ease-out;
  1959. -moz-transition: all .8s ease-out;
  1960. -o-transition: all .8s ease-out;
  1961. transition: all .8s ease-out;
  1962. -webkit-transform: translateZ(0px);
  1963. transform: translateZ(0px);
  1964. }
  1965. .offline {
  1966. background-color: #982929;
  1967. }
  1968. .status-offline {
  1969. background-color: #982929;
  1970. }
  1971. @-webkit-keyframes friend-request-pulse {
  1972. 0% {
  1973. box-shadow: 0 0 0 0 #43b581;
  1974. }
  1975. 70% {
  1976. box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0)
  1977. }
  1978. to {
  1979. box-shadow: 0 0 0 0 rgba(241, 71, 71, 0)
  1980. }
  1981. }
  1982. @keyframes friend-request-pulse {
  1983. 0% {
  1984. box-shadow: 0 0 0 0 #43b581;
  1985. }
  1986. 70% {
  1987. box-shadow: 0 0 10px 10px rgba(241, 71, 71, 0)
  1988. }
  1989. to {
  1990. box-shadow: 0 0 0 0 rgba(241, 71, 71, 0)
  1991. }
  1992. }
  1993. #user-profile-modal footer .btn.add-friend {
  1994. webkit-animation: friend-request-pulse 1.5s infinite;
  1995. animation: friend-request-pulse 1.5s infinite;
  1996. }
  1997. #user-profile-modal .guilds .avatar-large {
  1998. background: #3DA9A9;
  1999. }
  2000. img.image {
  2001. border-radius: 5px;
  2002. }
  2003. #voice-connection .btn {
  2004. background: rgba(0, 0, 0, 0.45);
  2005. box-shadow: none !important;
  2006. border-radius: 40px;
  2007. }
  2008. .account .btn-deafen, .account .btn-mute, .account .btn-settings {
  2009. background: rgba(0, 0, 0, 0.45);
  2010. box-shadow: none !important;
  2011. border-radius: 40px;
  2012. }
  2013. #connecting {
  2014. background: rgba( 0, 0, 0,.80);
  2015. }
  2016. #connecting video.ready {
  2017. visibility: hidden;
  2018. }
  2019. #connecting video {
  2020. visibility: hidden;
  2021. }
  2022. #connecting .quote {
  2023. margin-bottom: 10px;
  2024. color: #fff;
  2025. font-weight: 400;
  2026. font-style: italic;
  2027. font-size: 16px;
  2028. visibility: hidden;
  2029. }
  2030. #connecting img,
  2031. #connecting video {
  2032. visibility: hidden;
  2033. }
  2034. #connecting .attribution {
  2035. visibility: hidden;
  2036. }
  2037. #connecting .attribution, #connecting .connection-status, #connecting .quote {
  2038. margin-bottom: -122px;
  2039. font-size: 30px;
  2040. text-align: center;
  2041. webkit-animation: pulse 1.5s infinite;
  2042. animation: pulse 1.5s infinite;
  2043. }
  2044. @-webkit-keyframes pulse {
  2045. 0% { -webkit-transform: scale(1); }
  2046. 50% { -webkit-transform: scale(1.1); }
  2047. 100% { -webkit-transform: scale(1); }
  2048. }
  2049. @keyframes pulse {
  2050. 0% { transform: scale(1); }
  2051. 50% { transform: scale(1.1); }
  2052. 100% { transform: scale(1); }
  2053. }
  2054. .account .btn-settings:after {
  2055. opacity: .3;
  2056. }
  2057. .guild-header ul li:hover a {
  2058. background-color: hsla(0, 0%, 0%, 0.78);
  2059. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement