Frontend elements to SugoiMusic, including CSS and public/private headers.
No puede seleccionar más de 25 temas Los temas deben comenzar con una letra o número, pueden incluir guiones ('-') y pueden tener hasta 35 caracteres de largo.
 
 
 

940 líneas
14 KiB

  1. .box h3 {
  2. font-size: 140%;
  3. }
  4. .box h4 {
  5. font-size: 130%;
  6. }
  7. .box h5 {
  8. font-size: 120%;
  9. }
  10. .box h6 {
  11. font-size: 110%;
  12. }
  13. .thin {
  14. box-sizing: border-box;
  15. }
  16. .flex_input_container {
  17. display: flex;
  18. }
  19. .flex_input_container > input[type=text]{
  20. flex-grow: 1;
  21. box-sizing: border-box;
  22. width: 50%;
  23. }
  24. .body, .profileinfo {
  25. word-wrap: break-word;
  26. word-break: break-all;
  27. word-break: break-word;
  28. hyphens: auto;
  29. }
  30. input, textarea {
  31. border: 1px solid #c7c7c7;
  32. background-color: white;
  33. padding: 10px 9px;
  34. color: black;
  35. outline: none;
  36. }
  37. select {
  38. padding: 5px 10px;
  39. background-color: white;
  40. border: 1px solid #c7c7c7;
  41. color: black;
  42. border-radius: 0px;
  43. outline: 0;
  44. -webkit-appearance: none;
  45. -moz-appearance: none;
  46. appearance: none;
  47. }
  48. h2 .group_cat {
  49. height: 16px;
  50. width: 16px;
  51. margin: 0 8px;
  52. display: inline-block;
  53. background-size: 16px 16px;
  54. }
  55. code {
  56. white-space: pre;
  57. }
  58. pre > br, code > br {
  59. line-height: 0px;
  60. display: none;
  61. }
  62. .center {
  63. text-align: center;
  64. }
  65. .collage_images {
  66. padding: 0px;
  67. width: 100%;
  68. border-collapse: collapse;
  69. font-size: 0;
  70. }
  71. .collage_images {
  72. display: block;
  73. }
  74. ul.collage_images li {
  75. border: none;
  76. float: left;
  77. margin: 0;
  78. /* width: 118px;
  79. height: 118px;
  80. width: 146px; */
  81. width: 146px;
  82. list-style: none;
  83. list-style-type: none;
  84. }
  85. ul.collage_images li a {
  86. display: block;
  87. /* height: 118px; */
  88. width: 100%;
  89. overflow: hidden;
  90. }
  91. ul.collage_images img {
  92. /* height: 118px;
  93. width: 118px; */
  94. }
  95. div.collage_image {
  96. width: 20%;
  97. }
  98. [data-toggle-target], [data-quote-jump] {
  99. cursor: pointer;
  100. }
  101. button, input[type=button], input[type=submit] {
  102. cursor: pointer;
  103. background: #fff;
  104. font-size: 11px;
  105. padding: 10px 9px;
  106. border: none;
  107. color: #000;
  108. }
  109. .spoilerButton {
  110. overflow: hidden;
  111. text-overflow: ellipsis;
  112. }
  113. .selected a {
  114. font-weight: bold;
  115. text-decoration: underline;
  116. }
  117. .invisible {
  118. visibility: hidden;
  119. }
  120. .collage td {
  121. padding: 0px;
  122. border: none;
  123. }
  124. abbr[title] {
  125. text-decoration: none;
  126. }
  127. .line_new {
  128. color: green;
  129. }
  130. .line_deleted {
  131. color: red;
  132. }
  133. .line_moved {
  134. color: blue;
  135. }
  136. .line_unchanged {
  137. }
  138. .log1 {
  139. }
  140. .log2 {
  141. color: yellow;
  142. }
  143. .log3 {
  144. color: #0E88C6;
  145. }
  146. .log4 {
  147. font-weight: bold;
  148. }
  149. .log5 {
  150. text-decoration: underline;
  151. }
  152. .good {
  153. font-weight: bold;
  154. color: green;
  155. }
  156. .bad {
  157. font-weight: bold;
  158. color: red;
  159. }
  160. .goodish {
  161. font-weight: bold;
  162. color: #35BF00;
  163. }
  164. .badish {
  165. font-weight: bold;
  166. color: #E5B244;
  167. }
  168. pre {
  169. overflow: auto;
  170. }
  171. .hidden {
  172. display: none;
  173. }
  174. .disable_grouping {
  175. display: none;
  176. }
  177. form textarea, form input {
  178. max-width: 100%;
  179. box-sizing: border-box;
  180. }
  181. textarea {
  182. width: 100%;
  183. box-sizing: border-box;
  184. }
  185. a.beta {
  186. font-weight: bold;
  187. color: #ff0000;
  188. }
  189. strong.important_text {
  190. color: red;
  191. font-weight: bold;
  192. }
  193. strong.important_text_alt {
  194. color: green;
  195. font-weight: bold;
  196. }
  197. .invalid, .warning, .error, .new {
  198. color: #ff0000;
  199. }
  200. /* Make [+] on add multiple artists stay at the bottom (on torrent details page) */
  201. div#AddArtists {
  202. position: relative;
  203. display: inline-block;
  204. }
  205. div#AddArtists a {
  206. position: absolute;
  207. right: 0pt;
  208. bottom: 0pt;
  209. }
  210. .clear:after {
  211. content: ".";
  212. display: block;
  213. height: 0;
  214. clear: both;
  215. visibility: hidden;
  216. }
  217. .new-subscriptions {
  218. font-weight: bold;
  219. }
  220. #forums #quickpost {
  221. width: 95%;
  222. }
  223. .bbcode_bar {
  224. list-style: none;
  225. margin: 0px 0px -4px;
  226. box-sizing: border-box;
  227. text-align: center;
  228. display: inline-block;
  229. }
  230. .bbcode_bar > li {
  231. display: inline-block;
  232. margin: 0px;
  233. }
  234. .bbcode_bar > li > a {
  235. display: inline-block;
  236. height: 26px;
  237. line-height: 26px;
  238. cursor: pointer;
  239. min-width: 20px;
  240. margin: 0px 4px;
  241. }
  242. td.label, .valign_top {
  243. vertical-align: top;
  244. }
  245. span.rbt {
  246. display: block;
  247. padding: 8px 0 0;
  248. background: url('../rippy/rippy_top.gif') no-repeat top;
  249. }
  250. span.rbm {
  251. display: block;
  252. background: url('../rippy/rippy_middle.gif') repeat bottom;
  253. padding: 0 5px;
  254. }
  255. span.rbb {
  256. display: block;
  257. padding: 4px 0px 18px;
  258. margin-bottom: 5px;
  259. background: url('../rippy/rippy_bottom.gif') no-repeat bottom;
  260. }
  261. span.secondary_class {
  262. font-size: 85%;
  263. font-weight: bold;
  264. }
  265. .breadcrumbs {
  266. font-weight: bold;
  267. text-align: right;
  268. }
  269. .paranoia_override {
  270. font-style: italic;
  271. }
  272. #manage_collage_table.ui-sortable .drag {
  273. cursor: n-resize;
  274. }
  275. #manage_collage_table.ui-sortable .ui-sortable-helper.drag {
  276. cursor: grabbing;
  277. cursor: -moz-grabbing;
  278. cursor: -webkit-grabbing;
  279. }
  280. #manage_collage_table .ui-sortable-helper td, #manage_collage_table .ui-sortable-placeholder {
  281. border: 0;
  282. }
  283. .drag_drop_save {
  284. padding: 6px 0;
  285. overflow: hidden;
  286. }
  287. .headerSort {
  288. cursor: pointer;
  289. }
  290. .headerSort span {
  291. background: url("../common/table-order.png") no-repeat scroll right -38px transparent;
  292. padding: 0px 20px 0 0;
  293. }
  294. .headerSortDown span {
  295. background: url("../common/table-order.png") no-repeat scroll right 4px transparent;
  296. }
  297. .headerSortUp span {
  298. background: url("../common/table-order.png") no-repeat scroll right -79px transparent;
  299. }
  300. .headerSort.sorter-false,
  301. .headerSort.sorter-false span {
  302. background-image: none;
  303. cursor: default;
  304. }
  305. .album_votes {
  306. text-align: center;
  307. }
  308. .favoritecount {
  309. font-size: 150%;
  310. font-weight: bold;
  311. }
  312. .favoritecount_small {
  313. font-size: 110%;
  314. font-weight: bold;
  315. }
  316. ul.votedalbums li {
  317. list-style: none;
  318. list-style-type: none;
  319. margin: 0;
  320. }
  321. tr.torrent .bookmark>a:before {
  322. text-decoration: none;
  323. font-weight: normal;
  324. }
  325. tr.torrent .bookmark>a:after {
  326. text-decoration: none;
  327. font-weight: normal;
  328. }
  329. #sortable {
  330. list-style-type: none;
  331. margin: 0;
  332. padding: 0;
  333. width: 50%;
  334. }
  335. #sortable li {
  336. padding: 0px;
  337. font-size: 1.2em;
  338. height: 1.5em;
  339. }
  340. .ui-state-highlight {
  341. background: #007DC6 /*{bgColorHighlight}*/;
  342. opacity: 0.15;
  343. width: 50%;
  344. }
  345. .navigation_list, .navigation_list ol {
  346. list-style-position: inside;
  347. margin-top: 10px;
  348. margin-bottom: 20px;
  349. }
  350. .navigation_list > li {
  351. list-style-type: upper-roman !important;
  352. }
  353. .navigation_list li li {
  354. list-style-type: decimal;
  355. }
  356. .navigation_list li li li {
  357. list-style-type: lower-roman;
  358. }
  359. .navigation_list li li li li {
  360. list-style-type: lower-alpha;
  361. }
  362. .voted_type {
  363. font-weight: bold;
  364. }
  365. .torrent_table .group .votes_info_td strong {
  366. font-size: inherit;
  367. }
  368. .invite_table td {
  369. min-width: 55px;
  370. }
  371. .preview_wrap {
  372. text-align: left;
  373. }
  374. .text_preview {
  375. min-height: 100px
  376. }
  377. .brackets {
  378. text-indent: 0px;
  379. white-space: nowrap;
  380. cursor: pointer;
  381. }
  382. .votespan.brackets:before {
  383. content: "( ";
  384. }
  385. .votespan.brackets:after {
  386. content: " )";
  387. }
  388. .brackets:before {
  389. content: "[";
  390. }
  391. .brackets:after {
  392. content: "]";
  393. }
  394. #userinfo .brackets:before, #userinfo .brackets:after {
  395. content: "";
  396. }
  397. .group_image {
  398. overflow: hidden;
  399. }
  400. .float_left {
  401. float: left;
  402. }
  403. .float_right {
  404. float: right;
  405. }
  406. .float_clear {
  407. clear: both;
  408. }
  409. .group_image + .group_info {
  410. margin-left: 100px;
  411. }
  412. .group_image img {
  413. cursor: pointer;
  414. }
  415. .user_title {
  416. font-weight: normal;
  417. }
  418. /*
  419. * Fix long filename tables overflowing (Chrome only).
  420. * Stop various release page containers from overflowing with long input.
  421. * !! Be sure to test all major browsers before changing this section. !!
  422. * Fix report information tables overflowing long reports (all browsers).
  423. * Fix long release descriptions overflowing containers (all browsers).
  424. * Fix flowing issues in the report resolving pages.
  425. */
  426. .wrap_overflow, .filelist_table td, .reportinfo_table, .torrentdetails blockquote {
  427. word-break: normal;
  428. -ms-word-wrap: break-word;
  429. word-wrap: break-word;
  430. -webkit-hyphens: auto;
  431. -moz-hyphens: auto;
  432. -ms-hyphens: auto;
  433. hyphens: auto;
  434. /* Note that IE will have different behavior on word-break,
  435. * but this is required to keep the layout from breaking. */
  436. -ms-word-break: break-all;
  437. }
  438. /* Non-web-standard for webkit */
  439. .torrentdetails blockquote {
  440. word-break: break-word;
  441. }
  442. /* Fix long filename tables overflowing (Chrome only). */
  443. .filelist_table td:first-child {
  444. word-break: break-all;
  445. }
  446. /* Fix long overflow for Opera (doesn't support word-break). */
  447. .reportinfo_table {
  448. table-layout: fixed;
  449. }
  450. /* Wrap release info for consistent DOM and to limit table expansion. */
  451. .no_overflow {
  452. width: 100%;
  453. overflow: hidden;
  454. }
  455. /* Stylesheet gallery in user profile editing */
  456. #css_gallery {
  457. overflow: hidden;
  458. margin-top: 10px;
  459. }
  460. .preview_wrapper {
  461. position: relative;
  462. display: inline-block;
  463. width: 40%;
  464. margin: 0 10px;
  465. }
  466. .preview_image {
  467. display: block;
  468. cursor: pointer;
  469. overflow: hidden;
  470. }
  471. .preview_image img {
  472. width: 100%;
  473. }
  474. .preview_name {
  475. text-align: center;
  476. margin-top: 5px;
  477. }
  478. .option_group {
  479. margin-bottom: 10px;
  480. }
  481. .option_group:last-child {
  482. margin-bottom: 0px;
  483. }
  484. .autocomplete-suggestions {
  485. color: #000;
  486. margin-top: 5px;
  487. border: 1px solid #999;
  488. background: #FFF;
  489. overflow: auto;
  490. }
  491. .autocomplete-suggestion {
  492. padding: 2px 5px;
  493. white-space: nowrap;
  494. overflow: hidden;
  495. cursor: pointer;
  496. }
  497. .autocomplete-selected {
  498. background: #F0F0F0;
  499. }
  500. .autocomplete-suggestions strong {
  501. font-weight: normal;
  502. color: #3399FF;
  503. }
  504. .process_info {
  505. table-layout: fixed;
  506. width: 100%;
  507. }
  508. .process_info_pid {
  509. width: 70px;
  510. }
  511. .process_info_data {
  512. overflow: auto;
  513. }
  514. .setting_description > * {
  515. margin: 1em 0 0 0;
  516. }
  517. .settings_sidebar {
  518. min-height: 385px;
  519. }
  520. #settings_sections {
  521. position: absolute;
  522. }
  523. #settings_sections.fixed {
  524. position: fixed;
  525. top: 0px;
  526. }
  527. #settings_sections #submit, #settings_sections #settings_search {
  528. box-sizing: border-box;
  529. -moz-box-sizing: border-box;
  530. width: 100%;
  531. }
  532. #settings_sections h2 {
  533. text-align: left;
  534. }
  535. .forum_post .colhead_dark div {
  536. display: flex;
  537. }
  538. .forum_post .colhead_dark div > *{
  539. margin-left: 2px;
  540. margin-right: 2px;
  541. }
  542. .donor_icon {
  543. margin-left: 2px;
  544. margin-right: 2px;
  545. max-width: 16px;
  546. max-height: 16px;
  547. position: relative;
  548. }
  549. .badge_icon {
  550. margin: 0px 2px;
  551. position: relative;
  552. }
  553. .donation_info {
  554. padding: 10px 10px 10px 20px;
  555. margin-left: 10px;
  556. margin-right: 10px;
  557. margin-bottom: 20px;
  558. }
  559. .donation_info_title {
  560. display: block;
  561. font-size: 1.75em;
  562. -webkit-margin-before: 1em;
  563. -webkit-margin-after: 1em;
  564. -webkit-margin-start: 0px;
  565. -webkit-margin-end: 0px;
  566. font-weight: bold;
  567. margin: 10px 0;
  568. }
  569. .number_column {
  570. text-align: right;
  571. }
  572. .wide_input_text {
  573. width: 95%;
  574. }
  575. .top_artist_list li {
  576. margin-left: 25px;
  577. margin-bottom: 5px;
  578. list-style-type: decimal;
  579. font-size: 150%;
  580. }
  581. .permission_subcontainer {
  582. margin-bottom: 10px;
  583. }
  584. .vote_tag_up, .vote_artist_up, .vote_album_up {
  585. font-weight: bolder;
  586. }
  587. .vote_tag_down, .vote_artist_down, .vote_album_down {
  588. font-weight: bolder;
  589. }
  590. .noborder {
  591. border: none;
  592. }
  593. .two_columns {
  594. float: left;
  595. width: 50%;
  596. box-sizing: border-box;
  597. -moz-box-sizing: border-box;
  598. -webkit-box-sizing: border-box;
  599. }
  600. .field_div {
  601. margin-bottom: 10px;
  602. }
  603. .field_div:last-of-type {
  604. margin-bottom: 0;
  605. }
  606. .field_div .label,
  607. .submit_div .label {
  608. float: left;
  609. padding: 0 5px;
  610. text-align: right;
  611. width: 150px;
  612. }
  613. .field_div .input,
  614. .submit_div .input {
  615. padding: 0 5px;
  616. }
  617. .small_label {
  618. text-align: right;
  619. width: auto;
  620. }
  621. .scale_image {
  622. max-width: 500px;
  623. }
  624. .display_block {
  625. display: block;
  626. }
  627. .sidebar img {
  628. max-width: 100%;
  629. width: initial;
  630. }
  631. .forum_post td img {
  632. max-width: 100%;
  633. }
  634. .avatar > a > img {
  635. display: block;
  636. }
  637. #collage #reply_box img,
  638. #forums #reply_box img {
  639. max-width: 650px;
  640. }
  641. #artistcomments #reply_box img,
  642. #request_comments #reply_box img,
  643. #torrent_comments #reply_box img {
  644. max-width: 400px;
  645. }
  646. #artistcomments img,
  647. #request_comments img,
  648. #torrent_comments img {
  649. max-width: 417px;
  650. }
  651. .blog_post img {
  652. max-width: 825px;
  653. }
  654. .torrent_description blockquote img.scale_image {
  655. max-width: 100%;
  656. }
  657. #artist_information img,
  658. .box_request_desc img,
  659. .news_post img,
  660. .torrent_description img,
  661. .wiki_article img {
  662. max-width: 570px;
  663. }
  664. .torrentdetails img {
  665. max-width: 100%;
  666. }
  667. #inbox #preview img,
  668. #staffpm #reply_box img,
  669. #wiki .create_form img,
  670. #wiki .edit_form img {
  671. max-width: 805px;
  672. }
  673. #inbox .body img {
  674. max-width: 830px;
  675. }
  676. #inbox .search_form input[type="search"] {
  677. width: 100%;
  678. margin: 10px 0px 0px;
  679. }
  680. #inbox .manage_form input[type="submit"] {
  681. margin: 10px 7px 10px 0px;
  682. }
  683. #userform img {
  684. max-width: 490px;
  685. }
  686. video, .profileinfo img {
  687. max-width: 100%;
  688. }
  689. #reportsv2 .manage_form img {
  690. max-width: 616px;
  691. }
  692. .friends_table textarea {
  693. max-width: 540px;
  694. }
  695. div.torrent_artists {
  696. display: inline-block;
  697. }
  698. .torrent_screenshots > img {
  699. width: 50%;
  700. border: 1px solid transparent;
  701. box-sizing: border-box;
  702. vertical-align: top;
  703. }
  704. /* Ratio Colors */
  705. .r00 { color: #FF0000; }
  706. .r01,.r02 { color: #FF1300; }
  707. .r03 { color: #FF2600; }
  708. .r04 { color: #FF4C00; }
  709. .r05,.r06 { color: #FF5E00; }
  710. .r07 { color: #FF7100; }
  711. .r08 { color: #FF9700; }
  712. .r09 { color: #FFAA00; }
  713. .r10 { color: #74C42E; }
  714. .r20,.r50,.r99 { color: #418B00; }
  715. #coverCont.left {
  716. left: 20px;
  717. right: initial;
  718. }
  719. #coverCont {
  720. position: fixed;
  721. right: 20px;
  722. left: initial;
  723. top: 20px;
  724. max-width: 30%;
  725. background-size: contain;
  726. background-repeat: no-repeat;
  727. z-index: 9999;
  728. }
  729. #coverCont img {
  730. max-width: 100%;
  731. }
  732. #covers img {
  733. display: block;
  734. margin-left: auto;
  735. margin-right: auto;
  736. }
  737. .search_warning {
  738. position: absolute;
  739. }
  740. #admincommentlinks {
  741. max-height: 300px;
  742. overflow-y: scroll;
  743. }
  744. .poll_your_answer {
  745. font-weight: bold;
  746. }
  747. .net_box {
  748. display: inline-block;
  749. width: calc(20% - 4px);
  750. margin: 2px;
  751. vertical-align: top;
  752. font-size: 10pt;
  753. }
  754. .net_box > .box {
  755. min-height: 60px;
  756. display: flex;
  757. align-items: center;
  758. }
  759. .net_box > .box > span {
  760. width: 100%;
  761. }
  762. .mediainfo td {
  763. vertical-align: top;
  764. }
  765. .flex {
  766. display: flex;
  767. }
  768. .flex > .grow {
  769. flex-grow: 1
  770. }
  771. .flex > .shrink {
  772. flex-shrink: 1
  773. }
  774. input[type="search"] {
  775. -webkit-appearance: textfield;
  776. }
  777. #lightbox > img {
  778. max-width: 100%;
  779. }