ftw.theming


Nameftw.theming JSON
Version 2.1.2 PyPI version JSON
download
home_pagehttps://github.com/4teamwork/ftw.theming
Summary
upload_time2020-11-25 20:31:59
maintainer
docs_urlNone
author4teamwork AG
requires_python
licenseGPL2
keywords ftw theming
VCS
bugtrack_url
requirements No requirements were recorded.
Travis-CI No Travis.
coveralls test coverage No coveralls.
            .. contents:: Table of Contents


Installation
============

Add the package as dependency to your setup.py:

.. code:: python

  setup(...
        install_requires=[
          ...
          'ftw.theming',
        ])

or to your buildout configuration:

.. code:: ini

  [instance]
  eggs += ftw.theming

and rerun buildout.


SCSS Registry
=============

The SCSS registry is configured with ZCML and contains all SCSS resources from
``ftw.theming``, addons, the theme and policy packages.


Inspecting the SCSS registry
----------------------------

The ``@@theming-resources`` (on any navigation root) lists all resources.


Resource slots
--------------

The registry allows to register resources to a list of fix slots.
These are the available slots, sorted by inclusion order:

- ``top``
- ``variables``
- ``mixins``
- ``ftw.theming``
- ``addon``
- ``theme``
- ``policy``
- ``bottom``

Adding resources
----------------

Adding SCSS resources is done in the ZCML of a package.
The SCSS should always go into the same package where the styled templates are.

Registering a resource
~~~~~~~~~~~~~~~~~~~~~~

.. code:: xml

    <configure
        xmlns:theme="http://namespaces.zope.org/ftw.theming"
        xmlns:zcml="http://namespaces.zope.org/zcml"
        i18n_domain="ftw.tabbedview">

        <configure zcml:condition="installed ftw.theming">
          <include package="ftw.theming" />

          <theme:scss
              file="resources/tabbed.scss"
              slot="addon"
              profile="ftw.tabbedview:default"
              />
        </configure>

    </configure>


Options for standalone ``theme:scss``
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

- ``file``: relative path to the SCSS file (required)
- ``slot``: name of the slot (see slots section, default: ``addon``)
- ``profile``: Generic Setup profile required to be installed (default:
  no profile, e.g. ``my.package:default``)
- ``for``: context interface (default: ``INavigationRoot``)
- ``layer``: request layer interface (default: ``Interface``)
- ``before``: name of the resource after which this resource should be ordered
  (within the same slot).
- ``after``: name of the resource before which this resource should be ordered
  (within the same slot)


Registering multiple resources
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

.. code:: xml

    <configure
        xmlns:theme="http://namespaces.zope.org/ftw.theming"
        xmlns:zcml="http://namespaces.zope.org/zcml"
        i18n_domain="plonetheme.fancy">

        <include package="ftw.theming" />

        <theme:resources
            slot="theme"
            profile="plonetheme.fancy:default"
            layer="plonetheme.fancy.interfaces.IFancyTheme">

            <theme:scss file="resources/foo.scss" />
            <theme:scss file="resources/bar.scss" />

        </theme:resources>

    </configure>

Options for ``theme:resources``
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

- ``slot``: name of the slot (see slots section, default: ``addon``)
- ``profile``: Generic Setup profile required to be installed (default:
  no profile, e.g. ``my.package:default``)
- ``for``: context interface (default: ``INavigationRoot``)
- ``layer``: request layer interface (default: ``Interface``)

Options for ``theme:scss`` within ``theme:resources``
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

- ``file``: relative path to the SCSS file (required)
- ``before``: name of the resource after which this resource should be ordered
  (within the same slot).
- ``after``: name of the resource before which this resource should be ordered
  (within the same slot)


Resource names
~~~~~~~~~~~~~~

Each resource has an automatically generated name, which can be looked up in the
``@@theming-resources``-view.
The resource has the format ``[package]:[relative path]``.


Resource Ordering
-----------------

The SCSS resources are ordered when retrieved from the registry, so that the
order is as consistent as possible.

Ordering priority:

1. the resource's ``slot`` (see the slot section below)
1. the ``before`` and ``after`` options (topological graph sorting), within each slot.
1. the ZCML load order of the resources

Be aware that the ZCML load order is usally random.


Resource factories for dynamic resources
----------------------------------------

A resource factory is a callable (accepting context and request) which returns
a ``DynamicSCSSResource`` object.
Since the callable instantiates the resource, it's content can be created dynamically.


.. code:: xml

    <configure
        xmlns:theme="http://namespaces.zope.org/ftw.theming"
        xmlns:zcml="http://namespaces.zope.org/zcml"
        i18n_domain="plonetheme.fancy">

        <include package="ftw.theming" />

        <theme:scss_factory factory=".dynamic_resource_factory" />

    </configure>


