API tools faq
paste
Advertisement
dollzito

virtual angel stellular code

dollzito
Jan 25th, 2025
398
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.64 KB | None | 0 0
raw download clone embed print report
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <title>virtual angel</title>
  7. <link rel="stylesheet" href="https://unpkg.com/7.css" />
  8. </head>
  9.  
  10. <body>
  11. <div class="title-bar">
  12. <div class="title-bar-text">(Friend) Nalui – Convo</div>
  13. <div class="title-bar-controls">
  14. <button aria-label="Minimize"></button>
  15. <button aria-label="Maximize"></button>
  16. <button aria-label="Close"></button>
  17. </div>
  18. </div>
  19.  
  20. <ul role="menubar" class="can-hover">
  21. <li role="menuitem" tabindex="0" aria-haspopup="true">
  22. File
  23. <ul role="menu">
  24. <li role="menuitem">
  25. <a href="#menubar">
  26. Open <span>Ctrl+O</span>
  27. </a>
  28. </li>
  29. <li role="menuitem">
  30. <a href="#menubar">
  31. Save <span>Ctrl+S</span>
  32. </a>
  33. </li>
  34. <li role="menuitem" class="has-divider">
  35. <a href="#menubar">
  36. Save As... <span>Ctrl+Shift+S</span>
  37. </a>
  38. </li>
  39. <li role="menuitem"><a href="#menubar">Exit</a></li>
  40. </ul>
  41. </li>
  42. <li role="menuitem" tabindex="0" aria-haspopup="true">
  43. Edit
  44. <ul role="menu">
  45. <li role="menuitem"><a href="#menubar">Undo</a></li>
  46. <li role="menuitem"><a href="#menubar">Copy</a></li>
  47. <li role="menuitem"><a href="#menubar">Cut</a></li>
  48. <li role="menuitem" class="has-divider"><a href="#menubar">Paste</a></li>
  49. <li role="menuitem"><a href="#menubar">Delete</a></li>
  50. <li role="menuitem"><a href="#menubar">Find...</a></li>
  51. <li role="menuitem"><a href="#menubar">Replace...</a></li>
  52. <li role="menuitem"><a href="#menubar">Go to...</a></li>
  53. </ul>
  54. </li>
  55. <li role="menuitem" tabindex="0" aria-haspopup="true">
  56. View
  57. <ul role="menu">
  58. <li role="menuitem" tabindex="0" aria-haspopup="true">
  59. Zoom
  60. <ul role="menu">
  61. <li role="menuitem"><button>Zoom In</button></li>
  62. <li role="menuitem"><button>Zoom Out</button></li>
  63. </ul>
  64. </li>
  65. <li role="menuitem"><a href="#menubar">Status Bar</a></li>
  66. </ul>
  67. </li>
  68. <li role="menuitem" tabindex="0" aria-haspopup="true">
  69. Help
  70. <ul role="menu">
  71. <li role="menuitem"><a href="#menubar">View Help</a></li>
  72. <li role="menuitem"><a href="#menubar">About</a></li>
  73. </ul>
  74. </li>
  75. </ul>
  76.  
  77. <div id="home">
  78. <div id="container01">
  79. <div id="left">
  80. <p class="p01">To: Rei ✉️</p>
  81. <div id="scroll01"><mark>@dollzito</mark> oii sou a <strong>nalui</strong> ou <u>nana!</u> <br> <mark>@user</mark> oii! me conta mais de vc <br> <mark>@dollzito</mark> tenho 20, sou ela dela pisciana e birromantica ˖˚.࿐ <br> <mark>@user</mark> nss que legal diva!</div>
  82. <p class="p02"><button id="button01">send</button></p>
  83. </div>
  84.  
  85. <div id="right">
  86. <img class="image01"src="https://64.media.tumblr.com/a01aa66492feb7135e84b3b8834d58a4/60ed2e2c8357b568-57/s1280x1920/d087b44f0271965f841c6c5d420092bf831ac3de.jpg">
  87. <div class="p03">▼</div>
  88. </div>
  89.  
  90. </div>
  91. <div id="container02">
  92.  
  93. </div>
  94. </div>
  95.  
  96. <div id="container03">
  97. <button id="button02" onclick="backHome()">Home</button>
  98. <button id="button03" onclick="openOne()">Rules</button>
  99. <button id="button04" onclick="openTwo()">Loves</button>
  100. </div>
  101.  
  102. <div id="rules" style="display: none;">
  103. <div class="window active" style="position: absolute; top: 4.3em;left: 0.5em;width:10.1em;height:11.2em;">
  104. <div class="title-bar" style="width: 10em;">
  105. <div class="title-bar-text">01.png</div>
  106. <div class="title-bar-controls">
  107. <button aria-label="Close" onclick="backHome()"></button>
  108. </div>
  109. </div>
  110.  
  111. <div class="window-body">
  112. <img id="image02" src="https://64.media.tumblr.com/465dff72d4b90f33f34c66319245db28/a94aadef28dc28b5-47/s400x600/0a05597021af58ac855cfc4cc0909067d89fbe50.pnj">
  113. </div>
  114. </div>
  115.  
  116. <div class="window active" style="position: absolute; top: 2.8em;right: 0.5em;max-width: 14em;height:11em;">
  117. <div class="title-bar" style="width: 13.9em;">
  118. <div class="title-bar-text">rules.txt</div>
  119. <div class="title-bar-controls">
  120. <button aria-label="Minimize"></button>
  121. <button aria-label="Maximize"></button>
  122. <button aria-label="Close" onclick="backHome()"></button>
  123. </div>
  124. </div>
  125. <div class="window-body has-space" style="height:8em;overflow-y:scroll;">
  126. <strong>to know:</strong> alo sobre os meus interesses, seletiva com follow, posso dar umas sumidas as vezes. <br><br> <strong>go away:</strong> go away: nao gosta de algum da ult list, sem info/carrd no seu perfil ou interesses em comum.
  127. </div>
  128. </div>
  129.  
  130. </div>
  131.  
  132. <div id="loves" style="display: none;">
  133. <div class="window active" style="position: absolute; top: 4.3em;left: 0.5em;max-width: 14em;height:11em;">
  134. <div class="title-bar" style="width: 13.85em;">
  135. <div class="title-bar-text">loves.txt</div>
  136. <div class="title-bar-controls">
  137. <button aria-label="Minimize"></button>
  138. <button aria-label="Maximize"></button>
  139. <button aria-label="Close" onclick="backHome()"></button>
  140. </div>
  141. </div>
  142. <div class="window-body has-space" style="height:8em;overflow-y:scroll;">
  143. <strong>me core:</strong> 2seoki, spy x family, coding, musica, carrds, anime, seori, gameplays, joguinhos, moda y2k e design grafico <br><br> <strong>media:</strong> spy x family nana kimi ni todoke the boy and the heron free! iwatobi swim club etc...
  144. </div>
  145. </div>
  146.  
  147. <div class="window active" style="position: absolute; top: -2em;right: 0.5em;width:9.1em;height:10.2em;">
  148. <div class="title-bar" style="width:9em;">
  149. <div class="title-bar-text">02.png</div>
  150. <div class="title-bar-controls">
  151. <button aria-label="Close" onclick="backHome()"></button>
  152. </div>
  153. </div>
  154.  
  155. <div class="window-body">
  156. <img id="image03" src="https://64.media.tumblr.com/d83dbacdc7e2fdc7a6a07a4cb737c2cc/60ed2e2c8357b568-62/s1280x1920/ee74cd876c019cb6ffda4c5e42099502783f5000.jpg">
  157. </div>
  158. </div>
  159.  
  160. <div class="window active" style="position: absolute; top: 9em; right: 1em;width:10.1em;height:11.2em;">
  161. <div class="title-bar" style="width: 10em;">
  162. <div class="title-bar-text">03.png</div>
  163. <div class="title-bar-controls">
  164. <button aria-label="Close" onclick="backHome()"></button>
  165. </div>
  166. </div>
  167. <div class="window-body">
  168. <img id="image04" src="https://64.media.tumblr.com/847e1298d4178e85ecdb4214ad183efd/60ed2e2c8357b568-d4/s1280x1920/bb72ece2522c7dbca86897b9c5e15afee233dfc3.jpg">
  169. </div>
  170. </div>
  171.  
  172. </div>
  173. <script>
  174. function backHome() {
  175. document.getElementById("rules").style.display = "none";
  176. document.getElementById("loves").style.display = "none";
  177. }
  178.  
  179. function openOne() {
  180. document.getElementById("rules").style.display = "block";
  181. document.getElementById("loves").style.display = "none";
  182. }
  183.  
  184. function openTwo() {
  185. document.getElementById("rules").style.display = "none";
  186. document.getElementById("loves").style.display = "block";
  187. }
  188. </script>
  189. </body>
  190.  
  191. <style>
  192. @font-face {
  193. font-family: windows;
  194. src: url("https://dl.dropbox.com/s/cn0l1yjacta4whv/W95FA.otf");
  195. }
  196.  
  197. * {
  198. padding: 0;
  199. margin: 0;
  200. box-sizing: border-box;
  201. font-family: windows;
  202. }
  203.  
  204. html {
  205. overflow: scroll;
  206. overflow-x: hidden;
  207. }
  208.  
  209. ::-webkit-scrollbar {
  210. width: 0;
  211. background: transparent;
  212. }
  213.  
  214. ::-webkit-scrollbar-thumb {
  215. background: transparent;
  216. }
  217.  
  218. body {
  219. background: white;
  220. top: 50%;
  221. left: 50%;
  222. transform: translate(-50%, -50%);
  223. position: fixed;
  224. nimation: fadeIn 1.8s;
  225. }
  226.  
  227. .title-bar {
  228. width: 26em;
  229. }
  230.  
  231. .can-hover {
  232. border: 1px solid #222;
  233. border-top: none;
  234. }
  235.  
  236. #container01, #container02, #container03 {
  237. width: 26em;
  238. border: 1px solid #222;
  239. border-top: none;
  240. padding: 0.5em;
  241. display: flex;
  242. gap: 0.5em;
  243. }
  244.  
  245. #container02 {
  246. border-radius: 0 0 0.5em 0.5em;
  247. align-items: center;
  248. }
  249.  
  250. #container03 {
  251. width: 14em;
  252. border-bottom: none;
  253. border-top: 1px solid #222;
  254. border-radius: 0.5em 0.5em 0 0;
  255. rotate: 90deg;
  256. position: absolute;
  257. right: -8.3em;
  258. bottom:7em;
  259. padding: 0.3em;
  260. gap: 0.3em;
  261. }
  262.  
  263. #left {
  264. width: 16em;
  265. }
  266.  
  267. .p01 {
  268. background: #d3dfed;
  269. border: 1px solid #457ab7;
  270. border-radius: 5px 5px 0px 0px;
  271. padding: 2px 5px;
  272. }
  273.  
  274. #scroll01 {
  275. height: 5.8em;
  276. line-height: 1.2;
  277. border-left: 1px solid #457ab7;
  278. border-right: 1px solid #457ab7;
  279. padding: 0.5em;
  280. overflow-y:scroll;
  281. }
  282.  
  283. mark {
  284. color: #969696;
  285. font-weight: bold;
  286. background: none;
  287. }
  288.  
  289. .p02 {
  290. background: #d3dfed;
  291. font-size: 14px;
  292. font-family: windows;
  293. text-align: right;
  294. border: 1px solid #457ab7;
  295. border-radius: 0px 0px 5px 5px;
  296. padding: 2px 5px;
  297. }
  298.  
  299. #button01 {
  300. min-width: 0px;
  301. padding: 0 10px;
  302. font-family: windows;
  303. }
  304.  
  305. #button02, #button03, #button04 {
  306. min-width: 0px;
  307. font-family: windows;
  308. padding: 0 9px;
  309. }
  310.  
  311. #right {
  312. border:1px solid #a6a6a6;
  313. border-radius: 0.5em
  314. }
  315.  
  316. .image01 {
  317. width: 9em;
  318. height: 8.5em;
  319. border-radius: 0.5em 0.5em 0 0;
  320. object-fit: cover;
  321. }
  322.  
  323. .p03 {
  324. width: 100%;
  325. color: #457ab7;
  326. line-height: 1;
  327. text-align: right;
  328. }
  329.  
  330. .marquee {
  331. width: 8em;
  332. }
  333.  
  334. #image02 {
  335. width: 8.8em;
  336. height: 7.8em;
  337. object-fit: cover;
  338. }
  339.  
  340. #image03 {
  341. width:7.8em;
  342. height:7em;
  343. object-fit: cover;
  344. }
  345.  
  346. #image04 {
  347. width:8.8em;
  348. height:8em;
  349. object-fit: cover;
  350. }
  351. </style>
  352. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!