102 lines
2.5 KiB
Plaintext
102 lines
2.5 KiB
Plaintext
; MaterialSB Example - Media and Tables
|
|
; This example demonstrates images, videos, and table components.
|
|
|
|
IncludeFile "MaterialSB.sbi"
|
|
|
|
EnableExplicit
|
|
|
|
Procedure Main(Result)
|
|
Protected t, item
|
|
UseModule MaterialSB
|
|
|
|
SetDarkTheme(#False)
|
|
|
|
; Navbar
|
|
Navbar(#Navbar_Shadow1 | #Navbar_Container)
|
|
NavbarAddLogo("Media")
|
|
|
|
; Images Section
|
|
Row(#Grid_Container)
|
|
Col(12)
|
|
Append("<h3>Media Components</h3>")
|
|
Append("<h5>Images</h5>")
|
|
CloseCurrentParent(2)
|
|
|
|
Row(#Grid_Container)
|
|
|
|
Col(12, 4)
|
|
Card("", #Card_Panel)
|
|
CardTitle(Header("Default Image", 5))
|
|
item = CardContent()
|
|
AddClass(item, #Class_Centered)
|
|
Image("https://picsum.photos/300/200", "Sample image")
|
|
CloseCurrentParent(3)
|
|
|
|
Col(12, 4)
|
|
Card("", #Card_Panel)
|
|
CardTitle(Header("Responsive Image", 5))
|
|
item = CardContent()
|
|
AddClass(item, #Class_Centered)
|
|
Image("https://picsum.photos/300/200", "Responsive image", #Media_Responsive)
|
|
Append("<p class='center-align'><small>Scales with container</small></p>")
|
|
CloseCurrentParent(3)
|
|
|
|
Col(12, 4)
|
|
Card("", #Card_Panel)
|
|
CardTitle(Header("Circle Image", 5))
|
|
item = CardContent()
|
|
AddClass(item, #Class_Centered)
|
|
Image("https://picsum.photos/200/200", "Circle image", #Media_Circle | #Media_Responsive)
|
|
Append("<p class='center-align'><small>Great for avatars</small></p>")
|
|
CloseCurrentParent(3)
|
|
|
|
CloseCurrentParent()
|
|
|
|
; Video Section
|
|
Row(#Grid_Container)
|
|
Col(12)
|
|
Append("<h5>Videos</h5>")
|
|
CloseCurrentParent(2)
|
|
|
|
Row(#Grid_Container)
|
|
|
|
Col(12)
|
|
Card("", #Card_Panel)
|
|
Append("<p><strong>YouTube Video (Responsive)</strong></p>")
|
|
Append("<p><em>Replace this URL with your own YouTube embed link.</em></p>")
|
|
YoutubeVideo("https://www.youtube.com/embed/jNQXAC9IVRw", #Media_Responsive)
|
|
CloseCurrentParent(2)
|
|
|
|
Col(12)
|
|
Append("<h5>Media Flags</h5>")
|
|
t = Table("Flag", #Table_Striped | #Table_Centered)
|
|
TableAddColumn("Effect", t)
|
|
|
|
TableAddItem("#Media_Default" + Chr(10) + "Default media with no styling", t)
|
|
TableAddItem("#Media_Responsive" + Chr(10) + "Scales with container", t)
|
|
TableAddItem("#Media_Circle" + Chr(10) + "Rounded", t)
|
|
TableAddItem("#Media_Controls" + Chr(10) + "For video", t)
|
|
CloseCurrentParent()
|
|
|
|
Append("<br>")
|
|
Append("<br>")
|
|
CloseCurrentParent()
|
|
|
|
AutoInit()
|
|
|
|
UnuseModule MaterialSB
|
|
|
|
EndProcedure
|
|
|
|
MaterialSB::Download(@Main())
|
|
|
|
; IDE Options = SpiderBasic 3.10 (Windows - x86)
|
|
; CursorPosition = 70
|
|
; FirstLine = 12
|
|
; Folding = -
|
|
; iOSAppOrientation = 0
|
|
; AndroidAppCode = 0
|
|
; AndroidAppOrientation = 0
|
|
; EnableXP
|
|
; DPIAware
|
|
; CompileSourceDirectory |