.. code:: python

    from ftw.theming.interfaces import ISCSSResourceFactory
    from ftw.theming.resource import DynamicSCSSResource
    from zope.interface import provider

    @provider(ISCSSResourceFactory)
    def dynamic_resource_factory(context, request):
        return DynamicSCSSResource('dynamic.scss', slot='addon', source='$color: blue;',
                                   cachekey='1')


When generating the SCSS is expensive in time, you should subclass the
``DynamicSCSSResource`` class and implement custom ``get_source`` and ``get_cachekey``
methods.
The ``get_cachekey`` should be very lightweight and cheap: it is called on every pageview.
It should return any string and only change the return value when the ``get_source`` result
will change.

.. code:: python

    from Products.CMFCore.utils import getToolByName
    from ftw.theming.interfaces import ISCSSResourceFactory
    from ftw.theming.resource import DynamicSCSSResource
    from zope.annotation import IAnnotations
    from zope.interface import provider


    class CustomSCSSResource(DynamicSCSSResource):

          def get_source(self, context, request):
              return 'body { background-color: $primary-color; }'

          def get_cachekey(self, context, request):
              portal = getToolByName(context, 'portal_url').getPortalObject()
              config = IAnnotations(portal).get('my-custom-config', {})
              return config.get('last-change-timestamp', '1')

    @provider(ISCSSResourceFactory)
    def dynamic_resource_factory(context, request):
        return CustomSCSSResource('my.package:custom.scss', slot='addon')



Control Panel
=============

When ``ftw.theming`` is installed, a control panel is added, listing the
SCSS resources and the default SCSS variables.
The controlpanel views are available on any navigation root.


Icons
=====

``ftw.theming`` provides a portal type icon registry.
The default iconset is `font-awesome`_.


Declare icon for portal types
-----------------------------

Portal type icons are declared in the scss file of the addon package.
It is possible to support multiple icon sets by declaring icons for each iconset:

.. code:: scss

    @include portal-type-font-awesome-icon(repository-folder, leaf);
    @include portal-type-icon(repository-folder, "\e616", customicons);

Using those mixins does not generate any CSS yet, nor does it introduce dependency
to those iconset.
It simply stores this information in a list to be processed later.


Switching iconset
-----------------

A theme or policy package may change the iconset.
The standard iconset is ``font-awesome``.
Changing the iconset should be done in an SCSS file in the ``variables`` slot.

.. code:: scss

    $standard-iconset: customicons;


Custom iconsets
---------------

The default iconset is ``font-awesome``, which is automatically loaded and the
necessary CSS is generated when the ``$standard-iconset`` variable is ``font-awesome``.

For having custom iconsets an SCSS file must be registered in the ``bottom`` slot.
This is usually done by a theme or policy package.

The SCSS file should apply the necessary CSS only when the ``$standard-iconset`` is set
to this iconset:

.. code:: scss

    @if $standard-iconset == customicons {

      @font-face {
        font-family: 'customicons';
        src:url('#{$portal-url}/++theme++foo/fonts/customicons.eot?-fa99j8');
        src:url('#{$portal-url}/++theme++foo/fonts/customicons.eot?#iefix-fa99j8') format('embedded-opentype'),
        url('#{$portal-url}/++theme++foo/fonts/customicons.woff?-fa99j8') format('woff'),
        url('#{$portal-url}/++theme++foo/fonts/customicons.ttf?-fa99j8') format('truetype'),
        url('#{$portal-url}/++theme++foo/fonts/customicons.svg?-fa99j8#opengever') format('svg');
        font-weight: normal;
        font-style: normal;
      }

      .icons-on [class^="contenttype-"],
      .icons-on [class*=" contenttype-"] {
        &:before {
          font-family: 'customicons';
          content: "x";
          text-align:center;
          position: absolute;
        }
      }

      @each $type, $value in get-portal-type-icons-for-iconset(font-awesome) {
        body.icons-on .contenttype-#{$type} {
          &:before {
            content: $value;
          }
        }
      }
    }



Functions
=========

embed-resource
--------------

The ``embed-resource`` function embeds a resource (e.g. svg) as
base64 encoded url.

Example:

.. code:: scss

    .something {
        background: embed-resource("images/foo.svg");
    }

The function is able to fill colors in SVGs.
This can be done with either XPath or CSS selectors.

Since lxml is used for filling the SVGs and SVGs are namespaced
XML documents, the expressions must be namespaced as well.
This leads to problems when converting certain CSS selectors
since CSS does not support namespaces.

Example:

.. code:: scss

    .foo {
        background: embed-resource("soccer.svg", $fill-css:('#pentagon', red));
    }

    .bar {
        background: embed-resource("soccer.svg", $fill-xpath:('//*[@id="black_stuff"]/*[local-name()="g"][1]', red));
    }


It is also possible to fill multiple different colors at once by
repeating the ``selector, color`` pattern.

.. code:: css

    .foo {
        background: embed-resource("soccer.svg", $fill-css:('.black-stuff', black, '.red-stuff', red, '.white-stuff', white));
    }



