API tools faq
paste
NecromancerCoding

Glances Perfil Sencillo

NecromancerCoding
Feb 28th, 2021 (edited)
1,319
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 8.45 KB | None | 0 0
raw download clone embed print report
  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
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!