All Projects → Colorless-Green-Ideas → MaterialDjango

Colorless-Green-Ideas / MaterialDjango

Licence: MIT license
🖌️ Polymer Paper-UI widgets, vendored polymer, and tools for django

Programming Languages

javascript
184084 projects - #8 most used programming language
python
139335 projects - #7 most used programming language

Projects that are alternatives of or similar to MaterialDjango

vaadin-dialog
High quality web component for modal dialogs. Part of the Vaadin platform.
Stars: ✭ 15 (-44.44%)
Mutual labels:  polymer
lego
🚀 Web-components made lightweight & Future-Proof.
Stars: ✭ 69 (+155.56%)
Mutual labels:  polymer
polymer-2-carousel
Codelab
Stars: ✭ 18 (-33.33%)
Mutual labels:  polymer
moment-element
Web Component (with Polymer) wrapper for the moment library
Stars: ✭ 15 (-44.44%)
Mutual labels:  polymer
scheduler-component
A Web Component wrapper for FullCalendar library that uses Polymer version 2.0 and ES6.
Stars: ✭ 24 (-11.11%)
Mutual labels:  polymer
paper-weather
☀️🌧 Material design weather element inspired by google weather
Stars: ✭ 14 (-48.15%)
Mutual labels:  polymer
synthesis
🔥 Synthesis is Meteor + Polymer
Stars: ✭ 28 (+3.7%)
Mutual labels:  polymer
toggle-icon
toggle-icon is a custom element created with Polymer. It provides an extremely powerful and customizable switch that looks like a paper-icon-button.
Stars: ✭ 21 (-22.22%)
Mutual labels:  polymer
file-fire
Simple way to upload and download files from Firebase Storage.
Stars: ✭ 13 (-51.85%)
Mutual labels:  polymer
nuxeo-elements
Nuxeo web components
Stars: ✭ 23 (-14.81%)
Mutual labels:  polymer
mdgrad
Pytorch differentiable molecular dynamics
Stars: ✭ 127 (+370.37%)
Mutual labels:  polymer
polymer-ui-router
UI-router wrapper for Web Components
Stars: ✭ 24 (-11.11%)
Mutual labels:  polymer
chat-window
A simple and flexible chat window for listing messages.
Stars: ✭ 27 (+0%)
Mutual labels:  polymer
nuxeo-ui-elements
Library of UI web components
Stars: ✭ 20 (-25.93%)
Mutual labels:  polymer
order-management
Simple Order Management web application built using NodeJS, ExpressJS, Polymer, MongoDB
Stars: ✭ 33 (+22.22%)
Mutual labels:  polymer
stl-part-viewer
A lit-element web component that uses Three.js to display an STL model file.
Stars: ✭ 19 (-29.63%)
Mutual labels:  polymer
xkcd-img
Custom Polymer element for displaying random images from XKCD!
Stars: ✭ 12 (-55.56%)
Mutual labels:  polymer
auth-ajax
Auth token handling for Polymer
Stars: ✭ 15 (-44.44%)
Mutual labels:  polymer
paper-countries
Select Dropdown with list of countries with flags and autocomplete
Stars: ✭ 16 (-40.74%)
Mutual labels:  polymer
skeleton-carousel
Carousel component. Horizontal and vertical swipe navigation
Stars: ✭ 31 (+14.81%)
Mutual labels:  polymer

MaterialDjango

Code Health PyPI Documentation Status

Polymer Paper-UI widgets and tools for django

Install

  • pip install materialdjango or install from git if you want more frequent (possibly breaking) changes.
  • add materialdjango to your INSTALLED_APPS in settings.py
  • re-run manage.py collectstatic

Getting Started

  • make sure you {% load staticfiles %}
  • and also add {% load polymerdep %} which imports our filter |dep
  • Add the webcomponents.js shim
  • use dep to import included polymer html elements (currently 1.0)

Eg:

{% load staticfiles %}
{% load polymerdep %}
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <script src="{% static 'materialdjango/components/bower_components/webcomponentsjs/webcomponents-lite.js' %}"></script>
    {{ "polymer/polymer.html" | dep}}
<...>

I want to go faster

Use my base.html template with vinyl-siding.html which is imspired by the polymer documentation.

{% extends "vinyl-siding.html" %}

How do I Use polymer elements?

Documentation for polymer elements is contained on the element catalog. We include the Paper and Iron collections.

Additional Components

Additional components should be installed with bower and symlinked to your app's static/ directory (see the materialdjango source for an example). Alternatively you may download them as a zip from the catalog and place them in your app's static/ directory.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].