Fix navbar, add it to docs

This commit is contained in:
Araozu 2023-10-05 07:56:34 -05:00
parent b2d536d07f
commit 540f9c41e5
10 changed files with 128 additions and 31 deletions

View File

@ -0,0 +1,32 @@
# Anonymous classes
```thp
class Logger
{
pub fun log(String msg)
{
print(msg)
}
}
// Using a class instance
setLogger(Logger())
// Using an anonymous class
setLogger(class {
pub fun log(String msg)
{
print(msg)
}
})
```
```thp
setLogger(class(Int param1) -> SomeClass(param1), SomeInterface {
pub fun method()
{
// code
}
})
```

View File

@ -0,0 +1,25 @@
# Interfaces
```thp
interface Serializable
{
// Methods are always public in interfaces
fun serialize($) -> String
}
class Cat -> Serializable,
{
pub fun Serializable($) -> String
{
// code
}
}
```
No interface inheritance.

16
md/learn/classes/magic.md Normal file
View File

@ -0,0 +1,16 @@
# Magic methods
Are always public
```thp
class Cat
{
pub fun __sleep() -> Array[String]
{
// logic
}
}
```

View File

@ -62,6 +62,22 @@ val first = get_first_item(numbers)
``` ```
## Named arguments
```thp
fun html_special_chars(
String input,
Int? flags,
String? encoding,
Bool? double_encoding,
) -> String
{
// ...
}
html_special_chars(input, double_encode: false)
```

View File

@ -60,3 +60,9 @@ children:
path: definition path: definition
- name: Static - name: Static
path: static path: static
- name: Interfaces
path: interfaces
- name: Anonymous classes
path: anonymous
- name: Magic
path: magic

View File

@ -16,7 +16,7 @@
<link href="https://fonts.googleapis.com/css2?family=Fira+Code&family=Josefin+Sans:ital,wght@0,400;1,700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Fira+Code&family=Josefin+Sans:ital,wght@0,400;1,700&display=swap" rel="stylesheet">
</head> </head>
<body class="bg-c-bg text-c-text"> <body class="bg-c-bg text-c-text">
<nav class="sticky top-0 h-16 border-b border-gray-400 bg-[rgba(18,18,18,0.5)] backdrop-blur-md z-20"> <nav class="sticky top-0 h-16 border-b border-gray-400 bg-c-nav-bg backdrop-blur-md z-20">
<div class="max-w-[70rem] mx-auto h-full w-full flex items-center"> <div class="max-w-[70rem] mx-auto h-full w-full flex items-center">
<button class="font-display font-bold italic text-4xl"> <button class="font-display font-bold italic text-4xl">
<span <span

View File

@ -20,6 +20,6 @@ Prism.languages.thp = {
"operator": /[<>]=?|[!=]=?=?|--?|\$|\+\+?|&&?|\|\|?|[?*/~^%]/, "operator": /[<>]=?|[!=]=?=?|--?|\$|\+\+?|&&?|\|\|?|[?*/~^%]/,
"punctuation": /[{}[\];(),.]/, "punctuation": /[{}[\];(),.]/,
"boolean": /\b(?:false|true)\b/, "boolean": /\b(?:false|true)\b/,
"class-name": /\b[A-Z][a-zA-Z_0-9]+\b/, "class-name": /\b[A-Z][a-zA-Z_0-9]*\b/,
"variable": /\b[a-z_0-9][a-zA-Z_0-9]+:/, "variable": /\b[a-z_0-9][a-zA-Z_0-9]+:/,
}; };

View File

