Diazo recipe make the Plone Mosaic editor compatible with Skel.io CSS grid.

mosaic-skel-rules.xml

    <!-- add skel.io grid classes to mosaic grid -->
    <replace css:content=".mosaic-grid-row">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /> row</xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>
    <replace css:content=".mosaic-width-full">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /> 12u</xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>
    <replace css:content=".mosaic-width-half">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /> 6u 12u(mobilep)</xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>
    <replace css:content=".mosaic-width-quarter">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /><xsl:text> 3u</xsl:text><xsl:if test="count(../child::*) = 4"> 6u(narrow) 12u(mobilep)</xsl:if><xsl:if test="count(../child::*) != 4"> 12u(narrow)</xsl:if></xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>
    <replace css:content=".mosaic-width-three-quarters">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /> 9u 12u(narrow)</xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>
    <replace css:content=".mosaic-width-third">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /> 4u 12u(mobile)</xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>
    <replace css:content=".mosaic-width-two-thirds">
        <xsl:copy>
            <xsl:copy-of select="@*" />
            <xsl:attribute name="class"><xsl:value-of select="./@class" /> 8u 12u(mobile)</xsl:attribute>
            <xsl:apply-templates />
        </xsl:copy>
    </replace>