Changes for page Card Navigation

Last modified by Calvin Henderson on 2025/03/11 10:29

From version 2.1
edited by calvin_henderson
on 2024/12/18 10:43
Change comment: There is no comment for this version
To version 9.1
edited by calvin_henderson
on 2024/12/18 12:32
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -1,11 +1,5 @@
1 -== Display Settings ==
1 +{{cardView}}
2 +fa-user,https://google.com;
3 +{{/cardView}}
2 2  
3 -(% id="display-settings" style="width:570px" %)
4 -|(% style="width:158px" %)**Card Width (pixels)**|(% style="width:153px" %)**Card Height (pixels)**
5 -|(% style="width:158px" %) |(% style="width:153px" %)
6 -
7 -== Card Configuration ==
8 -
9 -(% id="cards" style="width:573px" summary="Cards" %)
10 -|(% style="width:181px" %)**Icon Name[[ 🔗>>https://fontawesome.com/v6/search?m=free||rel=" noopener noreferrer" target="_blank"]]**|(% style="width:390px" %)**Wiki Link or URL**
11 -|(% style="width:181px" %) |(% style="width:390px" %)
5 +
AppWithinMinutes.Content[0]
XWiki.WikiMacroClass[0]
async_cached
... ... @@ -1,0 +1,1 @@
1 +No
async_enabled
... ... @@ -1,0 +1,1 @@
1 +No
code
... ... @@ -1,0 +1,48 @@
1 +{{velocity}}
2 +
3 +#set( $wikiRef = $doc.documentReference.getWikiReference().getName() )
4 +#set( $docRef = $doc.getFullName() )
5 +
6 +#set( $cards = [
7 + {"title": "Devices/Hardware", "icon": "fa-laptop", "href": "DevicesHardware"},
8 + {"title": "Websites/Software", "icon": "fa-cloud", "href": "WebsitesSoftware"},
9 + {"title": "Phones/WiFi/Network/Security", "icon": "fa-wifi", "href": "PhonesWiFiNetworkSecurity"},
10 + {"title": "Users/Accounts", "icon": "fa-address-card", "href": "UsersAccounts"},
11 + {"title": "Other", "icon": "fa-question-circle", "href": "Other"}
12 +])
13 +
14 +#if("$xcontext.action" != "edit")
15 + {{html wiki="true"}}
16 + <div style="display: grid;
17 + grid-template-columns: 1fr 1fr 1fr;
18 + gap: 10px;
19 + ">
20 +#foreach($card in $cards)
21 + <a href="$card.href" style="text-decoration:none;">
22 + <div style="
23 + display:grid;
24 + text-align:center;
25 + padding:8px;
26 + border-radius:5px;
27 + border:1px solid rgba(222,222,222,1);
28 + border-bottom: 3px solid rgba(222,222,222,1);
29 + ">
30 + <i class="fa $card.icon" style="font-size:4em;"></i>
31 + <h3>$card.title</h3>
32 + </div>
33 + </a>
34 +#end
35 + </div>
36 + {{/html}}
37 +#end
38 +
39 +
40 +----
41 +
42 +== Search ==
43 +
44 +{{documentTree root="document:$wikiRef:$docRef" finder="true" limit="30"/}}
45 +
46 +{{/velocity}}
47 +
48 +{{wikimacrocontent/}}
contentDescription
... ... @@ -1,0 +1,1 @@
1 +icon-name,link;
contentJavaType
... ... @@ -1,0 +1,1 @@
1 +Wiki
contentType
... ... @@ -1,0 +1,1 @@
1 +Mandatory
description
... ... @@ -1,0 +1,1 @@
1 +Displays a grid of cards for linking to other pages.
id
... ... @@ -1,0 +1,1 @@
1 +cardView
name
... ... @@ -1,0 +1,1 @@
1 +Card View
supportsInlineMode
... ... @@ -1,0 +1,1 @@
1 +No
visibility
... ... @@ -1,0 +1,1 @@
1 +Global