@ -1,5 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
@ -12,49 +13,46 @@
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans+Condensed:wght@400;500;600;700;800;900&family=Fugaz+One&family=Inconsolata&family=Inter&display=swap" rel="stylesheet"> <link
<link href="https://fonts.googleapis.com/css2?family=Fira+Code&family=Josefin+Sans:ital,wght@0,400;1,700&display=swap" rel="stylesheet"> href="https://fonts.googleapis.com/css2?family=Fira+Sans+Condensed:wght@400;500;600;700;800;900&family=Fugaz+One&family=Inconsolata&family=Inter&display=swap"
rel="stylesheet">
<link
href="https://fonts.googleapis.com/css2?family=Fira+Code&family=Josefin+Sans:ital,wght@0,400;1,700&display=swap"
rel="stylesheet">
<style> <style>
html {
font-size: 20px;
}
</style> </style>
</head> </head>
<body class="bg-c-bg text-c-text"> <body class="bg-c-bg text-c-text">
<div class="grid grid-cols-[10rem_12rem_auto] gap-2 max-w-[70rem] mx-auto"> <nav class="fixed w-screen top-0 h-16 border-b border-gray-400 bg-c-nav-bg backdrop-blur-md z-20">
<div class="p-2 overflow-x-scroll max-h-screen sticky top-0"> <div class="max-w-[70rem] mx-auto h-full w-full flex items-center">
<div class="relative mb-2 button-effect"> <button class="font-display font-bold italic text-4xl">
<a class="button-effect-receiver inline-block w-[9rem] p-4 bg-c-primary rounded-md" <span class="text-[#F5A9B8]">t</span><span>h</span><span class="text-[#5BCEFA]">p</span>
href="/" </button>
> </div>
<h1 </nav>
class="py-8 font-display text-6xl text-center font-bold italic"
style="text-shadow: 3px 3px 0 var(--c-bg)"
>
thp
</h1>
</a>
<div class="w-full h-full bg-c-text absolute top-0 left-0 -z-10 rounded-md"></div> <div class="grid grid-cols-[12rem_12rem_auto] gap-2 max-w-[70rem] mx-auto">
</div> <div class="pt-16 h-screen sticky top-0">
<nav class="rounded-md p-4 mt-2 border-2 border-[#F5A9B8] overflow-x-scroll"
<nav class="rounded-md p-4 border-2 border-[#F5A9B8]"> style="height: calc(100vh - 4.75rem);"
>
{{pages}} {{pages}}
</nav> </nav>
</div> </div>
<div class="py-2 max-h-screen overflow-x-scroll sticky top-0"> <div class="pt-16 max-h-screen overflow-x-scroll sticky top-0">
<nav class="rounded-md p-4 border-2 border-[#5BCEFA]"> <nav class="rounded-md mt-2 p-4 border-2 border-[#5BCEFA]">
<h2 class="text-2xl">On this page</h2> <h2 class="text-2xl">On this page</h2>
<br> <br>
{{sidebar}} {{sidebar}}
</nav> </nav>
</div> </div>
<main class="markdown p-4 my-2"> <main class="py-[4.5rem] markdown p-4">
{{markdown}} {{markdown}}
</main> </main>
</div> </div>
@ -62,4 +60,5 @@
<script src="/js/prism.min.js"></script> <script src="/js/prism.min.js"></script>
<script src="/js/prism.thp.js"></script> <script src="/js/prism.thp.js"></script>
</body> </body>
</html> </html>

View File

@ -13,6 +13,7 @@ module.exports = {
"c-background-2": "var(--c-background-2)", "c-background-2": "var(--c-background-2)",
"c-primary": "var(--c-primary)", "c-primary": "var(--c-primary)",
"c-secondary": "var(--c-secondary)", "c-secondary": "var(--c-secondary)",
"c-nav-bg": "var(--c-nav-bg)",
} }
}, },
fontFamily: { fontFamily: {

View File

@ -11,12 +11,13 @@
--c-box-shadow: #FBFACD; --c-box-shadow: #FBFACD;
--c-pink: #AE508D; --c-pink: #AE508D;
--c-nav-bg: rgb(18, 18, 18, 0.5);
--c-secondary: rgba(136,75,106, 0.5); --c-secondary: rgba(136,75,106, 0.5);
} }
@media (prefers-color-scheme: light) { @media (prefers-color-scheme: light) {
:root { :root {
--c-bg: #F7FFE5; --c-bg: rgb(255, 247, 255);
--c-text: #121212; --c-text: #121212;
--c-purple: #374259; --c-purple: #374259;
--c-purple-light: #BA94D1; --c-purple-light: #BA94D1;
@ -24,7 +25,8 @@
--c-primary: rgb(255, 180, 180); --c-primary: rgb(255, 180, 180);
--c-pink: #374259; --c-pink: #374259;
--c-secondary: rgba(255, 180, 180, 0.5); --c-nav-bg: rgb(255, 247, 255, 0.5);
--c-secondary: rgba(255, 255, 240, 0.5);
} }
} }