Card¶
CardTitle¶
-
class
django_propeller.card.
CardTitle
¶ Renders a Card Title.
Parameters:
- text
- The display text for the title.
- size
- The size for the title as integer. Works with the h-tag, so size=1 is bigger than size=3. Optional. (default=3)
CardSubtitle¶
-
class
django_propeller.card.
CardSubtitle
¶ Renders a Card Subtitle.
Parameters:
- text
- The display text for the subtitle.
CardBody¶
-
class
django_propeller.card.
CardBody
¶ Renders a Card Body.
Parameters:
- text
- The text to display in the body.
CardHeader¶
-
class
django_propeller.card.
CardHeader
¶ Renders a Card Header.
Parameters:
- content_left
- A list of items to display on the left of header. May contain Button, FAB, Image, CardTitle, or CardSubtitle.
- content_middle
- A list of items to display in the middle of header. May contain Button, FAB, Image, CardTitle, or CardSubtitle.
CardMediaActions¶
-
class
django_propeller.card.
CardMediaActions
¶ Renders Card Media Actions.
Parameters:
- items
- A list of items to display in the Card Media Action section. May contain Button or FAB.
CardActions¶
-
class
django_propeller.card.
CardActions
¶ Renders Card Actions.
Parameters:
- items
- A list of items to display in the Card Action section. May contain Button or FAB.
CardMediaImage¶
-
class
django_propeller.card.
CardMediaImage
¶ Renders a Card Media Image.
Parameters:
- image
- Must be an instance of an Image.
CardMedia¶
-
class
django_propeller.card.
CardMedia
¶ Renders Card Media
Parameters:
- content
- if style_inline=True:
- A list of items to display in the card media section. May contain CardMediaImage, CardTitle, or CardSubtitle.
- or if style_inline=False: (default)
- A instance of CardMediaImage
- style_inline
- Display card with inline style if true. (Default: False)
Card¶
-
class
django_propeller.card.
Card
¶ Card is a class that generates a Propeller Card.
Parameters:
- primary_title
- An instance of CardTitle. Optional.
- secondary_title
- An instance of CardSubtitle. Optional.
- header
- An instance of CardHeader. Optional.
- media
- An instance of CardMedia. Optional.
- body
- An instance of CardBody. Optional.
- actions
- An instance of CardActions. Optional.
- media_actions
- An instance of CardMediaActions. Optional.
- style_inverse
- Display dark style if true. (Default: False)
- style_inline
- Display card with inline style if true. (Default: False)
- width
- Width of the card in Bootstrap grid (col-md) as integer. (Default: 4)
Card Example¶
card.py:
from django_propeller.card import Card, CardHeader, CardActions, CardMediaActions, CardTitle, CardSubtitle, \
CardMediaImage, CardBody, CardMedia
from django_propeller.components import Image, Button, FAB
class DemoTitle(CardTitle):
text = "Title goes here"
size = 2
class DemoSubtitle(CardSubtitle):
text = "Secondary text"
class DemoMediaImage(CardMediaImage):
image = Image(source="http://propeller.in/assets/images/profile-pic.png", responsive=True)
class DemoMedia(CardMedia):
content = [DemoMediaImage(), ]
class DemoBody(CardBody):
text = "Cards provide context and an entry point to more robust information and views. " \
"Don't overload cards with extraneous information or actions."
class DemoHeader(CardHeader):
content_middle = [DemoTitle(), DemoSubtitle()]
class DemoActions(CardActions):
items = [
Button(content='primary', button_class='btn-primary'),
Button('Action'),
]
class DemoMediaActions(CardMediaActions):
items = [
FAB('', button_class='btn-primary', icon='share', style='flat', size='sm'),
FAB('', button_class='btn-primary', icon='thumb_up', style='flat', size='sm'),
FAB('', button_class='btn-primary', icon='drafts', style='flat', size='sm')
]
class DemoCard(Card):
primary_title = DemoTitle()
secondary_title = DemoSubtitle()
header = DemoHeader()
actions = DemoActions()
media_actions = DemoMediaActions()
media = DemoMedia()
body = DemoBody()
your_template.html:
{% load propeller %}
{% propeller_card card %}