Update SIP page to include video

content/student-innovation-project/_index.md → content/student-innovation-project/index.md

@@ -14,12 +14,18 @@ The shader template exporter is designed to make it easier to use basic shaders
 
 {{< dots >}}
 
+## Video
+{{< youtube 1KGUNfnUdCg >}}
+
+{{< padding >}}
+{{< dots >}}
+
 ## Implementation of the Shader Exporting
 Shader exporting is similar to how static website generators work, take a template and operate on it depending on the context. By having a tag in the template file – something like `// <% core_here %>` – the exporter can place the core into the template where the user specifies.
 
 The shader exporter will have a singular 
 
-Interface example:
+### Interface example:
 ```hlsl
 /* template/Unity.hlsl */
 
@@ -30,7 +36,7 @@ void main() {
 }
 ```
 
-Core example:
+### Core example:
 ```hlsl
 /* cvd/core.hlsl */
 
@@ -40,7 +46,7 @@ float3 LMS_to_RGB(float3 lms) ...
 float3 Daltonize(float3 lms, int type) ...
 ```
 
-Result from the generation :
+### Result from the generation:
 ```hlsl
 /* gen/Unity_gen.hlsl */
 

themes/customTheme/layouts/_default/_markup/render-codeblock.html

@@ -19,7 +19,7 @@
   document.getElementById("{{ .Type }}-{{ .Ordinal }}").innerHTML = window.toHtml(tree);
 </script>
 
-<pre class="code-block">
+<pre class="code-block gen-padding">
 <span id="{{ .Type }}-{{ .Ordinal }}" class="{{ .Type }}-code-block" >{{ .Inner }}</span>
 </pre>
 

themes/customTheme/layouts/shortcodes/padding.html

@@ -0,0 +1 @@
+<div class="gen-padding"></div>

themes/customTheme/static/css/site.css

@@ -90,6 +90,10 @@ p {
     margin-bottom: var(--gen-bottom-padding);
 }
 
+.gen-padding {
+    margin-bottom: var(--gen-bottom-padding);
+}
+
 footer > .foot-selectables {
     display: flex;
     justify-content: end;