diff --git a/_includes/filepath.html b/_includes/filepath.html index d05cafd8..492fa7c2 100644 --- a/_includes/filepath.html +++ b/_includes/filepath.html @@ -1 +1,10 @@ -

{{ include.path | replace: "/", "/" }}

\ No newline at end of file +{% comment %} + +{% endcomment %} +

{{ include.path | replace: "/", "/" }}

\ No newline at end of file diff --git a/_sass/custom/custom.scss b/_sass/custom/custom.scss index 9816d8d6..eba75f3c 100644 --- a/_sass/custom/custom.scss +++ b/_sass/custom/custom.scss @@ -1,3 +1,7 @@ +/* + Theme switcher +*/ + .theme-switcher { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3e%3cpath d='M7 7l3-3 3 3m0 6l-3 3-3-3' stroke='%239fa6b2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e"); border-width: 1px; @@ -16,6 +20,10 @@ background-repeat: no-repeat; } +/* + Table of contents +*/ + @media (min-width: 93rem) { #toc { position: fixed; @@ -116,6 +124,18 @@ padding-left: 1em; } +details#toc summary::-webkit-details-marker { + display: none; +} + +details#toc > summary { + list-style: none; +} + +/* + Contributors widget +*/ + #contributors { display: flex; } @@ -129,6 +149,10 @@ width: 30px; } +/* + News +*/ + .post { background: $table-background-color; padding: 10px; @@ -139,29 +163,15 @@ line-break: anywhere; } +/* + Navigation labels +*/ + .nav-list-link .label { padding-top: 0; padding-bottom: 0; } -.search-input { - color: $body-text-color; -} - -details#toc summary::-webkit-details-marker { - display: none; -} - -details#toc > summary { - list-style: none; -} - -.nav-list .nav-list-item .nav-list-link:hover, .nav-list .nav-list-item .nav-list-link.active { - background-image: none; - background: $feedback-color; - border-radius: 4px; -} - .label-guide { background-color: #7253ed; width: 25px; @@ -171,6 +181,10 @@ details#toc > summary { padding: 0; } +/* + File path include +*/ + .filepath { font-family: "SFMono-Regular", Menlo, Consolas, monospace; margin-bottom: 0; @@ -193,4 +207,69 @@ details#toc > summary { div.highlighter-rouge { border-radius: 0; border: $border-color 1px solid; +} + +/* + Directory structure include +*/ + +.folder-structure ul { + list-style: none; + margin-top: 0; + padding-left: 0; +} + +.folder-structure li { + padding-left: 20px; + position: relative; + line-height: 2em; + margin: 0; +} + +.folder-structure li:before { + position: absolute; + left: 5px; + top: -2px; + content: '' !important; + display: block; + height: 1em; + border-bottom: 1px solid #bbb; + width: 10px; + margin-left: 0 !important; +} + +.folder-structure li:after { + position: absolute; + left: 5px; + bottom: 0; + content: ''; + display: block; + border-left: 1px solid #bbb; + height: 100%; +} + +.file::before { + content: '📝'; +} + +.folder::before { + content: '📁'; +} + +.image::before { + content: '🖼️'; +} + +/* + Misc fixes +*/ + +.search-input { + color: $body-text-color; +} + +.nav-list .nav-list-item .nav-list-link:hover, .nav-list .nav-list-item .nav-list-link.active { + background-image: none; + background: $feedback-color; + border-radius: 4px; } \ No newline at end of file diff --git a/dir-structure.md b/dir-structure.md new file mode 100644 index 00000000..016b9caf --- /dev/null +++ b/dir-structure.md @@ -0,0 +1,199 @@ +--- +layout: default +title: Directory structure +nav_exclude: true +search_exclude: true +--- + +# Directory structure + +There is a number of CSS classes, which help build the directory structure. + +Example: +```html +
+ +
+``` + +Result: +
+ +
+ +## CSS classes + +### folder-structure + +Changes unordered list style, so it resembles directory tree. + +### folder + +Adds folder emoji before element. + +### file + +Adds text file emoji before element. + +### image + +Adds image emoji before element. + +## Structure generator + +There is also automatic structure generator at [https://stirante.com/dir-converter/converter.html](https://stirante.com/dir-converter/converter.html). + +The text area on the left accepts a list of paths delimited by new line. After clicking the convert button, the HTML should be generated in text area on the right side. + +To generate the output in the first example, use this input: +``` +RP/texts/en_US.lang +RP/textures/item_texture.json +RP/items/meal.item.json +BP/items/meal.item.json +BP/items/gem.item.json +RP/items/gem.item.json +RP/textures/items/gem.png +RP/textures/items/meal.png +``` + +### File links + +To link file inside directory structure to an element, add `#` after file path like this: + +``` +RP/texts/en_US.lang +RP/textures/item_texture.json +RP/items/meal.item.json#rp_meal_item +BP/items/meal.item.json#bp_meal_item +BP/items/gem.item.json#bp_gem_item +RP/items/gem.item.json#rp_gem_item +RP/textures/items/gem.png +RP/textures/items/meal.png +``` + +This will result in this output: +```html +
+ +
+``` \ No newline at end of file diff --git a/guide/custom-items.md b/guide/custom-items.md index b29f4059..cb8b543d 100644 --- a/guide/custom-items.md +++ b/guide/custom-items.md @@ -27,7 +27,7 @@ Let's start off by creating our simple item's behavior file: `BP/items/gem.item. ## Gem Behavior Code (BP) -{% include filepath.html path="BP/items/gem.item.json" %} +{% include filepath.html path="BP/items/gem.item.json" id="bp_gem_item" %} ```jsonc { "format_version": "1.10", @@ -62,7 +62,7 @@ If you enter the game now, the item will function, but it will be invisible. You ## Gem Resource Code (RP) -{% include filepath.html path="RP/items/gem.item.json" %} +{% include filepath.html path="RP/items/gem.item.json" id="rp_gem_item" %} ```jsonc { "format_version": "1.10", @@ -121,7 +121,7 @@ Creating a food item is very much the same as creating a simple item, except an ## Meal BP Code -{% include filepath.html path="BP/items/meal.item.json" %} +{% include filepath.html path="BP/items/meal.item.json" id="bp_meal_item" %} ```jsonc { "format_version": "1.12.0", @@ -168,7 +168,7 @@ Creating a food item is very much the same as creating a simple item, except an ## Meal RP Code -{% include filepath.html path="RP/items/meal.item.json" %} +{% include filepath.html path="RP/items/meal.item.json" id="rp_meal_item" %} ```jsonc { "format_version": "1.10", @@ -224,6 +224,47 @@ item.tut:meal.name=Meal [You can learn more about .lang here](https://wiki.bedrock.dev/concepts/lang.html) +
+ +
+ ___ ___