Advertisement
mochiroll

Shogi.Code (2/10/2020)

Feb 10th, 2020
67
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.76 KB | None | 0 0
  1. [nobr]
  2.  
  3.  
  4. [comment]
  5. Designed and coded by Nano.
  6. Please do not remove the credits or claim the code as your own work.
  7. [/comment]
  8.  
  9.  
  10. [comment]--------------------CS Details--------------------[/comment]
  11.  
  12. [div class="root"]
  13. [div class="flexcontainer"]
  14. [div class="flexbox"]
  15. [div class="seikamainL"]
  16. [div class="seikaIMG clicker" style="background: url('https://dl.dropboxusercontent.com/s/yg07rosap2zk9yb/SeikaMain.jpg') 50% 25%/400px 600px no-repeat;"]
  17. [div class="name"]
  18. [div class="JP"]
  19. 鈴鳴盛夏
  20. [/div]
  21. [div class="EN"]
  22. suzunari seika
  23. [/div]
  24. [/div]
  25. [/div]
  26. [/div]
  27.  
  28.  
  29.  
  30. [div class="tabarea"]
  31. [div class="tabs basicstabs tabselect"][div=display: none;]basics#[/div]
  32. [div class="tabtitle"]
  33. Basics
  34. [/div]
  35. [div class="tabsubtitle"]
  36. general info[color=transparent]xx[/color]appearance[color=transparent]xx[/color]personality
  37. [/div]
  38. [/div]
  39. [div class="tabs detailstabs"][div=display: none;]details#[/div]
  40. [div class="tabtitle"]
  41. Details
  42. [/div]
  43. [div class="tabsubtitle"]
  44. history[color=transparent]xx[/color]relationships[color=transparent]xx[/color]skills
  45. [/div]
  46. [/div]
  47. [div class="tabs skillstabs"][div=display: none;]skills#[/div]
  48. [div class="tabtitle"]
  49. Abilities
  50. [/div]
  51. [div class="tabsubtitle"]
  52. skills
  53. [/div]
  54. [/div]
  55. [div class="tabs extratabs"][div=display: none;]extra#[/div]
  56. [div class="tabtitle"]
  57. Extra
  58. [/div]
  59. [div class="tabsubtitle"]
  60. notes[color=transparent]xx[/color]gallery
  61. [/div]
  62. [/div]
  63. [/div]
  64. [/div]
  65.  
  66.  
  67.  
  68. [div class="flexbox"]
  69. [div class="scrollbox1"]
  70. [div class="JP" style="margin-top: 25px;"]
  71. 将棋
  72. [/div]
  73. [div class="EN"]
  74. shōgi
  75. [/div]
  76. [div class="indented" style="font-style: italic; margin-top: 25px;"]
  77. sho·gi | \ ˈshōgē \[br][/br]
  78. plural -s[br][/br][br][/br]
  79. [/div]
  80. [div class="bodytext" style="font-style: italic;"]
  81. noun[br][/br][br][/br]
  82. [/div]
  83. [div class="indented"]
  84. A Japanese two-player strategy board game in the same family as chess, makruk, shatranj, janggi and xiangqi.
  85. [br][/br][br][/br]
  86. Shōgi means general's (shō 将) board game (gi 棋).
  87. [/div]
  88. [/div]
  89.  
  90.  
  91.  
  92. [div class="scrollbox2"]
  93. [div class="content basicsinfo"]
  94. [div class="line" style="margin-top: 6px;"]
  95. [div class="lineheader"]
  96. [color=transparent]x[/color]general information .
  97. [/div]
  98. [/div]
  99. [div class="listwrap"]
  100. [div class="question"]
  101. name
  102. [/div]
  103. [div class="answer"]
  104. seika suzunari
  105. [/div]
  106. [/div]
  107. [div class="listwrap"]
  108. [div class="question"]
  109. nickname
  110. [/div]
  111. [div class="answer"]
  112. n/a
  113. [/div]
  114. [/div]
  115. [div class="listwrap"]
  116. [div class="question"]
  117. age
  118. [/div]
  119. [div class="answer"]
  120. eighteen (18)
  121. [/div]
  122. [/div]
  123. [div class="listwrap"]
  124. [div class="question"]
  125. D.O.B.
  126. [/div]
  127. [div class="answer"]
  128. august 11[div style="display: inline-block; text-transform: lowercase;"][sup]th[/sup][/div]
  129. [/div]
  130. [/div]
  131. [div class="listwrap"]
  132. [div class="question"]
  133. hometown
  134. [/div]
  135. [div class="answer"]
  136. hakodate, hokkaido, japan
  137. [/div]
  138. [/div]
  139. [div class="listwrap"]
  140. [div class="question"]
  141. residence
  142. [/div]
  143. [div class="answer"]
  144. tokyo, japan
  145. [/div]
  146. [/div]
  147. [div class="listwrap"]
  148. [div class="question"]
  149. languages
  150. [/div]
  151. [div class="answer"]
  152. japanese, chinese, english
  153. [/div]
  154. [/div]
  155.  
  156. [div class="line"]
  157. [div class="lineheader"]
  158. [color=transparent]x[/color]appearance .
  159. [/div]
  160. [/div]
  161. [div class="listwrap"]
  162. [div class="question"]
  163. height
  164. [/div]
  165. [div class="answer"]
  166. 172cm
  167. [/div]
  168. [/div]
  169. [div class="listwrap"]
  170. [div class="question"]
  171. weight
  172. [/div]
  173. [div class="answer"]
  174. 60kg
  175. [/div]
  176. [/div]
  177. [div class="listwrap"]
  178. [div class="question"]
  179. lenses
  180. [/div]
  181. [div class="answer"]
  182. n/a
  183. [/div]
  184. [/div]
  185. [div class="listwrap"]
  186. [div class="question"]
  187. style
  188. [/div]
  189. [div class="answer"]
  190. modern casual, traditional
  191. [/div]
  192. [/div]
  193. [div class="listwrap"]
  194. [div class="question"]
  195. diseases
  196. [/div]
  197. [div class="answer"]
  198. n/a
  199. [/div]
  200. [/div]
  201. [div class="listwrap"]
  202. [div class="question"]
  203. habits
  204. [/div]
  205. [div class="answer"]
  206. staring blankly when nervous
  207. [/div]
  208. [/div]
  209. [div class="bodytext"][br][/br]
  210. Having focused wholly on shōgi for eighteen years, Seika’s skin is a pallor unmarked by sunlight, and his body’s frame, though average, is far from that of a dedicated athlete’s. Coupled with his tousled and overgrown fringe and preference for simple clothes that lack any sort of dramatic flair, he is evidently someone who doesn’t spend much time fretting over his appearance. The lack of defined edges yet to be developed on his youthful facial features gives off the impression of an unsullied naivete. Still, his prim posture and placid gaze manage to salvage a dignified air unique to the young prodigy, especially when dressed in traditional garb during official matches. However, to some, his perpetual lack of expressiveness on his face is a particularly unnerving contrast against his near-gold eyes which oppress his opponent on the other side of the shōgi board like a ravenous predator.
  211. [/div]
  212.  
  213.  
  214. [div class="line"]
  215. [div class="lineheader"]
  216. [color=transparent]x[/color]personality .
  217. [/div]
  218. [/div]
  219.  
  220. [div class="accentheader"]
  221. TRAITS
  222. [/div]
  223. [div class="indented"]
  224. + prodigy + perceptive + honest + polite +[br][/br]
  225. - withdrawn - indecisive - diffident - listless -[br][/br][br][/br]
  226. [/div]
  227.  
  228. [div class="bodytext"]
  229. Given Seika's heavily aggressive style and the decisiveness of his moves, the shōgi world’s wunderkind is generally imagined to be a self-assured and cutthroat individual. None question his genius, and his gelid, deep gaze bears a maturity and wisdom well beyond his years—or so the articles say.
  230.  
  231. [br][/br][br][/br]
  232.  
  233. Though he is a profound strategist, what hides behind his lofty facade is a modest and timorous nature. His polite but brief exchanges exist not as proof of an aloof character but act as a wall to keep outsiders from his personal space. As a result of his reclusive childhood hiding away in his grandfather’s study, the so-called tyrant of shōgi’s current generation is, in actuality, an adolescent so uncertain in his interactions that he can only comfortably speak with the grannies and grandpas at the local café back in Hakodate with a few other exceptions. Magnified by the expectations carelessly heaped on his shoulders along with a few offhand comments over the years, he’s grown to shy away from others to such an extreme degree that his younger brother has mentioned that it’s akin to an allergy.
  234.  
  235. [br][/br][br][/br]
  236.  
  237. However, he is ultimately someone insecure not about his abilities but of himself as a person and the aimlessness of his nonexistent goals and desires. Typically, this trait manifests itself as a ruthless adversary before a shōgi table board, but he’s willing to put forth the effort towards other interactions so long as it is deemed as a necessity within his capabilities. Unfortunately, he is pathetically limited to maintaining a tactful minimum of 3 feet of space between himself and others, lest his fight or flight instincts kick in.
  238. [/div]
  239. [/div]
  240.  
  241.  
  242.  
  243. [div class="content detailsinfo hidecontent"]
  244. [div class="line" style="margin-top: 6px;"]
  245. [div class="lineheader"]
  246. [color=transparent]x[/color]history .
  247. [/div]
  248. [/div]
  249. [div class="bodytext"]
  250. Since a young age, he’s been lauded as the most promising talent of his generation. With a staggering win rate of 86.2 percent in official matches, his skill in shōgi exceeds even those many years his senior, and becoming a lifetime titleholder isn’t a mere pipedream for the adolescent. However, to the public he is still a child born with a wealth of advantages in the field, namely that of having been supposedly groomed and polished by a former three-time Mejin himself. He was never [i]Suzunari Seika[/i] but [i]Suzunari Tsuzuru’s son[/i]—the son of a man who didn’t give his family so much as a single glance.
  251.  
  252. [br][/br][br][/br]
  253.  
  254. In truth, his career began over a humble tea table for two. As a child, he spent much of his time sitting in his grandfather’s lap, whimsically tapping and sliding the wooden pieces about the smooth board. Rather than go out with his brother’s friends to play, he preferred sitting in that small tea room with his tiny palm being guided by his grandfather’s large, rough one. In time, his immature manner of thoughtless plays morphed into decisive attacks, and he moved from his grandfather’s lap to being his opponent on the other side of the board. Day after day, the child would suffer an unbroken chain of defeat, yet simply playing the game had already become a deeply ingrained spring of happiness.
  255.  
  256. [br][/br][br][/br]
  257.  
  258. Eventually, he began to accompany his grandfather to the café he frequented and became exposed to the unique playing styles of the other elderly who gathered to play shōgi there. From there, he gradually became acquainted with a man who urged him to apply to the JSA’s Apprentice School. Though formally accepted as the man’s apprentice as well as enrolled in the Apprentice School, it wasn’t until a year into his enrollment that he determined that obtaining professional status was a goal worth fighting for.
  259.  
  260. [br][/br][br][/br]
  261.  
  262. However, his rapid rising through the ranks and debut as a professional at the young age of 12 brought about an explosive amount of attention and pressure, particularly the news of “the young Suzunari Seika succeeding his father.” No matter which games he won or lost, his father’s name began to follow him everywhere. His love and attention to the mind sport slowly transformed into him dreading every upcoming match. Even when he seized his greatest victory as the year 2017’s Ryūō at his grandfather and master’s behest, the question of why he had loved shōgi so much in the past continued to plague his mind.
  263.  
  264. [br][/br][br][/br]
  265.  
  266. His growing doubts were further aggravated by his grandfather’s death in 2018, to the point that he suffered a 0-4 defeat in the final title match of the 2018 Ryūō Tournament and lost the title. Upon the conclusion of the match, his master, who was almost angered to death, scolded the boy until his ears nearly bled, stating that he was shocked that his grandfather hadn’t crawled out of his grave to reproach his grandson for such a shameful manner of defeat unbecoming of his true capabilities.
  267.  
  268. [br][/br][br][/br]
  269.  
  270. Since then, he reclaimed the title in 2019 and was promoted to 9-dan, though he continues to face the future with a great degree of uncertainty.
  271. [/div]
  272.  
  273.  
  274. [div class="line"]
  275. [div class="lineheader"]
  276. [color=transparent]x[/color]relationships .
  277. [/div]
  278. [/div]
  279.  
  280. [div class="accentheader"]
  281. ???
  282. [/div]
  283. [div class="indented"]
  284. Servant.
  285. [/div]
  286.  
  287. [div class="accentheader"]
  288. Suzunari Manatsu
  289. [/div]
  290. [div class="indented"]
  291. Seika’s fraternal twin whom he shares a close relationship with. Manatsu is also just about the only person Seika's age that he can speak casually to. Their hair is noticeably a "reverse ombre" where Seika's hair starts lighter at the top and gets darker at its tips while Manatsu's starts dark and becomes lighter at the tips.
  292. [/div]
  293.  
  294. [div class="accentheader"]
  295. Suzunari Yuzuru
  296. [/div]
  297. [div class="indented"]
  298. Affectionately referred to as Gramps/Jii by Seika, Seika's late paternal grandfather was a pivotal figure in the development of the Seika's career path. Though he was not officially registered as a professional shōgi player, he was even more skilled than Seika’s father (Seika refers to him as a “casual player but a king slayer”) and taught Seika shōgi after finding the four-year-old playing around with the pieces. The young prodigy also adopted his aggressive style from his grandfather.
  299. [/div]
  300.  
  301. [div class="accentheader"]
  302. Suzunari Tsuyuri
  303. [/div]
  304. [div class="indented"]
  305. Seika’s paternal grandmother and a sweet old lady with a fondness for baking sweets for the children in the neighborhood. He doesn’t understand how his father turned out the way he did despite having his grandmother for a mother.
  306. [/div]
  307.  
  308. [div class="accentheader"]
  309. Suzunari Tsuzuru
  310. [/div]
  311. [div class="indented"]
  312. Former Mejin title holder from 2005 to 2007 and now a retired professional shōgi player. Though he was unable to become a lifetime title holder, his skill and status causes many to attribute Seika's success to Tsuzuru. This only exacerbated his son's disdain towards him, as he had left the majority of his children's care to their grandparents.
  313. [/div]
  314.  
  315. [div class="accentheader"]
  316. Honjou Iori
  317. [/div]
  318. [div class="indented"]
  319. Seika and Manatsu's mother. As a journalist, she flies around a lot, so she doesn't get opportunities to visit the two very often. Additionally, she favors Manatsu heavily due to her disapproval of Seika's dedication to shōgi, so the two aren't very close.
  320. [/div]
  321.  
  322. [div class="accentheader"]
  323. Mikan
  324. [/div]
  325. [div class="indented"]
  326. The Suzunari Family’s beloved household cat. She was left in the care of Seika’s grandmother when he left for Tokyo.
  327. [/div]
  328.  
  329. [div class="accentheader"]
  330. Café Yuzuriha
  331. [/div]
  332. [div class="indented"]
  333. A local café that’s family run by the Yuzurihas. Due to its quiet and lowkey location, it’s become a popular spot for the elderly to gather and play board games such as go, xianqi, and shōgi. Even after his grandfather passed away, Seika continued to pass much of his time after school [s]terrorizing the oldfolk[/s] playing shōgi at the café.
  334. [/div]
  335.  
  336. [div class="accentheader"]
  337. Moriuchi Yasuharu
  338. [/div]
  339. [div class="indented"]
  340. Seika’s first impression of his future mentor was that of a suspicious and stubbornly pushy man. The teen now sincerely appreciates his mentor’s efforts in picking up where his grandfather left off. However, his mentor occasionally regrets pushing for Seika to become a professional, as the child appeared to have the most fun when playing casually.
  341. [/div]
  342. [/div]
  343.  
  344.  
  345.  
  346. [div class="content skillsinfo hidecontent"]
  347. [div class="line" style="margin-top: 6px;"]
  348. [div class="lineheader"]
  349. [color=transparent]x[/color]skills .
  350. [/div]
  351. [/div]
  352. [div class="accentheader"]
  353. shōgi
  354. [/div]
  355. [div class="indented"]
  356. As the current Ryūō title holder and a 9-dan currently grouped within Class A in the Meijin League, Seika’s record as a professional shōgi player speaks much of his talent in spite of his young age. Though he puts on a sour expression whenever the mind sport is mentioned, he nevertheless takes it seriously, ruthlessly crushing his opponents with his aggressive style even in casual matches.
  357. [/div]
  358.  
  359. [div class="accentheader"]
  360. academics
  361. [/div]
  362. [div class="indented"]
  363. While having top grades in his school means little to him, Seika is still a genius who doesn’t hide his fangs. He might not reign 1st in academics, but he is more often than not consistently within the top 5 in his grade due to his outstanding memory and problem solving skills.
  364. [/div]
  365.  
  366. [div class="accentheader"]
  367. cooking
  368. [/div]
  369. [div class="indented"]
  370. Seika, though far from a kitchen god, is capable enough to make dishes considered delicious. He doesn't have enough interest in it to make an active effort to improve more than he already has, but he cooks regularly out of habit due to his grandparents having been extremely fussy about consuming primarily homemade food.
  371. [/div]
  372.  
  373. [div class="accentheader"]
  374. mask of apathy(?)
  375. [/div]
  376. [div class="indented"]
  377. When nervous, Seika’s facial muscles tend to default to an entirely blank expression. On the outside, he may appear to be wholly unfazed by the situation. However, his thoughts are likely zooming past at mach 20. Occasionally, he may even faint with his eyes open without others realizing.
  378. [/div]
  379. [/div]
  380.  
  381.  
  382.  
  383. [div class="content extrainfo hidecontent"]
  384. [div class="line" style="margin-top: 6px;"]
  385. [div class="lineheader"]
  386. [color=transparent]x[/color]notes .
  387. [/div]
  388. [/div]
  389. [div class="accentheader"]
  390. name meanings
  391. [/div]
  392. [div class="indented"]
  393. The meanings differ slightly, but both Suzunari Seika and Suzunari Manatsu’s names mean “the echo of a bell during midsummer.”
  394. [/div]
  395.  
  396. [div class="accentheader"]
  397. fast food
  398. [/div]
  399. [div class="indented"]
  400. He's walked into fast food restaurants on several occasions out of curiosity, but he's ultimately never tasted fast food due to getting cold feet while standing in line. His grandmother also heavily disapproved of Manatsu's offers of bringing a burger home on the way, and if he ever did, it always ended up straight into the trash bin.
  401. [/div]
  402.  
  403. [div class="accentheader"]
  404. inadvertent miser
  405. [/div]
  406. [div class="indented"]
  407. His earnings from his numerous victories have accumulated into a fairly impressive sum. However, he isn’t very good at coming up with ways to spend it other than on living expenses and a handful of leisurely goods, so a majority of it continues to sit in his bank account.
  408. [/div]
  409.  
  410. [div class="accentheader"]
  411. people allergy
  412. [/div]
  413. [div class="indented"]
  414. When speaking with others, Seika re-imagines the person he is speaking to as the grannies and grandpas from Café Yuzuriha to hold a relatively steady conversation and get by.
  415. [/div]
  416.  
  417. [div class="line"]
  418. [div class="lineheader"]
  419. [color=transparent]x[/color]gallery .
  420. [/div]
  421. [/div]
  422. [URL="https://twitter.com/AiRM320/status/1037720939570507781"]
  423. [IMG]
  424. https://pbs.twimg.com/media/Dma5dqPUwAABUWv?format=jpg
  425. [/IMG]
  426. [/URL]
  427. [/div]
  428. [/div]
  429. [/div]
  430. [/div]
  431. [/div]
  432. [div=display: block; margin: -60px auto 60px; width: 100%; max-width: 820px; font-size: 9px; color: #aaaaaa;]code by [USER=20950]@Nano[/USER][/div]
  433.  
  434. [comment]
  435. [font=Work Sans]font[/font]
  436. [font=Sawarabi Mincho]font[/font]
  437. [/comment]
  438.  
  439. [comment]--------------------CSS--------------------[/comment]
  440.  
  441. [class name="root"]
  442. --bg: #fefefe;
  443. --accent: #b54434;
  444. --grey1: #656765;
  445. --grey2: #aaaaaa;
  446. --grey3: #e8e8e8;
  447. --text: #878787;
  448. --s1: 45px;
  449. --s2: 35px;
  450. --s3: 25px;
  451. --s4: 1.0em;
  452. --s5: 0.9em;
  453. --JP: 'Sawarabi Mincho', sans-serif;
  454. --EN: 'Work Sans', sans-serif;
  455. --LH: 125%;
  456. display: flex;
  457. flex-flow: row wrap;
  458. justify-content: center;
  459. margin: 0 auto;
  460. padding: 50px 0;
  461. background-color: var(--bg);
  462. font-size: initial;
  463. [/class]
  464.  
  465. [class name="flexcontainer"]
  466. flex: 1 0 100%;
  467. display: flex;
  468. flex-flow: row wrap;
  469. justify-content: center;
  470. margin-left: -20px;
  471. width: 100%;
  472. max-width: 840px;
  473. [/class]
  474.  
  475. [class name="flexbox"]
  476. flex: 1 0 300px;
  477. margin-top: 10px;
  478. margin-bottom: 10px;
  479. margin-left: 20px;
  480. width: 100%;
  481. max-width: 400px;
  482. height: 650px;
  483. background-color: var(--bg);
  484. overflow: hidden;
  485. position: relative;
  486. [/class]
  487.  
  488. [class name="seikamainL"]
  489. box-sizing: border-box;
  490. padding: 25px;
  491. border: 1px solid var(--grey3);
  492. background-color: var(--bg);
  493. [/class]
  494.  
  495. [class name="seikaIMG"]
  496. display: flex;
  497. flex-flow: column-reverse nowrap;
  498. width: 100%;
  499. max-width: 348px;
  500. height: 598px;
  501. background: url('') 50% 25%/400px 600px no-repeat;
  502. cursor: pointer;
  503. transition: height 1.5s ease-in-out 0.4s;
  504. [/class]
  505.  
  506. [class name="IMGselect"]
  507. height: 348px;
  508. transition: height 1.5s ease-in-out 0.4s;
  509. [/class]
  510.  
  511. [class name="name"]
  512. flex: 1 0 100%;
  513. margin-bottom: 15px;
  514. margin-left: 20px;
  515. width: calc(100% - 40px);
  516. max-height: 75px;
  517. [/class]
  518.  
  519. [class name="JP"]
  520. font-size: var(--s1);
  521. font-family: var(--JP);
  522. font-weight: 500;
  523. color: var(--accent);
  524. line-height: 100%;
  525. [/class]
  526.  
  527. [class name="EN"]
  528. font-size: var(--s2);
  529. font-family: var(--EN);
  530. font-weight: 900;
  531. color: var(--grey1);
  532. line-height: 100%;
  533. [/class]
  534.  
  535. [class name="scrollbox1"]
  536. padding-right: 18px;
  537. height: 650px;
  538. width: 100%;
  539. max-width: 400px;
  540. background-color: var(--bg);
  541. overflow-y: auto;
  542. position: absolute;
  543. top: 0px;
  544. transition: top 1.5s ease-in-out 1.5s;
  545. [/class]
  546.  
  547. [class name="scrollbox2"]
  548. height: 650px;
  549. width: 100%;
  550. max-width: 400px;
  551. background-color: var(--bg);
  552. overflow: hidden;
  553. position: absolute;
  554. top: -650px;
  555. transition: top 1.5s ease-in-out 0.4s;
  556. [/class]
  557.  
  558. [class name="slideUP"]
  559. top: -650px;
  560. transition: top 1.5s ease-in-out 0.4s;
  561. [/class]
  562.  
  563. [class name="slideDOWN"]
  564. top: 0;
  565. transition: top 1.5s ease-in-out 1.5s;
  566. [/class]
  567.  
  568.  
  569. [class name="bodytext"]
  570. font-family: var(--EN);
  571. font-size: var(--s4);
  572. text-align: justify;
  573. color: var(--text);
  574. line-height: var(--LH);
  575. [/class]
  576.  
  577. [class name="indented"]
  578. margin-left: 20px;
  579. width: calc(100% - 20px);
  580. font-family: var(--EN);
  581. font-size: var(--s4);
  582. text-align: justify;
  583. color: var(--text);
  584. line-height: var(--LH);
  585. [/class]
  586.  
  587. [class name="tabarea"]
  588. margin-top: 10px;
  589. height: 240px;
  590. width: 100%;
  591. max-width: 400px;
  592. [/class]
  593.  
  594. [class name="tabs"]
  595. box-sizing: border-box;
  596. padding: 10px;
  597. height: 60px;
  598. width: 100%;
  599. background-color: var(--bg);
  600. cursor: pointer;
  601. transition: background-color .8s ease .1s;
  602. [/class]
  603.  
  604. [class name="tabs" state="hover"]
  605. background-color: var(--grey3);
  606. transition: background-color: .8s ease .1s;
  607. [/class]
  608.  
  609. [class name="hometab"]
  610. box-sizing: border-box;
  611. padding: 10px;
  612. height: 60px;
  613. width: 100%;
  614. background-color: var(--bg);
  615. cursor: pointer;
  616. transition: background-color .8s ease .1s;
  617. [/class]
  618.  
  619. [class name="hometab" state="hover"]
  620. background-color: var(--grey3);
  621. transition: background-color: .8s ease .1s;
  622. [/class]
  623.  
  624. [class name="tabselect"]
  625. background-color: var(--grey3);
  626. cursor: default;
  627. pointer-events: none;
  628. [/class]
  629.  
  630. [class name="tabtitle"]
  631. font-family: var(--EN);
  632. font-size: var(--s3);
  633. font-weight: 900;
  634. color: var(--grey1);
  635. line-height: 100%;
  636. text-transform: uppercase;
  637. pointer-events: none;
  638. [/class]
  639.  
  640. [class name="tabsubtitle"]
  641. font-family: var(--EN);
  642. font-size: var(--s4);
  643. color: var(--grey2);
  644. line-height: 100%;
  645. text-transform: lowercase;
  646. pointer-events: none;
  647. [/class]
  648.  
  649. [class name="content"]
  650. position: absolute;
  651. padding-right: 18px;
  652. height: 650px;
  653. width: 100%;
  654. max-width: 400px;
  655. background-color: var(--bg);
  656. overflow-y: auto;
  657. top: 0;
  658. transition: top 1.5s ease-in-out 1.5s;
  659. [/class]
  660.  
  661. [class name="hidecontent"]
  662. top: -650px;
  663. transition: top 1.5s ease-in-out;
  664. [/class]
  665.  
  666. [class name="line"]
  667. margin-top: 26px;
  668. margin-bottom: 20px;
  669. width: 100%;
  670. height: 2px;
  671. background-color: var(--grey3);
  672. [/class]
  673.  
  674. [class name="lineheader"]
  675. display: inline-block;
  676. float: right;
  677. margin-top: -12px;
  678. font-family: var(--EN);
  679. font-size: var(--s4);
  680. color: var(--accent);
  681. background-color: var(--bg);
  682. [/class]
  683.  
  684. [class name="listwrap"]
  685. display: flex;
  686. flex-flow: row wrap;
  687. width: 100%;
  688. [/class]
  689.  
  690. [class name="question"]
  691. flex: 1 0 100px;
  692. font-family: var(--EN);
  693. font-size: var(--s5);
  694. color: var(--text);
  695. line-height: (--LH);
  696. font-weight: bold;
  697. text-transform: uppercase;
  698. [/class]
  699.  
  700. [class name="answer"]
  701. flex: 5 0 100px;
  702. font-family: var(--EN);
  703. font-size: var(--s5);
  704. color: var(--text);
  705. line-height: (--LH);
  706. text-transform: uppercase;
  707. [/class]
  708.  
  709. [class name="accentheader"]
  710. display: inline-block;
  711. font-family: var(--EN);
  712. font-size: var(--s4);
  713. line-height: (--LH);
  714. color: var(--accent);
  715. text-transform: uppercase;
  716. [/class]
  717.  
  718. [comment]--------------------SCRIPTS--------------------[/comment]
  719.  
  720. [script class="pre"]
  721. set seikaIMG 1
  722. [/script]
  723.  
  724. [script class="clicker" on=click]
  725. if (eq ${seikaIMG} 0) (set seikaIMG 1) (set seikaIMG 0)
  726. if (eq ${seikaIMG} 0) (addClass IMGselect seikaIMG) (removeClass IMGselect seikaIMG)
  727. if (eq ${seikaIMG} 0) (addClass slideUP scrollbox1) (removeClass slideUP scrollbox1)
  728. if (eq ${seikaIMG} 0) (addClass slideDOWN scrollbox2) (removeClass slideDOWN scrollbox2)
  729. [/script]
  730.  
  731. [script class="tabs" version=2]
  732. (= select "basics")
  733. [/script]
  734. [script class="tabs" version=2 on=click]
  735. (addClass "hidecontent" "content")
  736. (removeClass "tabselect" "tabs")
  737.  
  738. (= select (index (split (getText) "#") 0 ))
  739.  
  740. (addClass "tabselect" (+ select "tabs"))
  741. (removeClass "hidecontent" (+ select "info"))
  742. [/script]
  743.  
  744. [/nobr]
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement