Added custom spaces and headings

Added custom spaces and headings users can add like buttons to their littlelink pages to divide button sections into groups.

Spaces can be changed via the number in the title, and one space equals one "<br>". The maximum spaces that can be added with one space 'button' is capped at 10.

The 'Space' button will be replaced with an empty space, so buttons could be visually separated into groups. Entering a number between 1-10 in the title section will change the empty space's distance.

The 'Heading' button will be replaced with a sub-heading, where the title defines the text on that heading.

Author: JulianPrieber

app/Http/Controllers/UserController.php

@@ -92,6 +92,13 @@ public function showButtons()
     //Save add link
     public function addLink(request $request)
     {
+        if ($request->button == 'heading' or $request->button == 'space')
+            $request->validate([
+                'link' => '',
+                'title' => '',
+                'button' => 'required'
+            ]);
+    else
         $request->validate([
             'link' => 'required',
             'title' => '',

database/seeders/ButtonSeeder.php

@@ -179,6 +179,14 @@ public function run()
             [
                 'name' => 'website'
             ],
+
+            [
+                'name' => 'header'
+            ],
+
+            [
+                'name' => 'space'
+            ],
         ];
 
          Button::insert($buttons);

resources/views/littlelink.blade.php

@@ -208,6 +208,17 @@ function get_operating_system() {
          <div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-custom_website button hvr-grow hvr-icon-wobble-vertical" href="{{ route('clickNumber') . '/' . $link->id . '/' . $link->link}}" target="_blank"><img class="icon hvr-icon" src="http://www.google.com/s2/favicons?domain={{$link->link}}">{{ $link->title }}</a></div>
          @elseif($link->name === "custom_website" and $link->custom_css != "")
          <div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button hvr-grow hvr-icon-wobble-vertical" style="{{ $link->custom_css }}" href="{{ route('clickNumber') . '/' . $link->id . '/' . $link->link}}" target="_blank"><img class="icon hvr-icon" src="http://www.google.com/s2/favicons?domain={{$link->link}}">{{ $link->title }}</a></div>
+         @elseif($link->name === "space")
+         <?php 
+          if (is_numeric($link->title) and $link->title < 10)
+          echo str_repeat("<br>",$link->title);
+          elseif (is_numeric($link->title) and $link->title >= 10)
+          echo str_repeat("<br>",10);
+          else
+          echo "<br><br><br>"
+          ?>
+         @elseif($link->name === "heading")
+         <h2>{{ $link->title }}</h2>
          @else
          <div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-{{ $link->name }} button hvr-grow hvr-icon-wobble-vertical" href="{{ route('clickNumber') . '/' . $link->id . '/' . $link->link}}" target="_blank"><img class="icon hvr-icon" src="{{ asset('\/littlelink/icons\/') . $linkName }}.svg">{{ ucfirst($linkName) }}</a></div>
          @endif

resources/views/studio/add-link.blade.php

@@ -32,6 +32,9 @@
 <pre style="color: grey;">
 The 'Custom' button allows you to add a custom link, where the text on the button is determined with the link title set above.
 The 'Custom_website' button functions similar to the Custom button, with the addition of a function that requests the favicon from the chosen URL and uses it as the button icon.
+
+The 'Space' button will be replaced with an empty space, so buttons could be visually separated into groups. Entering a number between 1-10 in the title section will change the empty space's distance.
+The 'Heading' button will be replaced with a sub-heading, where the title defines the text on that heading.
 </pre>
 </details>