Created
September 19, 2017 13:42
-
-
Save jensens/e07b324d40f1acdffd752969f0071949 to your computer and use it in GitHub Desktop.
cornerribbon tile Plone
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:tal="http://xml.zope.org/namespaces/tal" xmlns:i18n="http://xml.zope.org/namespaces/i18n" i18n:domain="bda.aaf.site"> | |
| <head> | |
| <style tal:condition="view/show"> | |
| /* The ribbons */ | |
| .corner-ribbon{ | |
| position: fixed; | |
| top: 25px; | |
| left: -50px; | |
| width: 200px; | |
| line-height: 28px; | |
| background: purple; | |
| box-shadow: 0 0 3px rgba(0,0,0,.3); | |
| color: #f0f0f0; | |
| letter-spacing: 1px; | |
| text-align: center; | |
| z-index: 20000; | |
| transform: rotate(-45deg); | |
| -webkit-transform: rotate(-45deg); | |
| } | |
| /* Different positions */ | |
| .corner-ribbon.top-left{ | |
| left: -50px; | |
| transform: rotate(-45deg); | |
| -webkit-transform: rotate(-45deg); | |
| } | |
| .corner-ribbon.top-right{ | |
| /* right: -50px; */ | |
| top: 0; | |
| right: -85px; | |
| left: auto; | |
| transform: rotate(45deg); | |
| -webkit-transform: rotate(45deg); | |
| } | |
| /* Colors */ | |
| .corner-ribbon.white{background: #f0f0f0; color: #555;} | |
| .corner-ribbon.black{background: #333;} | |
| .corner-ribbon.grey{background: #999;} | |
| .corner-ribbon.blue{background: #39d;} | |
| .corner-ribbon.green{background: #2c7;} | |
| .corner-ribbon.turquoise{background: #1b9;} | |
| .corner-ribbon.purple{background: #95b;} | |
| .corner-ribbon.red{background: purple;} | |
| .corner-ribbon.orange{background: #e82;} | |
| .corner-ribbon.yellow{background: #ec0;} | |
| </style> | |
| </head> | |
| <body> | |
| <div tal:condition="view/show" class="corner-ribbon top-right sticky ${view/color} shaddow">${view/text}</div> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| # -*- coding: utf-8 -*- | |
| from plone.tiles import Tile | |
| import os | |
| class CornerRibbonTile(Tile): | |
| """Configureable ribbon | |
| """ | |
| @property | |
| def _tag(self): | |
| return os.environ.get('STATUS', 'DEV') | |
| def show(self): | |
| return self._tag != 'live' | |
| def text(self): | |
| if self._tag == 'latest': | |
| return 'RC' | |
| return 'DEV' | |
| def color(self): | |
| if self._tag == 'latest': | |
| return 'purple' | |
| return 'orange' |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment