NecromancerCoding

Glances Perfil Sencillo

Feb 28th, 2021 (edited)
1,320
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 8.45 KB | None | 0 0
  1. <script>
  2. $(document).ready(function(){
  3. $('.psname > span').each(function(){
  4. var bodyTitle = $(this).text();
  5. var bodyColor = $(this).css('color');
  6. $(this).parents('html').children('head').children('title').html(bodyTitle);
  7. $(this).parents('#perfilsencillo').prepend('<style>#perfilsencillo {--groups:' + bodyColor + '!important;}</style>');
  8. });
  9. $('.psfield .psflabel span').each(function() {
  10. $(this).parents('.psfield').addClass($(this).text().split(" ")[0].toLowerCase().replace(/'/g, "").replace(/\(|\)/g, ""));
  11. });
  12. });
  13. $(document).ready(function(){
  14. $('.psfield .psfcontent div:contains("-")').each(function(){
  15. var myVar = $(this).text();
  16. var myCount = myVar.length;
  17. if (myCount == 3) {
  18. $(this).parents('.psfield').remove();
  19. }
  20. });
  21. });
  22. $(document).ready(function(){
  23. $('.pscontact img[src*="icon_contact_www.gif"]').parent().html('<em class="fas fa-envelope"></em>').attr('title', 'Mensaje Privado');
  24. $('.pscontact img[src*="icon_contact_pm.png"]').parent().html('<em class="fas fa-id-card"></em>').attr('title', 'Expediente de personaje');
  25. $('.pscontact img[src*="http://placehold.it/1/111.png"]').parent().html('<em class="fas fa-suitcase"></em>').attr('title', 'Baúl');
  26. $('.pscontact img[src*="http://placehold.it/1/222.png"]').parent().html('<em class="fas fa-search"></em>').attr('title', 'Búsqueda');
  27. $('.pscontact a[href*="email"]').remove();
  28. $('.psfield.cita').prependTo('.ps3');
  29. $('.psfield.información').appendTo('#perfilsencillo');
  30. $('.pscontact div:contains("-")').each(function(){
  31. $(this).remove();
  32. });
  33. });
  34. $(window).load(function(){
  35. $('.psfield img').removeAttr('title');
  36. });
  37. </script>
  38. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.13.0/css/all.css"/>
  39. <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"/>
  40. <style>
  41. #perfilsencillo, .psbody, .psheader, .ps3, .pscontact, .pscontact a, .psh1, .psh2 a, .psh2, .ps2, .psfields .psfield, .psfields, .pscontact div {
  42.     display: flex;
  43.     justify-content: center;
  44.     align-items: center;
  45. }
  46.  
  47. #perfilsencillo {
  48.     flex-direction: column;
  49.     margin: 20px auto;
  50.     width:100%;
  51. }
  52.  
  53. #perfilsencillo {
  54.     --border1: 1px solid #0a0a0a;
  55.     --border2: 1px solid rgba(255,255,255,0.2);
  56.     --shadow-d: 1px 1px rgba(0,0,0,0.2), 1px -1px rgba(0,0,0,0.2), -1px 1px rgba(0,0,0,0.2), -1px -1px rgba(0,0,0,0.2);
  57.     --shadow-b: 1px 1px #0a0a0a, -1px 1px #0a0a0a, 1px -1px #0a0a0a, -1px -1px #0a0a0a;
  58.     --dbckg1: #111;
  59.     --dbckg2: #141414;
  60.     --avawidth: 300px;
  61.     --avaheight: 400px;
  62. }
  63.  
  64. .psheader {
  65.     align-self: stretch;
  66.     justify-content: space-between;
  67.     background: var(--dbckg1);
  68.     padding: 20px 20px 20px 30px;
  69.     font: 12px 'Poppins';
  70.     text-transform: uppercase;
  71.     height: 26px;
  72. }
  73.  
  74. .psbody {
  75.     align-self: stretch;
  76.     margin-top: 20px;
  77. }
  78.  
  79. .psh1 {
  80.     font-weight: 700;
  81.     color: #aaa;
  82. }
  83.  
  84. .psonline:before {
  85.     content: "ESTÁ";
  86.     margin: 0 3px;
  87. }
  88.  
  89. .psname strong {
  90.     color: #aaa;
  91. }
  92.  
  93. .psh2 a {
  94.     border: var(--border2);
  95.     background: var(--groups);
  96.     text-shadow:var(--shadow-d);
  97.     height: 24px;
  98.     width: 24px;
  99.     margin-left: 10px;
  100.     border-radius: 100%;
  101.     font-size: 10px;
  102. }
  103.  
  104. .ps1 {
  105.     flex-shrink: 0;
  106. }
  107.  
  108. .psavatar img {
  109.     width: var(--avawidth);
  110.     height: var(--avaheight);
  111.     object-fit: cover;
  112.     object-position: center;
  113.     border: var(--border1);
  114. }
  115.  
  116. .psavatar {
  117.     width: calc(var(--avawidth) + 2px);
  118.     height: calc(var(--avaheight) + 2px);
  119.     padding: 10px;
  120.     background: var(--dbckg2);
  121.     border: var(--border1);
  122. }
  123.  
  124. .ps2, .ps3 {
  125.     margin-left: 20px;
  126.     height: calc(var(--avaheight) + 24px);
  127.     flex-direction: column;
  128. }
  129.  
  130. .ps2 {
  131.     flex-grow: 1;
  132. }
  133.  
  134. .ps3 {
  135.     flex-shrink: 0;
  136.     width: 200px;
  137. }
  138.  
  139. .psfields {
  140.     flex-grow: 1;
  141.     align-self: stretch;
  142.     background: var(--dbckg2);
  143.     border: var(--border1);
  144.     padding:15px;
  145.     flex-direction: column;
  146.     justify-content: flex-start;
  147. }
  148.  
  149. .psfields .psfield {
  150.     justify-content: flex-start;
  151.     padding: 10px 0;
  152.     border-bottom: var(--border1);
  153.     flex-grow: 1;
  154.     text-transform: uppercase;
  155.     font: 12px 'Poppins';
  156.     align-self: stretch;
  157. }
  158.  
  159. .psfields .psfield:first-of-type {
  160.     padding-top: 0;
  161. }
  162.  
  163. .psfields .psfield:last-of-type {
  164.     padding-bottom: 0;
  165.     border-bottom: 0;
  166. }
  167.  
  168. .psfields .psflabel {
  169.     font-size: 0;
  170. }
  171.  
  172. .psfields .psflabel span {
  173.     font-size: 12px;
  174.     font-weight: 700;
  175.     color: var(--groups)!important;
  176. }
  177.  
  178. .psfields .psflabel span:after {content: ":";margin: 0 3px 0 0;}
  179.  
  180. .pscontact:empty {
  181.     display: none;
  182. }
  183.  
  184. .pscontact a, .pscontact div {
  185.     flex-grow: 1;
  186.     margin-left: 20px;
  187. }
  188.  
  189. .pscontact {
  190.     margin-top: 20px;
  191.     align-self: stretch;
  192. }
  193.  
  194. .pscontact div.invisible {
  195.     display: none;
  196. }
  197.  
  198. .pscontact a {
  199.     border: var(--border1);
  200.     background: var(--dbckg1);
  201.     padding: 20px;
  202.     color: var(--groups);
  203. }
  204.  
  205. .pscontact a:hover {
  206.     border: var(--border2);
  207.     background: var(--groups);
  208.     text-shadow:var(--shadow-d);
  209.     color:white;
  210. }
  211.  
  212. .pscontact>*:first-child {
  213.     margin-left: 0;
  214. }
  215.  
  216. .pscontact img {
  217.     display: none;
  218. }
  219.  
  220. .psfield.cita {
  221.     flex-grow: 1;
  222.     align-self: stretch;
  223.     background: var(--dbckg2);
  224.     padding: 20px 15px 20px 20px;
  225.     border: var(--border1);
  226. }
  227.  
  228. .psfield.cita .psflabel {
  229.     display: none;
  230. }
  231.  
  232. .psfield.cita .psfcontent {
  233.     width: 100%;
  234.     height: 100%;
  235.     box-sizing: border-box;
  236.     padding-right: 5px;
  237.     overflow: auto;
  238. }
  239.  
  240. .psfield.información {
  241.     margin-top: 20px;
  242.     border: var(--border1);
  243.     background: var(--dbckg2);
  244. }
  245.  
  246. .ps3:empty {
  247.     display: none;
  248. }
  249.  
  250. .psfield.información .psflabel {
  251.     background: var(--dbckg1);
  252.     padding: 20px;
  253.     font-size: 0;
  254.     border-bottom: var(--border1);
  255. }
  256.  
  257. .psfield.información .psflabel span {
  258.     font: 12px 'Poppins';
  259.     text-transform: uppercase;
  260.     font-weight: 700;
  261. }
  262.  
  263. .psfield.información .psfcontent {
  264.     padding: 20px;
  265.     text-align: justify;
  266. }
  267.  
  268. .psfield.información .psfcontent strong, .psfield.información .psfcontent i, .psfield.información .psfcontent u {
  269.     color: var(--groups);
  270. }
  271.  
  272. .psadmin {
  273.     text-align: center;
  274.     margin-top: 20px;
  275. }
  276.  
  277. .psadmin a {
  278.     font: 12px 'Poppins';
  279.     text-transform: uppercase;
  280.     font-weight: 700;
  281.     border: var(--border1);
  282.     background: var(--dbckg1);
  283.     display: inline-block;
  284.     margin: 0 10px;
  285.     padding: 10px;
  286. }
  287.  
  288. .psrpg {
  289.     margin-top: 20px;
  290.     border: var(--border1);
  291.     background: var(--dbckg2);
  292.     padding: 10px 5px 10px 10px;
  293.   max-height:120px;
  294. }
  295.  
  296. .psrpg:first-child:last-child { max-height:unset; height: 100%; margin: 0; }
  297.  
  298. .psrpg .gen {
  299.     width: 100%;
  300.     height: 100%;
  301.     padding-right: 5px;
  302.     overflow: auto;
  303.     box-sizing: border-box;
  304.     text-align: center;
  305.     display: block;
  306. }
  307.  
  308. .psrpg img {
  309.     margin: 3px;
  310. }
  311. </style>
  312. <div id="perfilsencillo">
  313. <div class="psheader">
  314. <div class="psh1">
  315. <div class="psname">{USERNAME}</div><!-- BEGIN switch_show_status --><div class="psonline">{USER_ONLINE}</div><!-- END switch_show_status -->
  316. </div>
  317. <div class="psh2">
  318. <a href="/sta/{PUSERNAME}" title="Temas donde {PUSERNAME} ha participado"><em class="fas fa-folder-open"></em></a>
  319. <a href="/st/{PUSERNAME}" title="Temas creados por {PUSERNAME}"><em class="fas fa-file-alt"></em></a>
  320. <a href="/spa/{PUSERNAME}" title="Mensajes de {PUSERNAME}"><em class="fas fa-comments"></em></a>
  321. </div>
  322. </div>
  323. <div class="psbody">
  324. <div class="ps1">
  325. <div class="psavatar">{AVATAR_IMG}</div>
  326. </div>
  327. <div class="ps2">
  328. <div class="psfields">
  329. <div class="psfield">
  330. <div class="psflabel"><span style="color:#AAAAAA;">{L_RANK}</span>&nbsp;* :</div>
  331. <div class="psfcontent">{POSTER_RANK}</div>
  332. </div>
  333. <!-- BEGIN profile_field -->
  334. <div class="psfield">
  335. <div class="psflabel">{profile_field.LABEL}</div>
  336. <div class="psfcontent">{profile_field.CONTENT}</div>
  337. </div>
  338. <!-- END profile_field -->
  339. </div>
  340. <div class="pscontact">
  341. <!-- BEGIN contact_field -->
  342. {contact_field.CONTENT}
  343. <!-- END contact_field -->
  344. </div>
  345. </div>
  346. <div class="ps3">
  347. <!-- BEGIN switch_rpg -->
  348. <!-- BEGIN rpg_fields_left -->
  349. <div class="psrpg">{switch_rpg.rpg_fields_left.F_VALUE_NEW}</div>
  350. <!-- END rpg_fields_left -->
  351. <!-- BEGIN rpg_fields -->
  352. <div class="psrpg">{switch_rpg.rpg_fields.F_VALUE_NEW}</div>
  353. <!-- END rpg_fields -->
  354. <!-- END switch_rpg -->
  355. </div>
  356. </div>
  357. </div>
  358.  
  359. <div class="psadmin">{ADMINISTRATE_USER}{BAN_USER}</div>
Add Comment
Please, Sign In to add comment