SCSS Mixins
===========

Using media queries Mixins
--------------------------

``ftw.theming`` provides mixins for most common media queries:

- small (480px)
- medium (800px)
- large (1024)

Example usage:

.. code:: scss

    #container {
        width: 1600px;

        @include screen-medium {
            width:1000px;
        }
        @include screen-small {
            width:500px;
        }
    }

Including font faces
--------------------

.. code:: scss

  @include font-face($name: 'VerdanaRegular', $path: '++resource++nidau.web/fonts/Verdana');

The file-extension for the ``$path`` argument is going to be concatenated automatically.
Both ``woff`` and ``woff2`` must be provided.

The mixin then produces the following css code:

.. code:: css

  @font-face {
    font-family: 'VerdanaRegular';
    font-style: normal;
    font-weight: normal;
    src: url("++resource++nidau.web/fonts/Verdana.woff2") format(woff2),
      url("++resource++nidau.web/fonts/Verdana.woff") format(woff);
  }

  @font-face {
    font-family: 'VerdanaBold';
    font-style: normal;
    font-weight: bold;
    src: url("++resource++nidau.web/fonts/Verdana-Bold.woff2") format(woff2),
      url("++resource++nidau.web/fonts/Verdana-Bold.woff") format(woff);
  }

Links
=====

- Github: https://github.com/4teamwork/ftw.theming
- Issues: https://github.com/4teamwork/ftw.theming/issues
- Pypi: http://pypi.python.org/pypi/ftw.theming
- Continuous integration: https://jenkins.4teamwork.ch/search?q=ftw.theming

Copyright
=========

This package is copyright by `4teamwork <http://www.4teamwork.ch/>`_.

``ftw.theming`` is licensed under GNU General Public License, version 2.

.. _font-awesome: http://fortawesome.github.io/Font-Awesome/

Changelog
=========

2.1.2 (2020-11-25)
------------------

- Extend readme about how use embed-resource with multiple coulors [Nachtalb]
- Make getting icon from brain/solr flare more robust. [mathias.leimgruber]


2.1.1 (2020-01-14)
------------------

- Fix mimetype icon problem for Plone 4 when there is no icon defined. [jone]


2.1.0 (2020-01-10)
------------------

- Improve mimetype icons support for better Plone 5 support. [jone]


2.0.2 (2019-03-19)
------------------

- plone.browserlayer subscriber must be registered before our subscriber [Nachtalb]


2.0.1 (2019-01-17)
------------------

- Fix UnicodeEncodeError error for content types names with unicode characters [Nachtalb]


2.0.0 (2018-01-17)
------------------

- Deprecate legacy breakpoint mixins and variables. [Kevin Bieri]
- Remove deprecated variables. [Kevin Bieri]


1.11.0 (2017-12-19)
-------------------

- Avoid using freeze in test_cachekey_refreshes_when_navroot_changes
  for plone 5.1, since we get a ReadConflictError. The value of the test does not change if we remove the freeze context manager. [mathias.leimgruber]

- Implement Plone 5.1 compatibility [mathias.leimgruber]


1.10.2 (2017-07-03)
-------------------

- Introduce webkit-only mixin. [Kevin Bieri]


1.10.1 (2017-06-02)
-------------------

- Fix escaping of font type on fontface mixin. [Kevin Bieri]
- Provide background option for tab-list mixin. [Kevin Bieri]
- Introduce hyphenation mixin. [Bieri Kevin]


1.10.0 (2017-03-20)
-------------------

- Add uninstall profile [raphael-s]

- Make sure the default profile is installed when installing ftw.theming with
  quickinstaller. [raphael-s]


1.9.0 (2017-02-09)
------------------

- Update font-awesome to 4.7.0.
  [elioschmutz]


1.8.2 (2017-01-11)
------------------

- 1.8.1 was accidentally released from the wrong branch. Please use 1.8.2 instead.
  [Kevin Bieri]

- Use two columns for print layout.
  [Kevin Bieri]

- Avoid duplicate (mimetype) icons on "Image" types. [jone]

- Introduce new mixins

  - Introduce link-color helper
  - Introduce font-face helper
  - Introduce rem helper

  [Kevin Bieri]


1.8.0 (2016-10-06)
------------------

- Switch from "private" to "public" caching, since the CSS does
  not contain any user specific data. [jone]

- Fix caching for unpublished navigation roots by not using p.a.caching. [jone]

- Introduce appearance helper
  [Kevin Bieri]


1.7.1 (2016-09-26)
------------------

- Support replacing portal-type- and mimetype-icons. [jone]

- Fix support for mimetype icons having long names. [jone, mbaechtold]


1.7.0 (2016-09-22)
------------------

- Fix multi-fill support of embed-resource mixin,
  introducing a new syntax and signature. [Kevin Bieri]


1.6.1 (2016-08-08)
------------------

