kay_kodes

i solemnly swear that i am up to no good || lesson

May 5th, 2022 (edited)
75
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.17 KB | None | 0 0
  1. ♡ YELLOW THERE! it's me again! i'm back with another lesson code based on some harry potter aesthetics. not gonna lie, it's not TOO harry potter-y. i lost inspiration on this one so i might make another code with even more harry potter aesthetics to make up for this one. but anyways, enjoy it! keep the credits too mwah! ♡
  2.  
  3. best dreams,
  4. kay <3
  5.  
  6.  
  7. --CODE STARTS BELOW THIS TEXT--
  8. <html>
  9. <center>
  10. <link href="https://fonts.googleapis.com/css2?family=PT+Serif&display=swap" rel="stylesheet">
  11. <style>
  12. /*Scrollbar*/
  13. ::-webkit-scrollbar {width: 0px;}
  14. ::-webkit-scrollbar-thumb {background: #fff;}
  15. ::-webkit-scrollbar-thumb:hover {background: #fff;}
  16. .box{
  17. position: relative;
  18. text-align: center;
  19.  
  20. }
  21. .booktitle{
  22. font-family: 'Lavishly Yours', cursive;
  23. font-size:80px;
  24. color:#00539c;
  25. position: absolute;
  26. top: 50%;
  27. left: 50%;
  28. transform: translate(-50%, -50%);
  29. }
  30. .page{
  31. text-decoration: none;
  32. color:black;
  33. padding: 10px
  34.  
  35. }
  36.  
  37. .columnone{
  38. float: right;
  39. width:320px;
  40. height:715px;
  41. background-color: #aec6cf;
  42. border: 2px #000 ;
  43. margin-right:10px;
  44. margin-top:20px;
  45. margin-bottom: -25px;
  46. overflow:auto;
  47.  
  48. }
  49. .columntwo{
  50. float:left;
  51. width:398px;
  52. height:750px;
  53. margin-left:30px;
  54. margin-bottom: 10px;
  55. overflow: auto;
  56.  
  57.  
  58. }
  59. .assignment-box{
  60. float: center;
  61. text-align: center;
  62. font-size: 15px;
  63. max-width: 100%;
  64. max-height:100%;
  65. border: 5px #fff double;
  66. overflow: auto;
  67. background-color: #aec6cf;
  68.  
  69.  
  70. }
  71. .requirements-box{
  72. float: center;
  73. text-align: center;
  74. font-size: 15px;
  75. max-width: 100%;
  76. max-height:100%;
  77. border: 5px #fff double;
  78. overflow: auto;
  79. background-color: #aec6cf;
  80. margin-top:10px
  81. }
  82. .notes-box{
  83. float: center;
  84. text-align: center;
  85. font-size: 15px;
  86. max-width: 100%;
  87. max-height:100%;
  88. border: 5px #fff double;
  89. overflow: auto;
  90. background-color: #aec6cf;
  91. margin-top:10px
  92. }
  93.  
  94. </style>
  95. <a name="one">
  96. <div style="background:#aec6cf;border:5px solid #fff;width:800px;height:915px;border-radius:0px;overflow:auto">
  97. <div class="box">
  98. <center>
  99. <img src="https://fontmeme.com/permalink/220505/614ed17076c8964f88f4268cf6784924.png" border="0" style="margin-top:30px; width:600px;margin-bottom:10px">
  100. </center></div>
  101.  
  102. <div class="columnone">
  103. <br>
  104. <!--assignment-->
  105. <div class="assignment-box">
  106. <details style="padding:0px 0; border:0px solid #000; padding:px;">
  107. <summary style="font-size:px;font-weight:bold">
  108. <div class="body">
  109.  
  110. <center><img src="https://fontmeme.com/permalink/220505/ab9c0b461d6bc4416a685221af075313.png" style="width:100px;margin-left:;margin-top:1px;margin-bottom:5px">
  111. </div></summary>
  112. <div style="margin-right:10px;margin-left:10px">
  113. <p>
  114. <i>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi.</i><br><br>
  115. 🕮 Add Assignment Here<br>
  116. 🕮 Add Assignment Here<br>
  117. 🕮 Add Assignment Here
  118. </p></div></details>
  119. </div>
  120. <br>
  121.  
  122. <!--requirement-->
  123. <div class="requirements-box">
  124. <details style="padding:0px 0; border:0px solid #000; padding:px;">
  125. <summary style="font-size:px;font-weight:bold">
  126. <div class="body">
  127.  
  128. <center><img src="https://fontmeme.com/permalink/220505/73498017fe28887e736c947ca1b10086.png" style="width:100px;margin-left:;margin-top:1px;margin-bottom:5px">
  129. </div></summary>
  130. <div style="margin-right:10px;margin-left:10px">
  131. <p>
  132. <i>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi.</i><br><br>
  133. ✎ Add Requirement Here<br>
  134. ✎ Add Requirement Here<br>
  135. ✎ Add Requirement Here
  136. </p></div></details>
  137. </div>
  138. <br>
  139.  
  140. <!--notes-->
  141. <div class="notes-box">
  142. <details style="padding:0px 0; border:0px solid #000; padding:px;">
  143. <summary style="font-size:px;font-weight:bold">
  144. <div class="body">
  145.  
  146. <center><img src="https://fontmeme.com/permalink/220505/9bfca246fe61bf100195152884501c0c.png" style="width:100px;margin-left:;margin-top:1px;margin-bottom:5px">
  147. </div></summary>
  148. <div style="margin-right:10px;margin-left:10px">
  149. <p>
  150. <i>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi.</i><br><br>
  151. ☆ Add Notes Here<br>
  152. ☆ Add Notes Here<br>
  153. ☆ Add Notes Here
  154. </p></div></details>
  155. </div>
  156. <br>
  157. <img src="https://i.pinimg.com/originals/7e/25/81/7e2581f911a2a5fde42e3f982668371d.gif" style="float:left;width:150px;height:150px;border: 2px solid #fff">
  158.  
  159. <img src="https://i.pinimg.com/originals/94/f0/af/94f0aff2bc06c9208448c2bec28811c8.gif" style="float:right;width:150px;height:150px;border: 2px solid #fff;margin-left:10px">
  160.  
  161. <br>
  162. <img src="https://i.pinimg.com/originals/2c/7e/92/2c7e92946a800702df81ad21cc6250dc.gif" style="float:left;width:150px;height:150px;border: 2px solid #fff;margin-top:10px">
  163.  
  164. <img src="https://i.pinimg.com/originals/b1/c6/d6/b1c6d60c3848603b6d55307d5512d718.gif" style="float:right;width:150px;height:150px;border: 2px solid #fff;margin-left:10px;margin-top:10px">
  165.  
  166.  
  167. <!--signature-->
  168. <div style="background-color:#aec6cf;padding:5px;width:310px;height:100px;margin-top:310px">
  169. <center><img src="https://fontmeme.com/permalink/220505/84a92a82ec5f1b25b27eea74fd03d4de.png"style="width:280px;margin-left:10px;margin-bottom:35px;margin-right:20px"></center>
  170. <center><img src="https://i.pinimg.com/originals/72/50/fe/7250fe20c936f20c2f454624ff9c1141.gif" style="width:150px;height:150px;border-radius:50%;margin-bottom:10px;margin-top:-25px"></center>
  171. </div>
  172. </div>
  173.  
  174. <div class="columntwo">
  175. <div style="text-align:justify;width:395px;height:655px;overflow-auto">
  176. <center><h2><img src="https://fontmeme.com/permalink/220505/5598fc9c164132bb13808ac74f08945e.png" border="0" style="margin-top:10px;width:250px"></h2></center>
  177. <center><b>'Class Name Here, Year# Week#' Font: Moonless SC</b><br><br>
  178. <b>'Lesson Name Here' & 'Assignments, Requirements, Extra Notes' Font: Australia Signature</b><br></center>
  179. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi. Ab laboriosam omnis sed commodi nulla eum minima molestiae et temporibus ducimus. Aut dolorem unde est natus expedita aut fuga aliquid ea veritatis vitae aut omnis accusantium? In voluptates eligendi qui voluptates quaerat et suscipit optio est quia quibusdam et maxime accusantium qui corporis ratione eum asperiores nulla. Non aliquam voluptas ea consequatur repellendus et quia galisum ut perspiciatis nulla a fuga dicta est quas provident.
  180.  
  181. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi. Ab laboriosam omnis sed commodi nulla eum minima molestiae et temporibus ducimus. Aut dolorem unde est natus expedita aut fuga aliquid ea veritatis vitae aut omnis accusantium? In voluptates eligendi qui voluptates quaerat et suscipit optio est quia quibusdam et maxime accusantium qui corporis ratione eum asperiores nulla. Non aliquam voluptas ea consequatur repellendus et quia galisum ut perspiciatis nulla a fuga dicta est quas provident.
  182.  
  183. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi. Ab laboriosam omnis sed commodi nulla eum minima molestiae et temporibus ducimus. Aut dolorem unde est natus expedita aut fuga aliquid ea veritatis vitae aut omnis accusantium? In voluptates eligendi qui voluptates quaerat et suscipit optio est quia quibusdam et maxime accusantium qui corporis ratione eum asperiores nulla. Non aliquam voluptas ea consequatur repellendus et quia galisum ut perspiciatis nulla a fuga dicta est quas provident.
  184.  
  185. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi. Ab laboriosam omnis sed commodi nulla eum minima molestiae et temporibus ducimus. Aut dolorem unde est natus expedita aut fuga aliquid ea veritatis vitae aut omnis accusantium? In voluptates eligendi qui voluptates quaerat et suscipit optio est quia quibusdam et maxime accusantium qui corporis ratione eum asperiores nulla. Non aliquam voluptas ea consequatur repellendus et quia galisum ut perspiciatis nulla a fuga dicta est quas provident.
  186.  
  187. <p>Lorem ipsum dolor sit amet. Est dolor consectetur et galisum saepe et sunt odit qui maiores quasi. Ea saepe officia eum nulla quaerat 33 corrupti animi. Ab laboriosam omnis sed commodi nulla eum minima molestiae et temporibus ducimus. Aut dolorem unde est natus expedita aut fuga aliquid ea veritatis vitae aut omnis accusantium? In voluptates eligendi qui voluptates quaerat et suscipit optio est quia quibusdam et maxime accusantium qui corporis ratione eum asperiores nulla. Non aliquam voluptas ea consequatur repellendus et quia galisum ut perspiciatis nulla a fuga dicta est quas provident.
  188. <div>
  189. <div>
  190.  
  191. </div></div></div></div> </div> </div>
  192.  
  193. <div><center><a href="https://kkodes.wixsite.com/dreamer" style="color:#000;font-size:12px;"><b><u>kay kodes</u></b></a></center>
  194.  
  195. <link rel="preconnect" href="https://fonts.googleapis.com">
  196. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  197. <link href="https://fonts.googleapis.com/css2?family=Sacramento&display=swap" rel="stylesheet">
  198.  
  199. <script>
  200. function openCity(evt, cityName) {
  201. var i, tabcontent, tablinks;
  202. tabcontent = document.getElementsByClassName("tabcontent");
  203. for (i = 0; i < tabcontent.length; i++) {
  204. tabcontent[i].style.display = "none";
  205. }
  206. tablinks = document.getElementsByClassName("tablinks");
  207. for (i = 0; i < tablinks.length; i++) {
  208. tablinks[i].className = tablinks[i].className.replace(" active", "");
  209. }
  210. document.getElementsByClassName("tablinks");
  211. for (i = 0; i < tablinks.length; i++) {
  212. tablinks[i].className = tablinks[i].className.replace(" active", "");
  213. }
  214. document.getElementById(cityName).style.display = "block";
  215. evt.currentTarget.className += " active";
  216. }
  217.  
  218. // Get the element with id="defaultOpen" and click on it
  219. document.getElementById("defaultOpen").click();
  220. </script>
Add Comment
Please, Sign In to add comment