laget.Templates 1.1.50

laget.Templates

A simple template framework utilizing Handlebars.Net...

Usage

Templates

• Default

Properties

Club

Provides branding information about the club and is mandatory.

• Id club id.
• Badge club emblem.
• Color club primary and secondary colors.
• Name club name.

Hero

The hero is the header section that provides the emblem and the name of the club as well as a title and a massage.

• Title (optional)
• Message (optional)

Constructor properties

{
    Margin = "0px",
    Padding = "30px"
}

Style

Provides the ability to configure the styling of the block, not all blocks, teasers and elements support all style properties.

public class Style
{
    [JsonProperty("background-color")]
    public string BackgroundColor { get; set; }
    [JsonProperty("border-radius")]
    public string BorderRadius { get; set; } = "0px";
    public string Color { get; set; } = "#ffffff";
    [JsonProperty("font-family")]
    public string FontFamily { get; set; } = "Helvetica, Verdana, sans-serif";
    [JsonProperty("font-size")]
    public string FontSize { get; set; } = "14px";
    public string Height { get; set; }
    [JsonProperty("line-height")]
    public string LineHeight { get; set; } = "100%";
    public string Margin { get; set; } = "0 0 0 0";
    [JsonProperty("max-height")]
    public string MaxHeight { get; set; } = "auto";
    [JsonProperty("max-width")]
    public string MaxWidth { get; set; } = "auto";
    [JsonProperty("min-width")]
    public string MinWidth { get; set; } = "auto";
    [JsonProperty("min-height")]
    public string MinHeight { get; set; } = "auto";
    public string Padding { get; set; }
    [JsonProperty("text-align")]
    public string TextAlign { get; set; } = "initial";
    [JsonProperty("text-decoration")]
    public string TextDecoration { get; set; } = "none";
    public string Width { get; set; }
}

Blocks

Button

A simple button with a solid background.

• Message
• Url

Constructor properties

{
    BackgroundColor = "#000000",
    BorderRadius = "0px",
    Color = "#ffffff",
    FontSize = "14px",
    LineHeight = "150%",
    MinWidth = "145px",
    Padding = "10px",
    TextAlign = "center",
    Width = "280px"
}

Link

A simple link.

• Message
• Url

Constructor properties

{
    Color = "#0099ff",
    Margin = "initial",
    Padding = "initial",
    TextAlign = "initial",
    TextDecoration = "none"
}

Separator

• Height

Simple

A simple block containing a title and a message.

• Title
• Message

Constructor properties

{
    Margin = "0px",
    Padding = "0px"
}

Teasers

Applications

This provides a teaser that show links to our mobile applications for Google Android and Apple iOS.

Example

var club = new Club
{
    Id = 67347,
    Badge = "https://az729104.cdn.laget.se/emblem_8378582.png?w=160&h=40&mode=max&scale=both&anchor=middlecenter",
    Color = new Color
    {
        Primary = "#1c252b",
        Secondary = "#ff6a00"
    },
    Name = "FC GonAce"
};

var data = new Template(club)
{
    Hero = new Hero
    {
        Title = "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
        Message = "Donec a risus augue. Cras ac blandit nibh. Donec fermentum erat massa, ut porta mauris scelerisque ut. Nullam in mauris nulla. Pellentesque gravida nulla vel luctus consequat."
    },
    Blocks = new List<Block>
    {
        new Simple
        {
            Title = "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
            Message = "Donec a risus augue. Cras ac blandit nibh. Donec fermentum erat massa, ut porta mauris scelerisque ut. Nullam in mauris nulla. Pellentesque gravida nulla vel luctus consequat."
        },
        new Separator(height: 25),
        new Simple
        {
            Title = "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
            Message = "Donec a risus augue. Cras ac blandit nibh. Donec fermentum erat massa, ut porta mauris scelerisque ut. Nullam in mauris nulla. Pellentesque gravida nulla vel luctus consequat."
        },
        new Separator(height: 25),
        new Button(background: "#ff6a00", padding: "15px 20px", width: "auto")
        {
            Text = "Gå till insamlingen: Insamling till FC GonAce",
            Url = "https://insamling.laget.se/FCGonAce/2"
        }
    },
    Teasers = new List<Teaser>
    {
        new Applications()
    },
    Footer = new List<Link>
    {
        new Link
        {
            Text = "Support",
            Url = "https://www.laget.se"
        },
        new Link
        {
            Text = "Inställningar",
            Url = "https://www.laget.se"
        }
    }
};

var factory = new Factory()
    .WithTemplate(Enums.Template.Default);

var html = factory.Compile(_data);

Result