- Reduce tab hover state
  The current hover state will be always the selected state
  [Kevin Bieri]


1.6.0 (2016-07-18)
------------------

- Move zindex system from plonetheme.blueberry
  [Kevin Bieri]


1.5.2 (2016-07-06)
------------------

- Use font family definitions from plonetheme.blueberry
  [Kevin Bieri]


1.5.1 (2016-06-23)
------------------

- Support selected state of tab-list on link (a tag) too.
  [mathias.leimgruber]

- ie-only slector now supports ms edge and IE11.
  [raphael-s]


1.5.0 (2016-05-26)
------------------

- Introduce spinner mixin.
  [Kevin Bieri]


1.4.0 (2016-05-24)
------------------

- Introduce ie-only mixin.
  [Kevin Bieri]


1.3.0 (2016-05-20)
------------------

- Extend list-group mixin interface to configure the hover color.
  [Kevin Bieri]

- Add new variable $color-content-background.
  [mathias.leimgruber]

- Introduce overlay mixin.
  [Kevin Bieri]

- Extend floatgrid with by-index directive.
  [Kevin Bieri]


1.2.0 (2016-03-30)
------------------

- Introduce horizontal definition list mixin.
  [Kevin Bieri]

- Responsive support for textareas.
  [Kevin Bieri]

- Introduce portrait mixin.
  [Kevin Bieri]

- Responsive support for input fields.
  [Kevin Bieri]

- Introduce active list-group item mixin.
  [Kevin Bieri]


1.1.0 (2016-03-03)
------------------

- Introduce progressbar.
  [Kevin Bieri]

- Register imaging scales as dynamic SCSS resource.
  [Kevin Bieri]

- Add label element mixins.
  [elioschmutz]

- Introduce inverted link colors.
  Apply blueberry color scheme.
  [Kevin Bieri]

- Update font-awesome to 4.5.0. [jone]

- Add `width-full` functional class of grid system for legacy support.
  [Kevin Bieri]

- Introduce floated grid system.
  [Kevin Bieri]

- Use more modular and adaptive mixins to provide a base to build themes upon it.
  Deprecated variables are stil avilable but will be removed in the next major.
  So use the new variables set for further styling.
  [Kevin Bieri]


1.0.3 (2015-11-17)
------------------

- Change collection / topic icons in order to avoid collision.
  [jone]

- Add open office mimetype icons.
  [jone]


1.0.2 (2015-10-28)
------------------

- Provide mimetype icons for solr flairs.
  [jone]


1.0.1 (2015-10-26)
------------------

- Remove duplicate icon in search results for files.
  [jone]


1.0.0 (2015-09-30)
------------------

- Initial implementation
  [jone]
            

Raw data

            {
    "_id": null,
    "home_page": "https://github.com/4teamwork/ftw.theming",
    "name": "ftw.theming",
    "maintainer": "",
    "docs_url": null,
    "requires_python": "",
    "maintainer_email": "",
    "keywords": "ftw theming",
    "author": "4teamwork AG",
    "author_email": "mailto:info@4teamwork.ch",
    "download_url": "https://files.pythonhosted.org/packages/3d/b4/eb7b008cc9f5c92b04be16618f7e5c0c111af3c05bde7ddc352bb725ae73/ftw.theming-2.1.2.tar.gz",
    "platform": "",
    "description": ".. contents:: Table of Contents\n\n\nInstallation\n============\n\nAdd the package as dependency to your setup.py:\n\n.. code:: python\n\n  setup(...\n        install_requires=[\n          ...\n          'ftw.theming',\n        ])\n\nor to your buildout configuration:\n\n.. code:: ini\n\n  [instance]\n  eggs += ftw.theming\n\nand rerun buildout.\n\n\nSCSS Registry\n=============\n\nThe SCSS registry is configured with ZCML and contains all SCSS resources from\n``ftw.theming``, addons, the theme and policy packages.\n\n\nInspecting the SCSS registry\n----------------------------\n\nThe ``@@theming-resources`` (on any navigation root) lists all resources.\n\n\nResource slots\n--------------\n\nThe registry allows to register resources to a list of fix slots.\nThese are the available slots, sorted by inclusion order:\n\n- ``top``\n- ``variables``\n- ``mixins``\n- ``ftw.theming``\n- ``addon``\n- ``theme``\n- ``policy``\n- ``bottom``\n\nAdding resources\n----------------\n\nAdding SCSS resources is done in the ZCML of a package.\nThe SCSS should always go into the same package where the styled templates are.\n\nRegistering a resource\n~~~~~~~~~~~~~~~~~~~~~~\n\n.. code:: xml\n\n    <configure\n        xmlns:theme=\"http://namespaces.zope.org/ftw.theming\"\n        xmlns:zcml=\"http://namespaces.zope.org/zcml\"\n        i18n_domain=\"ftw.tabbedview\">\n\n        <configure zcml:condition=\"installed ftw.theming\">\n          <include package=\"ftw.theming\" />\n\n          <theme:scss\n              file=\"resources/tabbed.scss\"\n              slot=\"addon\"\n              profile=\"ftw.tabbedview:default\"\n              />\n        </configure>\n\n    </configure>\n\n\nOptions for standalone ``theme:scss``\n~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n- ``file``: relative path to the SCSS file (required)\n- ``slot``: name of the slot (see slots section, default: ``addon``)\n- ``profile``: Generic Setup profile required to be installed (default:\n  no profile, e.g. ``my.package:default``)\n- ``for``: context interface (default: ``INavigationRoot``)\n- ``layer``: request layer interface (default: ``Interface``)\n- ``before``: name of the resource after which this resource should be ordered\n  (within the same slot).\n- ``after``: name of the resource before which this resource should be ordered\n  (within the same slot)\n\n\nRegistering multiple resources\n~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n.. code:: xml\n\n    <configure\n        xmlns:theme=\"http://namespaces.zope.org/ftw.theming\"\n        xmlns:zcml=\"http://namespaces.zope.org/zcml\"\n        i18n_domain=\"plonetheme.fancy\">\n\n        <include package=\"ftw.theming\" />\n\n        <theme:resources\n            slot=\"theme\"\n            profile=\"plonetheme.fancy:default\"\n            layer=\"plonetheme.fancy.interfaces.IFancyTheme\">\n\n            <theme:scss file=\"resources/foo.scss\" />\n            <theme:scss file=\"resources/bar.scss\" />\n\n        </theme:resources>\n\n    </configure>\n\nOptions for ``theme:resources``\n~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n- ``slot``: name of the slot (see slots section, default: ``addon``)\n- ``profile``: Generic Setup profile required to be installed (default:\n  no profile, e.g. ``my.package:default``)\n- ``for``: context interface (default: ``INavigationRoot``)\n- ``layer``: request layer interface (default: ``Interface``)\n\nOptions for ``theme:scss`` within ``theme:resources``\n~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n- ``file``: relative path to the SCSS file (required)\n- ``before``: name of the resource after which this resource should be ordered\n  (within the same slot).\n- ``after``: name of the resource before which this resource should be ordered\n  (within the same slot)\n\n\nResource names\n~~~~~~~~~~~~~~\n\nEach resource has an automatically generated name, which can be looked up in the\n``@@theming-resources``-view.\nThe resource has the format ``[package]:[relative path]``.\n\n\nResource Ordering\n-----------------\n\nThe SCSS resources are ordered when retrieved from the registry, so that the\norder is as consistent as possible.\n\nOrdering priority:\n\n1. the resource's ``slot`` (see the slot section below)\n1. the ``before`` and ``after`` options (topological graph sorting), within each slot.\n1. the ZCML load order of the resources\n\nBe aware that the ZCML load order is usally random.\n\n\nResource factories for dynamic resources\n----------------------------------------\n\nA resource factory is a callable (accepting context and request) which returns\na ``DynamicSCSSResource`` object.\nSince the callable instantiates the resource, it's content can be created dynamically.\n\n\n.. code:: xml\n\n    <configure\n        xmlns:theme=\"http://namespaces.zope.org/ftw.theming\"\n        xmlns:zcml=\"http://namespaces.zope.org/zcml\"\n        i18n_domain=\"plonetheme.fancy\">\n\n        <include package=\"ftw.theming\" />\n\n        <theme:scss_factory factory=\".dynamic_resource_factory\" />\n\n    </configure>\n\n\n.. code:: python\n\n    from ftw.theming.interfaces import ISCSSResourceFactory\n    from ftw.theming.resource import DynamicSCSSResource\n    from zope.interface import provider\n\n    @provider(ISCSSResourceFactory)\n    def dynamic_resource_factory(context, request):\n        return DynamicSCSSResource('dynamic.scss', slot='addon', source='$color: blue;',\n                                   cachekey='1')\n\n\nWhen generating the SCSS is expensive in time, you should subclass the\n``DynamicSCSSResource`` class and implement custom ``get_source`` and ``get_cachekey``\nmethods.\nThe ``get_cachekey`` should be very lightweight and cheap: it is called on every pageview.\nIt should return any string and only change the return value when the ``get_source`` result\nwill change.\n\n.. code:: python\n\n    from Products.CMFCore.utils import getToolByName\n    from ftw.theming.interfaces import ISCSSResourceFactory\n    from ftw.theming.resource import DynamicSCSSResource\n    from zope.annotation import IAnnotations\n    from zope.interface import provider\n\n\n    class CustomSCSSResource(DynamicSCSSResource):\n\n          def get_source(self, context, request):\n              return 'body { background-color: $primary-color; }'\n\n          def get_cachekey(self, context, request):\n              portal = getToolByName(context, 'portal_url').getPortalObject()\n              config = IAnnotations(portal).get('my-custom-config', {})\n              return config.get('last-change-timestamp', '1')\n\n    @provider(ISCSSResourceFactory)\n    def dynamic_resource_factory(context, request):\n        return CustomSCSSResource('my.package:custom.scss', slot='addon')\n\n\n\nControl Panel\n=============\n\nWhen ``ftw.theming`` is installed, a control panel is added, listing the\nSCSS resources and the default SCSS variables.\nThe controlpanel views are available on any navigation root.\n\n\nIcons\n=====\n\n``ftw.theming`` provides a portal type icon registry.\nThe default iconset is `font-awesome`_.\n\n\nDeclare icon for portal types\n-----------------------------\n\nPortal type icons are declared in the scss file of the addon package.\nIt is possible to support multiple icon sets by declaring icons for each iconset:\n\n.. code:: scss\n\n    @include portal-type-font-awesome-icon(repository-folder, leaf);\n    @include portal-type-icon(repository-folder, \"\\e616\", customicons);\n\nUsing those mixins does not generate any CSS yet, nor does it introduce dependency\nto those iconset.\nIt simply stores this information in a list to be processed later.\n\n\nSwitching iconset\n-----------------\n\nA theme or policy package may change the iconset.\nThe standard iconset is ``font-awesome``.\nChanging the iconset should be done in an SCSS file in the ``variables`` slot.\n\n.. code:: scss\n\n    $standard-iconset: customicons;\n\n\nCustom iconsets\n---------------\n\nThe default iconset is ``font-awesome``, which is automatically loaded and the\nnecessary CSS is generated when the ``$standard-iconset`` variable is ``font-awesome``.\n\nFor having custom iconsets an SCSS file must be registered in the ``bottom`` slot.\nThis is usually done by a theme or policy package.\n\nThe SCSS file should apply the necessary CSS only when the ``$standard-iconset`` is set\nto this iconset:\n\n.. code:: scss\n\n    @if $standard-iconset == customicons {\n\n      @font-face {\n        font-family: 'customicons';\n        src:url('#{$portal-url}/++theme++foo/fonts/customicons.eot?-fa99j8');\n        src:url('#{$portal-url}/++theme++foo/fonts/customicons.eot?#iefix-fa99j8') format('embedded-opentype'),\n        url('#{$portal-url}/++theme++foo/fonts/customicons.woff?-fa99j8') format('woff'),\n        url('#{$portal-url}/++theme++foo/fonts/customicons.ttf?-fa99j8') format('truetype'),\n        url('#{$portal-url}/++theme++foo/fonts/customicons.svg?-fa99j8#opengever') format('svg');\n        font-weight: normal;\n        font-style: normal;\n      }\n\n      .icons-on [class^=\"contenttype-\"],\n      .icons-on [class*=\" contenttype-\"] {\n        &:before {\n          font-family: 'customicons';\n          content: \"x\";\n          text-align:center;\n          position: absolute;\n        }\n      }\n\n      @each $type, $value in get-portal-type-icons-for-iconset(font-awesome) {\n        body.icons-on .contenttype-#{$type} {\n          &:before {\n            content: $value;\n          }\n        }\n      }\n    }\n\n\n\nFunctions\n=========\n\nembed-resource\n--------------\n\nThe ``embed-resource`` function embeds a resource (e.g. svg) as\nbase64 encoded url.\n\nExample:\n\n.. code:: scss\n\n    .something {\n        background: embed-resource(\"images/foo.svg\");\n    }\n\nThe function is able to fill colors in SVGs.\nThis can be done with either XPath or CSS selectors.\n\nSince lxml is used for filling the SVGs and SVGs are namespaced\nXML documents, the expressions must be namespaced as well.\nThis leads to problems when converting certain CSS selectors\nsince CSS does not support namespaces.\n\nExample:\n\n.. code:: scss\n\n    .foo {\n        background: embed-resource(\"soccer.svg\", $fill-css:('#pentagon', red));\n    }\n\n    .bar {\n        background: embed-resource(\"soccer.svg\", $fill-xpath:('//*[@id=\"black_stuff\"]/*[local-name()=\"g\"][1]', red));\n    }\n\n\nIt is also possible to fill multiple different colors at once by\nrepeating the ``selector, color`` pattern.\n\n.. code:: css\n\n    .foo {\n        background: embed-resource(\"soccer.svg\", $fill-css:('.black-stuff', black, '.red-stuff', red, '.white-stuff', white));\n    }\n\n\n\nSCSS Mixins\n===========\n\nUsing media queries Mixins\n--------------------------\n\n``ftw.theming`` provides mixins for most common media queries:\n\n- small (480px)\n- medium (800px)\n- large (1024)\n\nExample usage:\n\n.. code:: scss\n\n    #container {\n        width: 1600px;\n\n        @include screen-medium {\n            width:1000px;\n        }\n        @include screen-small {\n            width:500px;\n        }\n    }\n\nIncluding font faces\n--------------------\n\n.. code:: scss\n\n  @include font-face($name: 'VerdanaRegular', $path: '++resource++nidau.web/fonts/Verdana');\n\nThe file-extension for the ``$path`` argument is going to be concatenated automatically.\nBoth ``woff`` and ``woff2`` must be provided.\n\nThe mixin then produces the following css code:\n\n.. code:: css\n\n  @font-face {\n    font-family: 'VerdanaRegular';\n    font-style: normal;\n    font-weight: normal;\n    src: url(\"++resource++nidau.web/fonts/Verdana.woff2\") format(woff2),\n      url(\"++resource++nidau.web/fonts/Verdana.woff\") format(woff);\n  }\n\n  @font-face {\n    font-family: 'VerdanaBold';\n    font-style: normal;\n    font-weight: bold;\n    src: url(\"++resource++nidau.web/fonts/Verdana-Bold.woff2\") format(woff2),\n      url(\"++resource++nidau.web/fonts/Verdana-Bold.woff\") format(woff);\n  }\n\nLinks\n=====\n\n- Github: https://github.com/4teamwork/ftw.theming\n- Issues: https://github.com/4teamwork/ftw.theming/issues\n- Pypi: http://pypi.python.org/pypi/ftw.theming\n- Continuous integration: https://jenkins.4teamwork.ch/search?q=ftw.theming\n\nCopyright\n=========\n\nThis package is copyright by `4teamwork <http://www.4teamwork.ch/>`_.\n\n``ftw.theming`` is licensed under GNU General Public License, version 2.\n\n.. _font-awesome: http://fortawesome.github.io/Font-Awesome/\n\nChangelog\n=========\n\n2.1.2 (2020-11-25)\n------------------\n\n- Extend readme about how use embed-resource with multiple coulors [Nachtalb]\n- Make getting icon from brain/solr flare more robust. [mathias.leimgruber]\n\n\n2.1.1 (2020-01-14)\n------------------\n\n- Fix mimetype icon problem for Plone 4 when there is no icon defined. [jone]\n\n\n2.1.0 (2020-01-10)\n------------------\n\n- Improve mimetype icons support for better Plone 5 support. [jone]\n\n\n2.0.2 (2019-03-19)\n------------------\n\n- plone.browserlayer subscriber must be registered before our subscriber [Nachtalb]\n\n\n2.0.1 (2019-01-17)\n------------------\n\n- Fix UnicodeEncodeError error for content types names with unicode characters [Nachtalb]\n\n\n2.0.0 (2018-01-17)\n------------------\n\n- Deprecate legacy breakpoint mixins and variables. [Kevin Bieri]\n- Remove deprecated variables. [Kevin Bieri]\n\n\n1.11.0 (2017-12-19)\n-------------------\n\n- Avoid using freeze in test_cachekey_refreshes_when_navroot_changes\n  for plone 5.1, since we get a ReadConflictError. The value of the test does not change if we remove the freeze context manager. [mathias.leimgruber]\n\n- Implement Plone 5.1 compatibility [mathias.leimgruber]\n\n\n1.10.2 (2017-07-03)\n-------------------\n\n- Introduce webkit-only mixin. [Kevin Bieri]\n\n\n1.10.1 (2017-06-02)\n-------------------\n\n- Fix escaping of font type on fontface mixin. [Kevin Bieri]\n- Provide background option for tab-list mixin. [Kevin Bieri]\n- Introduce hyphenation mixin. [Bieri Kevin]\n\n\n1.10.0 (2017-03-20)\n-------------------\n\n- Add uninstall profile [raphael-s]\n\n- Make sure the default profile is installed when installing ftw.theming with\n  quickinstaller. [raphael-s]\n\n\n1.9.0 (2017-02-09)\n------------------\n\n- Update font-awesome to 4.7.0.\n  [elioschmutz]\n\n\n1.8.2 (2017-01-11)\n------------------\n\n- 1.8.1 was accidentally released from the wrong branch. Please use 1.8.2 instead.\n  [Kevin Bieri]\n\n- Use two columns for print layout.\n  [Kevin Bieri]\n\n- Avoid duplicate (mimetype) icons on \"Image\" types. [jone]\n\n- Introduce new mixins\n\n  - Introduce link-color helper\n  - Introduce font-face helper\n  - Introduce rem helper\n\n  [Kevin Bieri]\n\n\n1.8.0 (2016-10-06)\n------------------\n\n- Switch from \"private\" to \"public\" caching, since the CSS does\n  not contain any user specific data. [jone]\n\n- Fix caching for unpublished navigation roots by not using p.a.caching. [jone]\n\n- Introduce appearance helper\n  [Kevin Bieri]\n\n\n1.7.1 (2016-09-26)\n------------------\n\n- Support replacing portal-type- and mimetype-icons. [jone]\n\n- Fix support for mimetype icons having long names. [jone, mbaechtold]\n\n\n1.7.0 (2016-09-22)\n------------------\n\n- Fix multi-fill support of embed-resource mixin,\n  introducing a new syntax and signature. [Kevin Bieri]\n\n\n1.6.1 (2016-08-08)\n------------------\n\n- Reduce tab hover state\n  The current hover state will be always the selected state\n  [Kevin Bieri]\n\n\n1.6.0 (2016-07-18)\n------------------\n\n- Move zindex system from plonetheme.blueberry\n  [Kevin Bieri]\n\n\n1.5.2 (2016-07-06)\n------------------\n\n- Use font family definitions from plonetheme.blueberry\n  [Kevin Bieri]\n\n\n1.5.1 (2016-06-23)\n------------------\n\n- Support selected state of tab-list on link (a tag) too.\n  [mathias.leimgruber]\n\n- ie-only slector now supports ms edge and IE11.\n  [raphael-s]\n\n\n1.5.0 (2016-05-26)\n------------------\n\n- Introduce spinner mixin.\n  [Kevin Bieri]\n\n\n1.4.0 (2016-05-24)\n------------------\n\n- Introduce ie-only mixin.\n  [Kevin Bieri]\n\n\n1.3.0 (2016-05-20)\n------------------\n\n- Extend list-group mixin interface to configure the hover color.\n  [Kevin Bieri]\n\n- Add new variable $color-content-background.\n  [mathias.leimgruber]\n\n- Introduce overlay mixin.\n  [Kevin Bieri]\n\n- Extend floatgrid with by-index directive.\n  [Kevin Bieri]\n\n\n1.2.0 (2016-03-30)\n------------------\n\n- Introduce horizontal definition list mixin.\n  [Kevin Bieri]\n\n- Responsive support for textareas.\n  [Kevin Bieri]\n\n- Introduce portrait mixin.\n  [Kevin Bieri]\n\n- Responsive support for input fields.\n  [Kevin Bieri]\n\n- Introduce active list-group item mixin.\n  [Kevin Bieri]\n\n\n1.1.0 (2016-03-03)\n------------------\n\n- Introduce progressbar.\n  [Kevin Bieri]\n\n- Register imaging scales as dynamic SCSS resource.\n  [Kevin Bieri]\n\n- Add label element mixins.\n  [elioschmutz]\n\n- Introduce inverted link colors.\n  Apply blueberry color scheme.\n  [Kevin Bieri]\n\n- Update font-awesome to 4.5.0. [jone]\n\n- Add `width-full` functional class of grid system for legacy support.\n  [Kevin Bieri]\n\n- Introduce floated grid system.\n  [Kevin Bieri]\n\n- Use more modular and adaptive mixins to provide a base to build themes upon it.\n  Deprecated variables are stil avilable but will be removed in the next major.\n  So use the new variables set for further styling.\n  [Kevin Bieri]\n\n\n1.0.3 (2015-11-17)\n------------------\n\n- Change collection / topic icons in order to avoid collision.\n  [jone]\n\n- Add open office mimetype icons.\n  [jone]\n\n\n1.0.2 (2015-10-28)\n------------------\n\n- Provide mimetype icons for solr flairs.\n  [jone]\n\n\n1.0.1 (2015-10-26)\n------------------\n\n- Remove duplicate icon in search results for files.\n  [jone]\n\n\n1.0.0 (2015-09-30)\n------------------\n\n- Initial implementation\n  [jone]",
    "bugtrack_url": null,
    "license": "GPL2",
    "summary": "",
    "version": "2.1.2",
    "split_keywords": [
        "ftw",
        "theming"
    ],
    "urls": [
        {
            "comment_text": "",
            "digests": {
                "md5": "b30f118069396713d0844bfc7449c88e",
                "sha256": "fe8fa92bb7313a09299c6176362c8aa57076d36db155c3aa440e4234bfec196d"
            },
            "downloads": -1,
            "filename": "ftw.theming-2.1.2.tar.gz",
            "has_sig": false,
            "md5_digest": "b30f118069396713d0844bfc7449c88e",
            "packagetype": "sdist",
            "python_version": "source",
            "requires_python": null,
            "size": 727146,
            "upload_time": "2020-11-25T20:31:59",
            "upload_time_iso_8601": "2020-11-25T20:31:59.203815Z",
            "url": "https://files.pythonhosted.org/packages/3d/b4/eb7b008cc9f5c92b04be16618f7e5c0c111af3c05bde7ddc352bb725ae73/ftw.theming-2.1.2.tar.gz",
            "yanked": false,
            "yanked_reason": null
        }
    ],
    "upload_time": "2020-11-25 20:31:59",
    "github": true,
    "gitlab": false,
    "bitbucket": false,
    "github_user": null,
    "github_project": "4teamwork",
    "error": "Could not fetch GitHub repository",
    "lcname": "ftw.theming"
}
        
Elapsed time: 0.16390s