From 573d684b709e11e0e29f0af775e21a9ad4fbe590 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Loi=CC=88c=20Goyet?= Date: Wed, 5 Apr 2017 14:19:12 +0200 Subject: [PATCH] ribbons statements and theme --- dest/css/ribbons.css | 134 +++++++++++++++++++++++- dest/css/ribbons.min.css | 2 +- src/scss/ribbons.scss | 79 ++++++++++++-- src/scss/utils/_get-hypotenuse.scss | 28 +++++ src/scss/utils/_mixin-example.scss | 5 - src/scss/utils/_mixin-ribbons-band.scss | 26 +++++ src/scss/utils/_mixin-ribbons.scss | 19 ++++ src/scss/utils/_trowel-variables.scss | 24 +++-- src/twig/ribbon.html.twig | 13 ++- test/src/index.html.twig | 12 ++- 10 files changed, 313 insertions(+), 29 deletions(-) create mode 100644 src/scss/utils/_get-hypotenuse.scss delete mode 100644 src/scss/utils/_mixin-example.scss create mode 100644 src/scss/utils/_mixin-ribbons-band.scss create mode 100644 src/scss/utils/_mixin-ribbons.scss diff --git a/dest/css/ribbons.css b/dest/css/ribbons.css index 43dbadd..1ed58a7 100644 --- a/dest/css/ribbons.css +++ b/dest/css/ribbons.css @@ -2,6 +2,136 @@ * Ribbons */ .ribbon { - font-size: 1rem; } + font-size: 1rem; + color: white; + position: relative; + width: 7.5em; + height: 7.5em; + overflow: hidden; + pointer-events: none; + display: block; } -/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zY3NzL3JpYmJvbnMuc2NzcyIsImJvd2VyX2NvbXBvbmVudHMvdHJvd2VsLWNvcmUvc3JjL3Ryb3dlbC1hcGkuc2NzcyIsImJvd2VyX2NvbXBvbmVudHMvdHJvd2VsLWNvcmUvc3JjL2NvcmUvX3N0YXRlbWVudC5zY3NzIiwiLi4vLi4vc3JjL3Njc3MvdXRpbHMvX3Ryb3dlbC12YXJpYWJsZXMuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQ3NDTztJQ3dDRixnQkNoRmlCLEVGNEN0QiIsImZpbGUiOiJzdHlsZS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIFJpYmJvbnNcbiAqL1xuXG5AaW1wb3J0ICd1dGlscy9lbmFibGVzJztcbkBpbXBvcnQgJ3V0aWxzL3N5bnRheGVzJztcbkBpbXBvcnQgJ3V0aWxzL3Ryb3dlbC12YXJpYWJsZXMnO1xuQGltcG9ydCAndXRpbHMvbWl4aW4tZXhhbXBsZSc7XG5cbiRyaWJib24tLXNlbGVjdG9yOiBzZWxlY3RvcihuZXcgJ3JpYmJvbicgd2l0aCAkcmliYm9ucy0tc3ludGF4KTtcblxuQGlmICRyaWJib25zLS1lbmFibGVkIHtcbiAgQGluY2x1ZGUgc3RhdGVtZW50KCRyaWJib24tLXNlbGVjdG9yLCAoXG4gICAgKCdAaW5jbHVkZSByaWJib25zLS1taXhpbi1leGFtcGxlJywgbnVsbCksXG4gICAgKCdmb250LXNpemUnLCAkcmliYm9ucy0tZm9udC1zaXplKSxcbiAgICAoJ2ZvbnQtZmFtaWx5JywgJHJpYmJvbnMtLWZvbnQtZmFtaWx5KSxcbiAgICAoJ2ZvbnQtd2VpZ2h0JywgJHJpYmJvbnMtLWZvbnQtd2VpZ2h0KSxcbiAgICAoJ3RleHQtdHJhbnNmb3JtJywgJHJpYmJvbnMtLXRleHQtdHJhbnNmb3JtKSxcbiAgICAoJ2xldHRlci1zcGFjaW5nJywgJHJpYmJvbnMtLWxldHRlci1zcGFjaW5nKSxcbiAgICAoJ2xpbmUtaGVpZ2h0JywgJHJpYmJvbnMtLWxpbmUtaGVpZ2h0KSxcbiAgICAoJ3RleHQtYWxpZ24nLCAkcmliYm9ucy0tdGV4dC1hbGlnbiksXG4gICAgKCd0ZXh0LWRlY29yYXRpb24nLCAkcmliYm9ucy0tdGV4dC1kZWNvcmF0aW9uKSxcbiAgICAoJ21hcmdpbicsICRyaWJib25zLS1tYXJnaW4pLFxuICAgICgnYm9yZGVyLXdpZHRoJywgJHJpYmJvbnMtLWJvcmRlci13aWR0aCksXG4gICAgKCdib3JkZXItc3R5bGUnLCAkcmliYm9ucy0tYm9yZGVyLXN0eWxlKSxcbiAgICAoJ2JvcmRlci1jb2xvcicsICRyaWJib25zLS1ib3JkZXItY29sb3IpLFxuICAgICgnYm9yZGVyLXJhZGl1cycsICRyaWJib25zLS1ib3JkZXItcmFkaXVzKSxcbiAgICAoJ2NvbG9yJywgJHJpYmJvbnMtLWNvbG9yKSxcbiAgICAoJ2JveC1zaGFkb3cnLCAkcmliYm9ucy0tYm94LXNoYWRvdyksXG4gICAgKCdiYWNrZ3JvdW5kJywgJHJpYmJvbnMtLWJhY2tncm91bmQpLFxuICAgICgnYmFja2dyb3VuZC1jb2xvcicsICRyaWJib25zLS1iYWNrZ3JvdW5kLWNvbG9yKSxcbiAgKSk7XG59XG4iLCJAaW1wb3J0ICdjb3JlL3N0YXRlbWVudCc7XG5AaW1wb3J0ICdjb3JlL2JyZWFrcG9pbnRzJztcbkBpbXBvcnQgJ2NvcmUvc2VsZWN0b3InO1xuQGltcG9ydCAnY29yZS92YWx1ZSc7XG5cbi8vIHN0YXRlbWVudFxuQG1peGluIHN0YXRlbWVudCgkc2VsZWN0b3IsICRibG9jaywgJGZsYWc6IG51bGwpIHtcbiAgJGJsb2NrOiBibG9jay1zb3J0ZWQoJGJsb2NrKTtcbiAgQGluY2x1ZGUgcHJpbnQtc3RhdGVtZW50KCRzZWxlY3RvciwgJGJsb2NrLCAkZmxhZyk7XG59XG5cblxuLy8gbWVkaWEtcXVlcnlcbkBtaXhpbiBtZWRpYS1xdWVyeSAoJGZvcmssICRwaGlsb3NvcGh5OiAnYW5kLW1vcmUnKSB7XG4gICRicmVha3BvaW50cy1jb25maWc6IG1hcC1nZXQoJHRyb3dlbC1jb25maWcsICdicmVha3BvaW50cycpO1xuXG4gIEBpZiBub3QgJGJyZWFrcG9pbnRzLWNvbmZpZyBvciBub3QgJGZvcmsge1xuICAgIEBjb250ZW50O1xuICB9IEBlbHNlIHtcbiAgICAkYnJlYWtwb2ludHM6IGJyZWFrcG9pbnRzLS1jb25zdHJ1Y3RvcigkYnJlYWtwb2ludHMtY29uZmlnKTtcblxuICAgIEBpZiBub3QgYnJlYWtwb2ludC0tZ2V0LWZvcmstcXVlcnkoJGJyZWFrcG9pbnRzLCAkZm9yaywgJHBoaWxvc29waHkpIHtcbiAgICAgIEBjb250ZW50O1xuICAgIH0gQGVsc2Uge1xuICAgICAgQG1lZGlhICN7YnJlYWtwb2ludC0tZ2V0LWZvcmstcXVlcnkoJGJyZWFrcG9pbnRzLCAkZm9yaywgJHBoaWxvc29waHkpfSB7XG4gICAgICAgIEBjb250ZW50O1xuICAgICAgfVxuICAgIH1cbiAgfVxufVxuXG5cbi8vIHNlbGVjdG9yXG5AZnVuY3Rpb24gcHJpbnQtc2VsZWN0b3IoJHNlbGVjdG9yKSB7XG4gIEByZXR1cm4gc2VsZWN0b3ItLWdldC1wcmludC1wYXJlbnRzKCRzZWxlY3RvcikgKyBzZWxlY3Rvci0tZ2V0LXByaW50KCRzZWxlY3Rvcik7XG59XG5cbkBtaXhpbiBzZWxlY3Rvcigkc2VsZWN0b3IpIHtcbiAgJGJyZWFrcG9pbnQtZm9yazogc2VsZWN0b3ItLWdldC1icmVha3BvaW50KCRzZWxlY3Rvcik7XG5cbiAgQGF0LXJvb3QgI3twcmludC1zZWxlY3Rvcigkc2VsZWN0b3IpfSB7XG4gICAgQGluY2x1ZGUgbWVkaWEtcXVlcnkoJGJyZWFrcG9pbnQtZm9yaykge1xuICAgICAgQGNvbnRlbnQ7XG4gICAgfVxuICB9XG59XG5cbkBmdW5jdGlvbiBzZWxlY3RvcigkYXJncykge1xuICAkYXJncy1sZW5ndGg6IGxlbmd0aCgkYXJncyk7XG4gICRkaXJlY3RpdmU6IG50aCgkYXJncywgMSk7XG5cbiAgQGlmICRkaXJlY3RpdmUgPT0gJ25ldycge1xuICAgIEBpZiBub3QgKCRhcmdzLWxlbmd0aCA9PSAyIG9yICRhcmdzLWxlbmd0aCA9PSA0KSB7XG4gICAgICBAZXJyb3IgJ3NlbGVjdG9yKCkgZnVuY3Rpb24gd2l0aCBgbmV3YCBhcyBmaXJzdCBhcmd1bWVudCBtdXN0IGhhdmUgMiBvciA0IGFyZ3VtZW50cyc7XG4gICAgfVxuXG4gICAgJGJsb2NrOiBudGgoJGFyZ3MsIDIpO1xuICAgICRzeW50YXg6IGlmKCRhcmdzLWxlbmd0aCA+PSA0LCBudGgoJGFyZ3MsIDQpLCBudWxsKTtcbiAgICBAcmV0dXJuIHNlbGVjdG9yLS1jb25zdHJ1Y3RvcihudGgoJGFyZ3MsIDIpLCAkc3ludGF4KTtcbiAgfVxuXG4gIEBpZiBub3QgKCRhcmdzLWxlbmd0aCA9PSA0IG9yICRhcmdzLWxlbmd0aCA9PSA2KSB7XG4gICAgQGVycm9yICdzZWxlY3RvcigpIGZ1bmN0aW9uIHdpdGggYHNldGAgb3IgYGFwcGVuZGAgYXMgZmlyc3QgYXJndW1lbnQgbXVzdCBoYXZlIDQgb3IgNiBhcmd1bWVudHMnO1xuICB9XG5cbiAgJHNlbGVjdG9yOiBudGgoJGFyZ3MsIDIpO1xuICAkcHJvcGVydHk6IG50aCgkYXJncywgMyk7XG4gICRwYXJhbS0xOiBudGgoJGFyZ3MsIDQpO1xuICAkcGFyYW0tMjogaWYoJGFyZ3MtbGVuZ3RoID49IDYsIG50aCgkYXJncywgNiksIG51bGwpO1xuXG4gIEBpZiAkcGFyYW0tMiB7XG4gICAgQHJldHVybiBjYWxsKCdzZWxlY3Rvci0tI3skZGlyZWN0aXZlfS0jeyRwcm9wZXJ0eX0nLCAkc2VsZWN0b3IsICRwYXJhbS0xLCAkcGFyYW0tMik7XG4gIH1cblxuICBAcmV0dXJuIGNhbGwoJ3NlbGVjdG9yLS0jeyRkaXJlY3RpdmV9LSN7JHByb3BlcnR5fScsICRzZWxlY3RvciwgJHBhcmFtLTEpO1xufVxuXG5cbi8vIHZhbHVlXG5cbkBmdW5jdGlvbiB2YWx1ZSgkdmFsdWUsICRmbGFnczogbnVsbCkge1xuICBAaWYgdHlwZS1vZigkdmFsdWUpICE9ICdtYXAnIHtcbiAgICBAcmV0dXJuICR2YWx1ZTtcbiAgfVxuXG4gIEBpZiAkZmxhZ3MgPT0gbnVsbCB7XG4gICAgQHJldHVybiBtYXAtZ2V0KCR2YWx1ZSwgJ2RlZmF1bHQnKTtcbiAgfVxuXG4gICR2YWx1ZXMtY29ycmVzcG9uZGFudDogdmFsdWVzLWNvcnJlc3BvbmRhbnQoJHZhbHVlLCAkZmxhZ3MpO1xuXG4gIEBpZiBsZW5ndGgoJHZhbHVlcy1jb3JyZXNwb25kYW50KSA9PSAwIHtcbiAgICBAcmV0dXJuIG1hcC1nZXQoJHZhbHVlLCAnZGVmYXVsdCcpO1xuICB9XG5cbiAgJHZhbHVlOiBudGgoJHZhbHVlcy1jb3JyZXNwb25kYW50LCAxKTtcbiAgQGVhY2ggJHZhbHVlLWNvcnJlc3BvbmRhbnQgaW4gJHZhbHVlcy1jb3JyZXNwb25kYW50IHtcbiAgICBAaWYgdmFsdWUtY29ycmVzcG9uZGFudC0tZ2V0LWZsYWdzLWxlbmd0aCgkdmFsdWUtY29ycmVzcG9uZGFudCkgPj0gdmFsdWUtY29ycmVzcG9uZGFudC0tZ2V0LWZsYWdzLWxlbmd0aCgkdmFsdWUpIHtcbiAgICAgICR2YWx1ZTogJHZhbHVlLWNvcnJlc3BvbmRhbnQ7XG4gICAgfVxuICB9XG5cbiAgQHJldHVybiB2YWx1ZS1jb3JyZXNwb25kYW50LS1nZXQtdmFsdWUoJHZhbHVlKTtcbn1cbiIsIkBpbXBvcnQgJy4uL2V4dGVuc2lvbnMvc29ydCc7XG5AaW1wb3J0ICcuLi9leHRlbnNpb25zL21hcCc7XG5AaW1wb3J0ICdzZWxlY3Rvcic7XG5cbkBmdW5jdGlvbiBkZWNsYXJhdGlvbigkYmxvY2ssICRwcm9wZXJ0eSwgJHZhbHVlLCAkZmxhZ3M6ICgpKSB7XG4gIEBpZiB0eXBlLW9mKCR2YWx1ZSkgPT0gJ21hcCcge1xuICAgIEBlYWNoICRmbGFnLCAkdmFsdWUgaW4gJHZhbHVlIHtcbiAgICAgICRuZXctZmxhZ3M6ICRmbGFncztcblxuICAgICAgQGlmIGluZGV4KCgnOicsICc8JywgJ0AnLCAnLScsICd+JywgJ1snKSwgc3RyLXNsaWNlKCRmbGFnLCAwLCAxKSkge1xuICAgICAgICAkbmV3LWZsYWdzOiBhcHBlbmQoJG5ldy1mbGFncywgJGZsYWcpO1xuICAgICAgICAkbmV3LWZsYWdzOiBzb3J0KCRuZXctZmxhZ3MpO1xuICAgICAgfVxuXG4gICAgICAkYmxvY2s6IGRlY2xhcmF0aW9uKCRibG9jaywgJHByb3BlcnR5LCAkdmFsdWUsICRuZXctZmxhZ3MpO1xuICAgIH1cbiAgfSBAZWxzZSB7XG4gICAgQGlmIHN0ci1zbGljZSgkcHJvcGVydHksIDEsIDkpID09ICdAaW5jbHVkZSAnIHtcbiAgICAgICRtaXhpbjogc3RyLXNsaWNlKCRwcm9wZXJ0eSwgMTApO1xuICAgICAgJG1peGluLXJlc3VsdDogY2FsbCgkbWl4aW4sICR2YWx1ZSwgJGZsYWdzKTtcbiAgICAgICRibG9jazogYmxvY2stc29ydGVkKCRtaXhpbi1yZXN1bHQsICRibG9jayk7XG4gICAgICBAcmV0dXJuICRibG9jaztcbiAgICB9IEBlbHNlIHtcbiAgICAgIEBpZiBsZW5ndGgoJGZsYWdzKSA+PSAxIHtcbiAgICAgICAgJHByZXZpb3VzLWJsb2NrOiBtYXAtZ2V0LWRlZXAoJGJsb2NrLCBhcHBlbmQoJGZsYWdzLCAnZGVmYXVsdCcpKTtcblxuICAgICAgICBAaWYgJHByZXZpb3VzLWJsb2NrIHtcbiAgICAgICAgICAkcHJldmlvdXMtYmxvY2s6IG1hcC1zbWFydC1tZXJnZSgkcHJldmlvdXMtYmxvY2ssICgkcHJvcGVydHk6ICR2YWx1ZSkpO1xuICAgICAgICAgICRibG9jazogbWFwLXNldC1kZWVwKCRibG9jaywgYXBwZW5kKCRmbGFncywgJ2RlZmF1bHQnKSwgJHByZXZpb3VzLWJsb2NrKTtcbiAgICAgICAgfSBAZWxzZSB7XG4gICAgICAgICAgJGJsb2NrOiBtYXAtc2V0LWRlZXAoJGJsb2NrLCBhcHBlbmQoJGZsYWdzLCAnZGVmYXVsdCcpLCAoJHByb3BlcnR5OiAkdmFsdWUpKTtcbiAgICAgICAgfVxuICAgICAgfSBAZWxzZSB7XG4gICAgICAgICRibG9jazogbWFwLXNtYXJ0LW1lcmdlKCRibG9jaywgKCdkZWZhdWx0JzogKCRwcm9wZXJ0eTogJHZhbHVlKSkpO1xuICAgICAgfVxuICAgIH1cbiAgfVxuXG4gIEByZXR1cm4gJGJsb2NrO1xufVxuXG5AZnVuY3Rpb24gYmxvY2stc29ydGVkKCRkZWNsYXJhdGlvbnMsICRibG9jazogKCkpIHtcbiAgQGVhY2ggJGRlY2xhcmF0aW9uIGluICRkZWNsYXJhdGlvbnMge1xuICAgICRwcm9wZXJ0eTogbnRoKCRkZWNsYXJhdGlvbiwgMSk7XG4gICAgJHZhbHVlOiBudGgoJGRlY2xhcmF0aW9uLCAyKTtcbiAgICAkZmxhZ3M6IGlmKGxlbmd0aCgkZGVjbGFyYXRpb24pID49IDMsIG50aCgkZGVjbGFyYXRpb24sIDMpLCAoKSk7XG5cbiAgICAkYmxvY2s6IGRlY2xhcmF0aW9uKCRibG9jaywgJHByb3BlcnR5LCAkdmFsdWUsICRmbGFncyk7XG4gIH1cblxuICBAcmV0dXJuICRibG9jaztcbn1cblxuQG1peGluIHByaW50LXN0YXRlbWVudCgkc2VsZWN0b3IsICRibG9jaywgJGZsYWcpIHtcbiAgQGlmICRmbGFnICE9ICdkZWZhdWx0JyB7XG4gICAgQGVhY2ggJGZsYWcsICRibG9jayBpbiAkYmxvY2sge1xuICAgICAgJG5ldy1zZWxlY3RvcjogJHNlbGVjdG9yO1xuXG4gICAgICAkZmxhZy10eXBlOiBzdHItc2xpY2UoJGZsYWcsIDAsIDEpO1xuICAgICAgJGZsYWctbmFtZTogc3RyLXNsaWNlKCRmbGFnLCAyKTtcblxuICAgICAgQGlmICRmbGFnLXR5cGUgPT0gJzonIHtcbiAgICAgICAgJG5ldy1zZWxlY3Rvcjogc2VsZWN0b3ItLWFwcGVuZC1wc2V1ZG8tY2xhc3MoJG5ldy1zZWxlY3RvciwgJGZsYWctbmFtZSk7XG4gICAgICB9IEBlbHNlaWYgJGZsYWctdHlwZSA9PSAnPCcge1xuICAgICAgICAkbmV3LXNlbGVjdG9yOiBzZWxlY3Rvci0tc2V0LXRhZygkbmV3LXNlbGVjdG9yLCAkZmxhZy1uYW1lKTtcbiAgICAgIH0gQGVsc2VpZiAkZmxhZy10eXBlID09ICdAJyB7XG4gICAgICAgICRuZXctc2VsZWN0b3I6IHNlbGVjdG9yLS1zZXQtYnJlYWtwb2ludCgkbmV3LXNlbGVjdG9yLCAkZmxhZy1uYW1lKTtcbiAgICAgIH0gQGVsc2VpZiAkZmxhZy10eXBlID09ICctJyB7XG4gICAgICAgICRuZXctc2VsZWN0b3I6IHNlbGVjdG9yLS1hcHBlbmQtbW9kaWZpZXIoJG5ldy1zZWxlY3RvciwgJGZsYWctbmFtZSk7XG4gICAgICB9IEBlbHNlaWYgJGZsYWctdHlwZSA9PSAnficge1xuICAgICAgICAkbmV3LXNlbGVjdG9yOiBzZWxlY3Rvci0tYXBwZW5kLW1vZGlmaWVyLWVsZW1lbnQoJG5ldy1zZWxlY3RvciwgJGZsYWctbmFtZSk7XG4gICAgICB9IEBlbHNlaWYgJGZsYWctdHlwZSA9PSAnWycge1xuICAgICAgICAkbmV3LXNlbGVjdG9yOiBzZWxlY3Rvci0tYXBwZW5kLWF0dHJpYnV0ZSgkbmV3LXNlbGVjdG9yLCAkZmxhZy1uYW1lKTtcbiAgICAgIH1cblxuICAgICAgQGluY2x1ZGUgcHJpbnQtc3RhdGVtZW50KCRuZXctc2VsZWN0b3IsICRibG9jaywgJGZsYWcpO1xuICAgIH1cbiAgfSBAZWxzZSB7XG4gICAgQGluY2x1ZGUgc2VsZWN0b3IoJHNlbGVjdG9yKSB7XG4gICAgICBAZWFjaCAkcHJvcGVydHksICR2YWx1ZSBpbiAkYmxvY2sge1xuICAgICAgICAjeyRwcm9wZXJ0eX06ICR2YWx1ZTtcbiAgICAgIH1cbiAgICB9XG4gIH1cbn1cbiIsIiRyaWJib25zLS1mb250LXNpemU6IDFyZW0gIWRlZmF1bHQ7XG4kcmliYm9ucy0tZm9udC1mYW1pbHk6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tZm9udC13ZWlnaHQ6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tdGV4dC10cmFuc2Zvcm06IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tbGV0dGVyLXNwYWNpbmc6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tbGluZS1oZWlnaHQ6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tdGV4dC1hbGlnbjogbnVsbCAhZGVmYXVsdDtcbiRyaWJib25zLS10ZXh0LWRlY29yYXRpb246IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tbWFyZ2luOiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWJvcmRlci13aWR0aDogbnVsbCAhZGVmYXVsdDtcbiRyaWJib25zLS1ib3JkZXItc3R5bGU6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tYm9yZGVyLWNvbG9yOiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWJvcmRlci1yYWRpdXM6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tY29sb3I6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tYm94LXNoYWRvdzogbnVsbCAhZGVmYXVsdDtcbiRyaWJib25zLS1iYWNrZ3JvdW5kOiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWJhY2tncm91bmQtY29sb3I6IG51bGwgIWRlZmF1bHQ7XG4iXX0= */ +.ribbon__band { + right: 100%; + left: auto; + margin-right: -3.75em; + margin-left: 0; + -webkit-transform-origin: top right; + transform-origin: top right; + -webkit-transform: rotate(-45deg); + transform: rotate(-45deg); + width: 5.303301em; + background-color: #9b9b9d; + position: absolute; + top: 0; + height: 1.875em; + text-align: center; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + display: block; } + +.ribbon--right .ribbon__band { + left: 100%; + right: auto; + margin-left: -3.75em; + margin-right: 0; + -webkit-transform-origin: top left; + transform-origin: top left; + -webkit-transform: rotate(45deg); + transform: rotate(45deg); } + +.ribbon--primary .ribbon__band { + background-color: #1f0d33; } + +.ribbon--success .ribbon__band { + background-color: #37d3bd; } + +.ribbon--warning .ribbon__band { + background-color: #ffb000; } + +.ribbon--danger .ribbon__band { + background-color: #fd4164; } + +.ribbon__band::before { + content: ""; + display: block; + position: absolute; + top: 0; + height: 100%; + width: 10000px; + margin: 0 -1px; + background-color: #9b9b9d; + left: 100%; } + +.ribbon--primary .ribbon__band::before { + background-color: #1f0d33; } + +.ribbon--success .ribbon__band::before { + background-color: #37d3bd; } + +.ribbon--warning .ribbon__band::before { + background-color: #ffb000; } + +.ribbon--danger .ribbon__band::before { + background-color: #fd4164; } + +.ribbon__band::after { + content: ""; + display: block; + position: absolute; + top: 0; + height: 100%; + width: 10000px; + margin: 0 -1px; + background-color: #9b9b9d; + right: 100%; } + +.ribbon--primary .ribbon__band::after { + background-color: #1f0d33; } + +.ribbon--success .ribbon__band::after { + background-color: #37d3bd; } + +.ribbon--warning .ribbon__band::after { + background-color: #ffb000; } + +.ribbon--danger .ribbon__band::after { + background-color: #fd4164; } + +.ribbon__content { + position: absolute; + top: 50%; + left: 50%; + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); + z-index: 1; + white-space: nowrap; + overflow: hidden; + display: block; } + +.ribbon__content::before { + content: ""; + background-color: #9b9b9d; + position: absolute; + top: -1px; + bottom: -1px; + left: -1px; + right: -1px; + z-index: -1; + overflow: hidden; } + +.ribbon--primary .ribbon__content::before { + background-color: #1f0d33; } + +.ribbon--success .ribbon__content::before { + background-color: #37d3bd; } + +.ribbon--warning .ribbon__content::before { + background-color: #ffb000; } + +.ribbon--danger .ribbon__content::before { + background-color: #fd4164; } + +/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zY3NzL3JpYmJvbnMuc2NzcyIsImJvd2VyX2NvbXBvbmVudHMvdHJvd2VsLWNvcmUvc3JjL3Ryb3dlbC1hcGkuc2NzcyIsImJvd2VyX2NvbXBvbmVudHMvdHJvd2VsLWNvcmUvc3JjL2NvcmUvX3N0YXRlbWVudC5zY3NzIiwiYm93ZXJfY29tcG9uZW50cy90cm93ZWwtY29yZS9zcmMvdHJvd2VsLXRoZW1lLnNjc3MiLCIuLi8uLi9zcmMvc2Nzcy91dGlscy9fdHJvd2VsLXZhcmlhYmxlcy5zY3NzIiwiLi4vLi4vc3JjL3Njc3MvdXRpbHMvX21peGluLXJpYmJvbnMuc2NzcyIsIi4uLy4uL3NyYy9zY3NzL3V0aWxzL19nZXQtaHlwb3RlbnVzZS5zY3NzIiwiLi4vLi4vc3JjL3Njc3MvdXRpbHMvX21peGluLXJpYmJvbnMtYmFuZC5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FDc0NPO0lDd0NGLGdCQ2hFTTtJRGdFTixhRXhFMkI7SUZ3RTNCLG1CRnREaUI7SUVzRGpCLGFFOURhO0lGOERiLGNFOURhO0lGOERiLGlCRm5EZTtJRW1EZixxQkZsRG1CO0lFa0RuQixlRmpEYSxFQ2FsQjs7QUFKTztJQ3dDRixZR3pFdUI7SUh5RXZCLFdHeEVpQjtJSHdFakIsc0JHdkVtRTtJSHVFbkUsZUd0RTBCO0lIc0UxQixvQ0dyRTRDO1lIcUU1Qyw0QkdyRTRDO0lIcUU1QyxrQ0dwRTZDO1lIb0U3QywwQkdwRTZDO0lIb0U3QyxrQkl6RCtEO0lKeUQvRCwwQkN6RTRCO0lEeUU1QixtQkZ2Q2lCO0lFdUNqQixPRnRDSztJRXNDTCxnQkV4RGlCO0lGd0RqQixtQkZwQ2lCO0lFb0NqQiwwQkZuQ2dCO09FbUNoQix1QkZuQ2dCO1FFbUNoQixzQkZuQ2dCO1lFbUNoQixrQkZuQ2dCO0lFbUNoQixlRmxDYSxFQ0ZsQjs7QUFKTztJQ3dDRixXR3pFdUI7SUh5RXZCLFlHeEVpQjtJSHdFakIscUJHdkVtRTtJSHVFbkUsZ0JHdEUwQjtJSHNFMUIsbUNHckU0QztZSHFFNUMsMkJHckU0QztJSHFFNUMsaUNHcEU2QztZSG9FN0MseUJHcEU2QyxFSmdDbEQ7O0FBSk87SUN3Q0YsMEJDeEVxQixFRm9DMUI7O0FBSk87SUN3Q0YsMEJDdkV1QixFRm1DNUI7O0FBSk87SUN3Q0YsMEJDdEVzQixFRmtDM0I7O0FBSk87SUN3Q0YsMEJDckVzQixFRmlDM0I7O0FBSk87SUN3Q0YsWUsvRFU7SUwrRFYsZUs5RGE7SUw4RGIsbUJLN0RpQjtJTDZEakIsT0s1REs7SUw0REwsYUszRFc7SUwyRFgsZUsxRGE7SUwwRGIsZUt6RGE7SUx5RGIsMEJDekU0QjtJRHlFNUIsV0Z6QlMsRUNYZDs7QUFKTztJQ3dDRiwwQkN4RXFCLEVGb0MxQjs7QUFKTztJQ3dDRiwwQkN2RXVCLEVGbUM1Qjs7QUFKTztJQ3dDRiwwQkN0RXNCLEVGa0MzQjs7QUFKTztJQ3dDRiwwQkNyRXNCLEVGaUMzQjs7QUFKTztJQ3dDRixZSy9EVTtJTCtEVixlSzlEYTtJTDhEYixtQks3RGlCO0lMNkRqQixPSzVESztJTDRETCxhSzNEVztJTDJEWCxlSzFEYTtJTDBEYixlS3pEYTtJTHlEYiwwQkN6RTRCO0lEeUU1QixZRmhCVSxFQ3BCZjs7QUFKTztJQ3dDRiwwQkN4RXFCLEVGb0MxQjs7QUFKTztJQ3dDRiwwQkN2RXVCLEVGbUM1Qjs7QUFKTztJQ3dDRiwwQkN0RXNCLEVGa0MzQjs7QUFKTztJQ3dDRiwwQkNyRXNCLEVGaUMzQjs7QUFKTztJQ3dDRixtQkZUaUI7SUVTakIsU0ZSTztJRVFQLFVGUFE7SUVPUix5Q0ZOK0I7WUVNL0IsaUNGTitCO0lFTS9CLFdGTFM7SUVLVCxvQkZKa0I7SUVJbEIsaUJGSGU7SUVHZixlRkZhLEVDbENsQjs7QUFKTztJQ3dDRixZRktVO0lFTFYsMEJDekU0QjtJRHlFNUIsbUJGT2lCO0lFUGpCLFVGUVE7SUVSUixhRlNXO0lFVFgsV0ZVUztJRVZULFlGV1U7SUVYVixZRllVO0lFWlYsaUJGYWUsRUNqRHBCOztBQUpPO0lDd0NGLDBCQ3hFcUIsRUZvQzFCOztBQUpPO0lDd0NGLDBCQ3ZFdUIsRUZtQzVCOztBQUpPO0lDd0NGLDBCQ3RFc0IsRUZrQzNCOztBQUpPO0lDd0NGLDBCQ3JFc0IsRUZpQzNCIiwiZmlsZSI6InN0eWxlLmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogUmliYm9uc1xuICovXG5cbkBpbXBvcnQgJ3V0aWxzL2VuYWJsZXMnO1xuQGltcG9ydCAndXRpbHMvc3ludGF4ZXMnO1xuQGltcG9ydCAndXRpbHMvdHJvd2VsLXZhcmlhYmxlcyc7XG5AaW1wb3J0ICd1dGlscy9taXhpbi1yaWJib25zJztcbkBpbXBvcnQgJ3V0aWxzL21peGluLXJpYmJvbnMtYmFuZCc7XG5cblxuQGlmICRyaWJib25zLS1lbmFibGVkIHtcbiAgJHJpYmJvbi0tc2VsZWN0b3I6IHNlbGVjdG9yKG5ldyAncmliYm9uJyB3aXRoICRyaWJib25zLS1zeW50YXgpO1xuXG4gIEBpbmNsdWRlIHN0YXRlbWVudCgkcmliYm9uLS1zZWxlY3RvciwgKFxuICAgICgnZm9udC1zaXplJywgJHJpYmJvbnMtLWZvbnQtc2l6ZSksXG4gICAgKCdmb250LWZhbWlseScsICRyaWJib25zLS1mb250LWZhbWlseSksXG4gICAgKCdmb250LXdlaWdodCcsICRyaWJib25zLS1mb250LXdlaWdodCksXG4gICAgKCd0ZXh0LXRyYW5zZm9ybScsICRyaWJib25zLS10ZXh0LXRyYW5zZm9ybSksXG4gICAgKCdsZXR0ZXItc3BhY2luZycsICRyaWJib25zLS1sZXR0ZXItc3BhY2luZyksXG4gICAgKCdsaW5lLWhlaWdodCcsICRyaWJib25zLS1saW5lLWhlaWdodCksXG4gICAgKCd0ZXh0LWRlY29yYXRpb24nLCAkcmliYm9ucy0tdGV4dC1kZWNvcmF0aW9uKSxcbiAgICAoJ21hcmdpbicsICRyaWJib25zLS1tYXJnaW4pLFxuICAgICgnY29sb3InLCAkcmliYm9ucy0tY29sb3IpLFxuICAgICgnYm94LXNoYWRvdycsICRyaWJib25zLS1ib3gtc2hhZG93KSxcbiAgICAoJ2JhY2tncm91bmQnLCAkcmliYm9ucy0tYmFja2dyb3VuZCksXG4gICAgKCdwb3NpdGlvbicsIHJlbGF0aXZlKSxcbiAgICAoJ3dpZHRoJywgJHJpYmJvbnMtLXNpemUpLFxuICAgICgnaGVpZ2h0JywgJHJpYmJvbnMtLXNpemUpLFxuICAgICgnb3ZlcmZsb3cnLCBoaWRkZW4pLFxuICAgICgncG9pbnRlci1ldmVudHMnLCBub25lKSxcbiAgICAoJ2Rpc3BsYXknLCBibG9jayksXG4gICkpO1xuXG5cbiAgJHJpYmJvbi1iYW5kLS1zZWxlY3Rvcjogc2VsZWN0b3Ioc2V0ICRyaWJib24tLXNlbGVjdG9yIGVsZW1lbnQgJ2JhbmQnKTtcblxuICBAaW5jbHVkZSBzdGF0ZW1lbnQoJHJpYmJvbi1iYW5kLS1zZWxlY3RvciwgKFxuICAgICgnQGluY2x1ZGUgcmliYm9ucy0tcG9zaXRpb24nLCAkcmliYm9ucy0tcG9zaXRpb24pLFxuICAgICgnQGluY2x1ZGUgcmliYm9ucy1iYW5kLS13aWR0aCcsICRyaWJib25zLS1ndXR0ZXIpLFxuICAgICgnYmFja2dyb3VuZC1jb2xvcicsICRyaWJib25zLS1iYWNrZ3JvdW5kLWNvbG9yKSxcbiAgICAoJ3Bvc2l0aW9uJywgYWJzb2x1dGUpLFxuICAgICgndG9wJywgMCksXG4gICAgKCdoZWlnaHQnLCAkcmliYm9ucy0taGVpZ2h0KSxcbiAgICAoJ3RleHQtYWxpZ24nLCBjZW50ZXIpLFxuICAgICgndXNlci1zZWxlY3QnLCBub25lKSxcbiAgICAoJ2Rpc3BsYXknLCBibG9jayksXG4gICkpO1xuXG5cbiAgJHJpYmJvbi1iYW5kLWJlZm9yZS0tc2VsZWN0b3I6IHNlbGVjdG9yKHNldCAkcmliYm9uLWJhbmQtLXNlbGVjdG9yIHBzZXVkby1lbGVtZW50ICdiZWZvcmUnKTtcblxuICBAaW5jbHVkZSBzdGF0ZW1lbnQoJHJpYmJvbi1iYW5kLWJlZm9yZS0tc2VsZWN0b3IsIChcbiAgICAoJ0BpbmNsdWRlIHJpYmJvbnMtYmFuZC1wc2V1ZG9zLS1jb21tb25zJywgJycpLFxuICAgICgnYmFja2dyb3VuZC1jb2xvcicsICRyaWJib25zLS1iYWNrZ3JvdW5kLWNvbG9yKSxcbiAgICAoJ2xlZnQnLCAxMDAlKSxcbiAgKSk7XG5cblxuICAkcmliYm9uLWJhbmQtYWZ0ZXItLXNlbGVjdG9yOiBzZWxlY3RvcihzZXQgJHJpYmJvbi1iYW5kLS1zZWxlY3RvciBwc2V1ZG8tZWxlbWVudCAnYWZ0ZXInKTtcblxuICBAaW5jbHVkZSBzdGF0ZW1lbnQoJHJpYmJvbi1iYW5kLWFmdGVyLS1zZWxlY3RvciwgKFxuICAgICgnQGluY2x1ZGUgcmliYm9ucy1iYW5kLXBzZXVkb3MtLWNvbW1vbnMnLCAnJyksXG4gICAgKCdiYWNrZ3JvdW5kLWNvbG9yJywgJHJpYmJvbnMtLWJhY2tncm91bmQtY29sb3IpLFxuICAgICgncmlnaHQnLCAxMDAlKSxcbiAgKSk7XG5cblxuICAkcmliYm9uLWNvbnRlbnQtLXNlbGVjdG9yOiBzZWxlY3RvcihzZXQgJHJpYmJvbi0tc2VsZWN0b3IgZWxlbWVudCAnY29udGVudCcpO1xuXG4gIEBpbmNsdWRlIHN0YXRlbWVudCgkcmliYm9uLWNvbnRlbnQtLXNlbGVjdG9yLCAoXG4gICAgKCdwb3NpdGlvbicsIGFic29sdXRlKSxcbiAgICAoJ3RvcCcsIDUwJSksXG4gICAgKCdsZWZ0JywgNTAlKSxcbiAgICAoJ3RyYW5zZm9ybScsIHRyYW5zbGF0ZSgtNTAlLCAtNTAlKSksXG4gICAgKCd6LWluZGV4JywgMSksXG4gICAgKCd3aGl0ZS1zcGFjZScsIG5vd3JhcCksXG4gICAgKCdvdmVyZmxvdycsIGhpZGRlbiksXG4gICAgKCdkaXNwbGF5JywgYmxvY2spLFxuICApKTtcblxuXG4gICRyaWJib24tY29udGVudC1iZWZvcmUtLXNlbGVjdG9yOiBzZWxlY3RvcihzZXQgJHJpYmJvbi1jb250ZW50LS1zZWxlY3RvciBwc2V1ZG8tZWxlbWVudCAnYmVmb3JlJyk7XG5cbiAgQGluY2x1ZGUgc3RhdGVtZW50KCRyaWJib24tY29udGVudC1iZWZvcmUtLXNlbGVjdG9yLCAoXG4gICAgKCdjb250ZW50JywgJycpLFxuICAgICgnYmFja2dyb3VuZC1jb2xvcicsICRyaWJib25zLS1iYWNrZ3JvdW5kLWNvbG9yKSxcbiAgICAoJ3Bvc2l0aW9uJywgYWJzb2x1dGUpLFxuICAgICgndG9wJywgLTFweCksXG4gICAgKCdib3R0b20nLCAtMXB4KSxcbiAgICAoJ2xlZnQnLCAtMXB4KSxcbiAgICAoJ3JpZ2h0JywgLTFweCksXG4gICAgKCd6LWluZGV4JywgLTEpLFxuICAgICgnb3ZlcmZsb3cnLCBoaWRkZW4pLFxuICApKVxufVxuIiwiQGltcG9ydCAnY29yZS9zdGF0ZW1lbnQnO1xuQGltcG9ydCAnY29yZS9icmVha3BvaW50cyc7XG5AaW1wb3J0ICdjb3JlL3NlbGVjdG9yJztcbkBpbXBvcnQgJ2NvcmUvdmFsdWUnO1xuXG4vLyBzdGF0ZW1lbnRcbkBtaXhpbiBzdGF0ZW1lbnQoJHNlbGVjdG9yLCAkYmxvY2ssICRmbGFnOiBudWxsKSB7XG4gICRibG9jazogYmxvY2stc29ydGVkKCRibG9jayk7XG4gIEBpbmNsdWRlIHByaW50LXN0YXRlbWVudCgkc2VsZWN0b3IsICRibG9jaywgJGZsYWcpO1xufVxuXG5cbi8vIG1lZGlhLXF1ZXJ5XG5AbWl4aW4gbWVkaWEtcXVlcnkgKCRmb3JrLCAkcGhpbG9zb3BoeTogJ2FuZC1tb3JlJykge1xuICAkYnJlYWtwb2ludHMtY29uZmlnOiBtYXAtZ2V0KCR0cm93ZWwtY29uZmlnLCAnYnJlYWtwb2ludHMnKTtcblxuICBAaWYgbm90ICRicmVha3BvaW50cy1jb25maWcgb3Igbm90ICRmb3JrIHtcbiAgICBAY29udGVudDtcbiAgfSBAZWxzZSB7XG4gICAgJGJyZWFrcG9pbnRzOiBicmVha3BvaW50cy0tY29uc3RydWN0b3IoJGJyZWFrcG9pbnRzLWNvbmZpZyk7XG5cbiAgICBAaWYgbm90IGJyZWFrcG9pbnQtLWdldC1mb3JrLXF1ZXJ5KCRicmVha3BvaW50cywgJGZvcmssICRwaGlsb3NvcGh5KSB7XG4gICAgICBAY29udGVudDtcbiAgICB9IEBlbHNlIHtcbiAgICAgIEBtZWRpYSAje2JyZWFrcG9pbnQtLWdldC1mb3JrLXF1ZXJ5KCRicmVha3BvaW50cywgJGZvcmssICRwaGlsb3NvcGh5KX0ge1xuICAgICAgICBAY29udGVudDtcbiAgICAgIH1cbiAgICB9XG4gIH1cbn1cblxuXG4vLyBzZWxlY3RvclxuQGZ1bmN0aW9uIHByaW50LXNlbGVjdG9yKCRzZWxlY3Rvcikge1xuICBAcmV0dXJuIHNlbGVjdG9yLS1nZXQtcHJpbnQtcGFyZW50cygkc2VsZWN0b3IpICsgc2VsZWN0b3ItLWdldC1wcmludCgkc2VsZWN0b3IpO1xufVxuXG5AbWl4aW4gc2VsZWN0b3IoJHNlbGVjdG9yKSB7XG4gICRicmVha3BvaW50LWZvcms6IHNlbGVjdG9yLS1nZXQtYnJlYWtwb2ludCgkc2VsZWN0b3IpO1xuXG4gIEBhdC1yb290ICN7cHJpbnQtc2VsZWN0b3IoJHNlbGVjdG9yKX0ge1xuICAgIEBpbmNsdWRlIG1lZGlhLXF1ZXJ5KCRicmVha3BvaW50LWZvcmspIHtcbiAgICAgIEBjb250ZW50O1xuICAgIH1cbiAgfVxufVxuXG5AZnVuY3Rpb24gc2VsZWN0b3IoJGFyZ3MpIHtcbiAgJGFyZ3MtbGVuZ3RoOiBsZW5ndGgoJGFyZ3MpO1xuICAkZGlyZWN0aXZlOiBudGgoJGFyZ3MsIDEpO1xuXG4gIEBpZiAkZGlyZWN0aXZlID09ICduZXcnIHtcbiAgICBAaWYgbm90ICgkYXJncy1sZW5ndGggPT0gMiBvciAkYXJncy1sZW5ndGggPT0gNCkge1xuICAgICAgQGVycm9yICdzZWxlY3RvcigpIGZ1bmN0aW9uIHdpdGggYG5ld2AgYXMgZmlyc3QgYXJndW1lbnQgbXVzdCBoYXZlIDIgb3IgNCBhcmd1bWVudHMnO1xuICAgIH1cblxuICAgICRibG9jazogbnRoKCRhcmdzLCAyKTtcbiAgICAkc3ludGF4OiBpZigkYXJncy1sZW5ndGggPj0gNCwgbnRoKCRhcmdzLCA0KSwgbnVsbCk7XG4gICAgQHJldHVybiBzZWxlY3Rvci0tY29uc3RydWN0b3IobnRoKCRhcmdzLCAyKSwgJHN5bnRheCk7XG4gIH1cblxuICBAaWYgbm90ICgkYXJncy1sZW5ndGggPT0gNCBvciAkYXJncy1sZW5ndGggPT0gNikge1xuICAgIEBlcnJvciAnc2VsZWN0b3IoKSBmdW5jdGlvbiB3aXRoIGBzZXRgIG9yIGBhcHBlbmRgIGFzIGZpcnN0IGFyZ3VtZW50IG11c3QgaGF2ZSA0IG9yIDYgYXJndW1lbnRzJztcbiAgfVxuXG4gICRzZWxlY3RvcjogbnRoKCRhcmdzLCAyKTtcbiAgJHByb3BlcnR5OiBudGgoJGFyZ3MsIDMpO1xuICAkcGFyYW0tMTogbnRoKCRhcmdzLCA0KTtcbiAgJHBhcmFtLTI6IGlmKCRhcmdzLWxlbmd0aCA+PSA2LCBudGgoJGFyZ3MsIDYpLCBudWxsKTtcblxuICBAaWYgJHBhcmFtLTIge1xuICAgIEByZXR1cm4gY2FsbCgnc2VsZWN0b3ItLSN7JGRpcmVjdGl2ZX0tI3skcHJvcGVydHl9JywgJHNlbGVjdG9yLCAkcGFyYW0tMSwgJHBhcmFtLTIpO1xuICB9XG5cbiAgQHJldHVybiBjYWxsKCdzZWxlY3Rvci0tI3skZGlyZWN0aXZlfS0jeyRwcm9wZXJ0eX0nLCAkc2VsZWN0b3IsICRwYXJhbS0xKTtcbn1cblxuXG4vLyB2YWx1ZVxuXG5AZnVuY3Rpb24gdmFsdWUoJHZhbHVlLCAkZmxhZ3M6IG51bGwpIHtcbiAgQGlmIHR5cGUtb2YoJHZhbHVlKSAhPSAnbWFwJyB7XG4gICAgQHJldHVybiAkdmFsdWU7XG4gIH1cblxuICBAaWYgJGZsYWdzID09IG51bGwge1xuICAgIEByZXR1cm4gbWFwLWdldCgkdmFsdWUsICdkZWZhdWx0Jyk7XG4gIH1cblxuICAkdmFsdWVzLWNvcnJlc3BvbmRhbnQ6IHZhbHVlcy1jb3JyZXNwb25kYW50KCR2YWx1ZSwgJGZsYWdzKTtcblxuICBAaWYgbGVuZ3RoKCR2YWx1ZXMtY29ycmVzcG9uZGFudCkgPT0gMCB7XG4gICAgQHJldHVybiBtYXAtZ2V0KCR2YWx1ZSwgJ2RlZmF1bHQnKTtcbiAgfVxuXG4gICR2YWx1ZTogbnRoKCR2YWx1ZXMtY29ycmVzcG9uZGFudCwgMSk7XG4gIEBlYWNoICR2YWx1ZS1jb3JyZXNwb25kYW50IGluICR2YWx1ZXMtY29ycmVzcG9uZGFudCB7XG4gICAgQGlmIHZhbHVlLWNvcnJlc3BvbmRhbnQtLWdldC1mbGFncy1sZW5ndGgoJHZhbHVlLWNvcnJlc3BvbmRhbnQpID49IHZhbHVlLWNvcnJlc3BvbmRhbnQtLWdldC1mbGFncy1sZW5ndGgoJHZhbHVlKSB7XG4gICAgICAkdmFsdWU6ICR2YWx1ZS1jb3JyZXNwb25kYW50O1xuICAgIH1cbiAgfVxuXG4gIEByZXR1cm4gdmFsdWUtY29ycmVzcG9uZGFudC0tZ2V0LXZhbHVlKCR2YWx1ZSk7XG59XG4iLCJAaW1wb3J0ICcuLi9leHRlbnNpb25zL3NvcnQnO1xuQGltcG9ydCAnLi4vZXh0ZW5zaW9ucy9tYXAnO1xuQGltcG9ydCAnc2VsZWN0b3InO1xuXG5AZnVuY3Rpb24gZGVjbGFyYXRpb24oJGJsb2NrLCAkcHJvcGVydHksICR2YWx1ZSwgJGZsYWdzOiAoKSkge1xuICBAaWYgdHlwZS1vZigkdmFsdWUpID09ICdtYXAnIHtcbiAgICBAZWFjaCAkZmxhZywgJHZhbHVlIGluICR2YWx1ZSB7XG4gICAgICAkbmV3LWZsYWdzOiAkZmxhZ3M7XG5cbiAgICAgIEBpZiBpbmRleCgoJzonLCAnPCcsICdAJywgJy0nLCAnficsICdbJyksIHN0ci1zbGljZSgkZmxhZywgMCwgMSkpIHtcbiAgICAgICAgJG5ldy1mbGFnczogYXBwZW5kKCRuZXctZmxhZ3MsICRmbGFnKTtcbiAgICAgICAgJG5ldy1mbGFnczogc29ydCgkbmV3LWZsYWdzKTtcbiAgICAgIH1cblxuICAgICAgJGJsb2NrOiBkZWNsYXJhdGlvbigkYmxvY2ssICRwcm9wZXJ0eSwgJHZhbHVlLCAkbmV3LWZsYWdzKTtcbiAgICB9XG4gIH0gQGVsc2Uge1xuICAgIEBpZiBzdHItc2xpY2UoJHByb3BlcnR5LCAxLCA5KSA9PSAnQGluY2x1ZGUgJyB7XG4gICAgICAkbWl4aW46IHN0ci1zbGljZSgkcHJvcGVydHksIDEwKTtcbiAgICAgICRtaXhpbi1yZXN1bHQ6IGNhbGwoJG1peGluLCAkdmFsdWUsICRmbGFncyk7XG4gICAgICAkYmxvY2s6IGJsb2NrLXNvcnRlZCgkbWl4aW4tcmVzdWx0LCAkYmxvY2spO1xuICAgICAgQHJldHVybiAkYmxvY2s7XG4gICAgfSBAZWxzZSB7XG4gICAgICBAaWYgbGVuZ3RoKCRmbGFncykgPj0gMSB7XG4gICAgICAgICRwcmV2aW91cy1ibG9jazogbWFwLWdldC1kZWVwKCRibG9jaywgYXBwZW5kKCRmbGFncywgJ2RlZmF1bHQnKSk7XG5cbiAgICAgICAgQGlmICRwcmV2aW91cy1ibG9jayB7XG4gICAgICAgICAgJHByZXZpb3VzLWJsb2NrOiBtYXAtc21hcnQtbWVyZ2UoJHByZXZpb3VzLWJsb2NrLCAoJHByb3BlcnR5OiAkdmFsdWUpKTtcbiAgICAgICAgICAkYmxvY2s6IG1hcC1zZXQtZGVlcCgkYmxvY2ssIGFwcGVuZCgkZmxhZ3MsICdkZWZhdWx0JyksICRwcmV2aW91cy1ibG9jayk7XG4gICAgICAgIH0gQGVsc2Uge1xuICAgICAgICAgICRibG9jazogbWFwLXNldC1kZWVwKCRibG9jaywgYXBwZW5kKCRmbGFncywgJ2RlZmF1bHQnKSwgKCRwcm9wZXJ0eTogJHZhbHVlKSk7XG4gICAgICAgIH1cbiAgICAgIH0gQGVsc2Uge1xuICAgICAgICAkYmxvY2s6IG1hcC1zbWFydC1tZXJnZSgkYmxvY2ssICgnZGVmYXVsdCc6ICgkcHJvcGVydHk6ICR2YWx1ZSkpKTtcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBAcmV0dXJuICRibG9jaztcbn1cblxuQGZ1bmN0aW9uIGJsb2NrLXNvcnRlZCgkZGVjbGFyYXRpb25zLCAkYmxvY2s6ICgpKSB7XG4gIEBlYWNoICRkZWNsYXJhdGlvbiBpbiAkZGVjbGFyYXRpb25zIHtcbiAgICAkcHJvcGVydHk6IG50aCgkZGVjbGFyYXRpb24sIDEpO1xuICAgICR2YWx1ZTogbnRoKCRkZWNsYXJhdGlvbiwgMik7XG4gICAgJGZsYWdzOiBpZihsZW5ndGgoJGRlY2xhcmF0aW9uKSA+PSAzLCBudGgoJGRlY2xhcmF0aW9uLCAzKSwgKCkpO1xuXG4gICAgJGJsb2NrOiBkZWNsYXJhdGlvbigkYmxvY2ssICRwcm9wZXJ0eSwgJHZhbHVlLCAkZmxhZ3MpO1xuICB9XG5cbiAgQHJldHVybiAkYmxvY2s7XG59XG5cbkBtaXhpbiBwcmludC1zdGF0ZW1lbnQoJHNlbGVjdG9yLCAkYmxvY2ssICRmbGFnKSB7XG4gIEBpZiAkZmxhZyAhPSAnZGVmYXVsdCcge1xuICAgIEBlYWNoICRmbGFnLCAkYmxvY2sgaW4gJGJsb2NrIHtcbiAgICAgICRuZXctc2VsZWN0b3I6ICRzZWxlY3RvcjtcblxuICAgICAgJGZsYWctdHlwZTogc3RyLXNsaWNlKCRmbGFnLCAwLCAxKTtcbiAgICAgICRmbGFnLW5hbWU6IHN0ci1zbGljZSgkZmxhZywgMik7XG5cbiAgICAgIEBpZiAkZmxhZy10eXBlID09ICc6JyB7XG4gICAgICAgICRuZXctc2VsZWN0b3I6IHNlbGVjdG9yLS1hcHBlbmQtcHNldWRvLWNsYXNzKCRuZXctc2VsZWN0b3IsICRmbGFnLW5hbWUpO1xuICAgICAgfSBAZWxzZWlmICRmbGFnLXR5cGUgPT0gJzwnIHtcbiAgICAgICAgJG5ldy1zZWxlY3Rvcjogc2VsZWN0b3ItLXNldC10YWcoJG5ldy1zZWxlY3RvciwgJGZsYWctbmFtZSk7XG4gICAgICB9IEBlbHNlaWYgJGZsYWctdHlwZSA9PSAnQCcge1xuICAgICAgICAkbmV3LXNlbGVjdG9yOiBzZWxlY3Rvci0tc2V0LWJyZWFrcG9pbnQoJG5ldy1zZWxlY3RvciwgJGZsYWctbmFtZSk7XG4gICAgICB9IEBlbHNlaWYgJGZsYWctdHlwZSA9PSAnLScge1xuICAgICAgICAkbmV3LXNlbGVjdG9yOiBzZWxlY3Rvci0tYXBwZW5kLW1vZGlmaWVyKCRuZXctc2VsZWN0b3IsICRmbGFnLW5hbWUpO1xuICAgICAgfSBAZWxzZWlmICRmbGFnLXR5cGUgPT0gJ34nIHtcbiAgICAgICAgJG5ldy1zZWxlY3Rvcjogc2VsZWN0b3ItLWFwcGVuZC1tb2RpZmllci1lbGVtZW50KCRuZXctc2VsZWN0b3IsICRmbGFnLW5hbWUpO1xuICAgICAgfSBAZWxzZWlmICRmbGFnLXR5cGUgPT0gJ1snIHtcbiAgICAgICAgJG5ldy1zZWxlY3Rvcjogc2VsZWN0b3ItLWFwcGVuZC1hdHRyaWJ1dGUoJG5ldy1zZWxlY3RvciwgJGZsYWctbmFtZSk7XG4gICAgICB9XG5cbiAgICAgIEBpbmNsdWRlIHByaW50LXN0YXRlbWVudCgkbmV3LXNlbGVjdG9yLCAkYmxvY2ssICRmbGFnKTtcbiAgICB9XG4gIH0gQGVsc2Uge1xuICAgIEBpbmNsdWRlIHNlbGVjdG9yKCRzZWxlY3Rvcikge1xuICAgICAgQGVhY2ggJHByb3BlcnR5LCAkdmFsdWUgaW4gJGJsb2NrIHtcbiAgICAgICAgI3skcHJvcGVydHl9OiAkdmFsdWU7XG4gICAgICB9XG4gICAgfVxuICB9XG59XG4iLCIvLyBzY3NzLWxpbnQ6ZGlzYWJsZSBDb2xvclZhcmlhYmxlXG5cbiR0cndsLXRoZW1lOiAoXG4gICdjb2xvcnMnOiAoXG4gICAnZ3JheS1saWdodCc6IHJnYigyNDgsIDI0OCwgMjUwKSxcbiAgICdncmF5LW1lZGl1bSc6IHJnYigyMzIsIDIzMiwgMjM2KSxcbiAgICdncmF5LWRhcmsnOiByZ2IoMjA3LCAyMDcsIDIxMyksXG4gICAnZ3JheS1kYXJrZXInOiByZ2IoMTU1LCAxNTUsIDE1NyksXG4gICAncHJpbWFyeSc6IHJnYigzMSwgMTMsIDUxKSxcbiAgICdzdWNjZXNzJzogcmdiKDU1LCAyMTEsIDE4OSksXG4gICAnd2FybmluZyc6IHJnYigyNTUsIDE3NiwgMCksXG4gICAnZGFuZ2VyJzogcmdiKDI1MywgNjUsIDEwMCksXG4gICksXG4gICdmb250LXNpemVzJzogKFxuICAgICd4cyc6IDAuNjVyZW0sXG4gICAgJ3NtJzogMC44cmVtLFxuICAgICdtZCc6IDFyZW0sXG4gICAgJ2xnJzogMS4ycmVtLFxuICApLFxuICAnZm9udC1mYW1pbHknOiAje1wiJ09wZW4gU2FucycsIHZlcmRhbmEsIHNhbnMtc2VyaWZcIn0sXG4gICdsaW5lLWhlaWdodCc6IDEuMixcbiAgJ3BhZGRpbmcteSc6IDAuNjVlbSxcbiAgJ3BhZGRpbmcteCc6IDEuNjVlbSxcbiAgJ2JvcmRlci13aWR0aCc6IDAuMDYyNWVtLFxuICAnYm9yZGVyLXN0eWxlJzogc29saWQsXG4gICdib3JkZXItcmFkaXVzJzogMC4yZW0sXG4pO1xuXG5AZnVuY3Rpb24gdHJ3bC10aGVtZSgkcHJvcGVydHkpIHtcbiAgQHJldHVybiBtYXAtZ2V0KCR0cndsLXRoZW1lLCAkcHJvcGVydHkpO1xufVxuXG5AZnVuY3Rpb24gdHJ3bC10aGVtZS1jb2xvcigkY29sb3IpIHtcbiAgQHJldHVybiBtYXAtZ2V0KG1hcC1nZXQoJHRyd2wtdGhlbWUsICdjb2xvcnMnKSwgJGNvbG9yKTtcbn1cblxuQGZ1bmN0aW9uIHRyd2wtdGhlbWUtc2l6ZSgkc2l6ZSkge1xuICBAcmV0dXJuIG1hcC1nZXQobWFwLWdldCgkdHJ3bC10aGVtZSwgJ2ZvbnQtc2l6ZXMnKSwgJHNpemUpO1xufVxuIiwiJHJpYmJvbnMtLWZvbnQtc2l6ZTogdHJ3bC10aGVtZS1zaXplKCdtZCcpICFkZWZhdWx0O1xuJHJpYmJvbnMtLWZvbnQtZmFtaWx5OiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWZvbnQtd2VpZ2h0OiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLXRleHQtdHJhbnNmb3JtOiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWxldHRlci1zcGFjaW5nOiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWxpbmUtaGVpZ2h0OiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLXRleHQtZGVjb3JhdGlvbjogbnVsbCAhZGVmYXVsdDtcbiRyaWJib25zLS1tYXJnaW46IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tY29sb3I6IHJnYigyNTUsIDI1NSwgMjU1KSAhZGVmYXVsdDtcbiRyaWJib25zLS1ib3gtc2hhZG93OiBudWxsICFkZWZhdWx0O1xuJHJpYmJvbnMtLWJhY2tncm91bmQ6IG51bGwgIWRlZmF1bHQ7XG4kcmliYm9ucy0tYmFja2dyb3VuZC1jb2xvcjogKFxuICAnZGVmYXVsdCc6IHRyd2wtdGhlbWUtY29sb3IoJ2dyYXktZGFya2VyJyksXG4gICctcHJpbWFyeSc6IHRyd2wtdGhlbWUtY29sb3IoJ3ByaW1hcnknKSxcbiAgJy1zdWNjZXNzJzogdHJ3bC10aGVtZS1jb2xvcignc3VjY2VzcycpLFxuICAnLXdhcm5pbmcnOiB0cndsLXRoZW1lLWNvbG9yKCd3YXJuaW5nJyksXG4gICctZGFuZ2VyJzogdHJ3bC10aGVtZS1jb2xvcignZGFuZ2VyJyksXG4pICFkZWZhdWx0O1xuJHJpYmJvbnMtLXNpemU6IDcuNWVtICFkZWZhdWx0O1xuJHJpYmJvbnMtLXBvc2l0aW9uOiAoXG4gICdkZWZhdWx0JzogJ2xlZnQnLFxuICAnLXJpZ2h0JzogJ3JpZ2h0JyxcbikgIWRlZmF1bHQ7IC8vICdsZWZ0JyBvciAncmlnaHQnXG4kcmliYm9ucy0tZ3V0dGVyOiAzLjc1ZW0gIWRlZmF1bHQ7XG4kcmliYm9ucy0taGVpZ2h0OiAxLjg3NWVtICFkZWZhdWx0O1xuIiwiQGZ1bmN0aW9uIHJpYmJvbnMtLXBvc2l0aW9uKCRvcmllbnRhdGlvbiwgJGZsYWdzKSB7XG4gICRwcm9wZXJ0eS1hZmZlY3RlZDogaWYoJG9yaWVudGF0aW9uID09ICdyaWdodCcsICdsZWZ0JywgJ3JpZ2h0Jyk7XG5cbiAgQGlmICRvcmllbnRhdGlvbiA9PSAncmlnaHQnIG9yICRvcmllbnRhdGlvbiA9PSAnbGVmdCcge1xuICAgICRyb3RhdGUtZGlyZWN0aW9uOiBpZigkb3JpZW50YXRpb24gPT0gJ2xlZnQnLCAtMSwgMSk7XG5cbiAgICBAcmV0dXJuIChcbiAgICAgICgkcHJvcGVydHktYWZmZWN0ZWQsIDEwMCUsICRmbGFncyksXG4gICAgICAoJG9yaWVudGF0aW9uLCBhdXRvLCAkZmxhZ3MpLFxuICAgICAgKCdtYXJnaW4tI3skcHJvcGVydHktYWZmZWN0ZWR9JywgdmFsdWUoJHJpYmJvbnMtLWd1dHRlciwgJGZsYWdzKSAqIC0xLCAkZmxhZ3MpLFxuICAgICAgKCdtYXJnaW4tI3skb3JpZW50YXRpb259JywgMCwgJGZsYWdzKSxcbiAgICAgICgndHJhbnNmb3JtLW9yaWdpbicsIHRvcCAjeyRwcm9wZXJ0eS1hZmZlY3RlZH0sICRmbGFncyksXG4gICAgICAoJ3RyYW5zZm9ybScsIHJvdGF0ZSg0NWRlZyAqICRyb3RhdGUtZGlyZWN0aW9uKSwgJGZsYWdzKSxcbiAgICApO1xuICB9IEBlbHNlIHtcbiAgICBAZXJyb3IgXCJUaGUgcGFyYW1ldGVyIGAkb3JpZW50YXRpb25gIG11c3QgYmUgYSBzdHJpbmcgdmFsdWUgdGhhdCBjYW4gb25seSBiZSAncmlnaHQnIG9yICdsZWZ0J1wiO1xuICB9XG5cbn1cbiIsIkBmdW5jdGlvbiBzcXVhcmUtcm9vdCgkcikge1xuICAkeDA6IDE7XG4gICR4MTogJHgwO1xuXG4gIEBmb3IgJGkgZnJvbSAxIHRocm91Z2ggMTAge1xuICAgICR4MTogJHgwIC0gKCR4MCAqICR4MCAtIGFicygkcikpIC8gKDIgKiAkeDApO1xuICAgICR4MDogJHgxO1xuICB9XG5cbiAgQHJldHVybiAkeDE7XG59XG5cbkBmdW5jdGlvbiBzdHJpcC11bml0cygkbnVtYmVyKSB7XG4gIEByZXR1cm4gJG51bWJlciAvICgkbnVtYmVyICogMCArIDEpO1xufVxuXG5AZnVuY3Rpb24gc3F1YXJlKCRudW1iZXIpIHtcbiAgJHVuaXRsZXNzOiBzdHJpcC11bml0cygkbnVtYmVyKTtcbiAgQHJldHVybiAoJHVuaXRsZXNzICogJHVuaXRsZXNzKTtcbn1cblxuQGZ1bmN0aW9uIGdldC1oeXBvdGVudXNlKCRhYiwgJGFjKSB7XG4gIEBpZiB1bml0KCRhYikgPT0gdW5pdCgkYWMpIHtcbiAgICBAcmV0dXJuIHNxdWFyZS1yb290KHNxdWFyZSgkYWIpICsgc3F1YXJlKCRhYykpICsgdW5xdW90ZSh1bml0KCRhYikpO1xuICB9IEBlbHNlIHtcbiAgICBAZXJyb3IgJ1RoZSB0d28gdmFsdWUgaW50byB0aGUgZ2V0LWh5cG90ZW51c2UoKSBmdW5jdGlvbiBtdXN0IHNoYXJlIHRoZSBzYW1lIHVuaXQgdHlwZSc7XG4gIH1cbn1cbiIsIkBpbXBvcnQgJy4vZ2V0LWh5cG90ZW51c2UnO1xuXG5AZnVuY3Rpb24gcmliYm9ucy1iYW5kLS13aWR0aCgkZ3V0dGVyLCAkZmxhZ3MpIHtcbiAgQHJldHVybiAoXG4gICAgKCd3aWR0aCcsIGdldC1oeXBvdGVudXNlKCRndXR0ZXIsICRndXR0ZXIpLCAkZmxhZ3MpLFxuICApO1xufVxuXG5cbi8vICgxKSBCaWcgc3RhdGljIHZhbHVlIGluIG9yZGVyIHRvIG1ha2Ugc3VyZSB0aGF0IGZvciBhbnkgZ3V0dGVyIHZhbHVlIHRoZVxuLy8gICAgIGJlZm9yZSBhbmQgYWZ0ZXIgZ29lcyBvZmYgdGhlIHRodW1ibmFpbCBlbGVtZW50XG4vLyAoMikgV2Ugc2V0IGEgbmVnYXRpdmUgbWFyZ2luIG9uIHggYXhpcyBpbiBvcmRlciB0byBhdm9pZCBhIHZlcnkgdGhpbiBiYW5kXG4vLyAgICAgd2hlcmUgdGhlIGA6OmFmdGVyYCBhbmQgYDo6YmVmb3JlYCBwc2V1ZG8gZWxlbWVudHMgYXJlIG5vdCBwZXJmZWN0bHlcbi8vICAgICBzdGlja2VkIHRvIHRoZSBgLnRodW1ibmFpbF9fcmliYm9uYC5cblxuQGZ1bmN0aW9uIHJpYmJvbnMtYmFuZC1wc2V1ZG9zLS1jb21tb25zKCRub3RoaW5nLCAkZmxhZ3MpIHtcbiAgQHJldHVybiAoXG4gICAgKCdjb250ZW50JywgJycpLFxuICAgICgnZGlzcGxheScsIGJsb2NrKSxcbiAgICAoJ3Bvc2l0aW9uJywgYWJzb2x1dGUpLFxuICAgICgndG9wJywgMCksXG4gICAgKCdoZWlnaHQnLCAxMDAlKSxcbiAgICAoJ3dpZHRoJywgMTAwMDBweCksIC8vICgxKVxuICAgICgnbWFyZ2luJywgMCAtMXB4KSwgLy8gKDIpXG4gICk7XG59XG4iXX0= */ diff --git a/dest/css/ribbons.min.css b/dest/css/ribbons.min.css index e82a104..a46287a 100644 --- a/dest/css/ribbons.min.css +++ b/dest/css/ribbons.min.css @@ -1 +1 @@ -.ribbon{font-size:1rem} \ No newline at end of file +.ribbon{font-size:1rem;color:#fff;position:relative;width:7.5em;height:7.5em;overflow:hidden;pointer-events:none;display:block}.ribbon__band{right:100%;left:auto;margin-right:-3.75em;margin-left:0;-webkit-transform-origin:top right;transform-origin:top right;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);width:5.303301em;background-color:#9b9b9d;position:absolute;top:0;height:1.875em;text-align:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:block}.ribbon--right .ribbon__band{left:100%;right:auto;margin-left:-3.75em;margin-right:0;-webkit-transform-origin:top left;transform-origin:top left;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.ribbon__band::after,.ribbon__band::before{top:0;height:100%;width:10000px;margin:0 -1px;display:block;content:"";position:absolute}.ribbon--primary .ribbon__band{background-color:#1f0d33}.ribbon--success .ribbon__band{background-color:#37d3bd}.ribbon--warning .ribbon__band{background-color:#ffb000}.ribbon--danger .ribbon__band{background-color:#fd4164}.ribbon__band::before{background-color:#9b9b9d;left:100%}.ribbon--primary .ribbon__band::before{background-color:#1f0d33}.ribbon--success .ribbon__band::before{background-color:#37d3bd}.ribbon--warning .ribbon__band::before{background-color:#ffb000}.ribbon--danger .ribbon__band::before{background-color:#fd4164}.ribbon__band::after{background-color:#9b9b9d;right:100%}.ribbon--primary .ribbon__band::after{background-color:#1f0d33}.ribbon--success .ribbon__band::after{background-color:#37d3bd}.ribbon--warning .ribbon__band::after{background-color:#ffb000}.ribbon--danger .ribbon__band::after{background-color:#fd4164}.ribbon__content{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:1;white-space:nowrap;overflow:hidden;display:block}.ribbon__content::before{content:"";background-color:#9b9b9d;position:absolute;top:-1px;bottom:-1px;left:-1px;right:-1px;z-index:-1;overflow:hidden}.ribbon--primary .ribbon__content::before{background-color:#1f0d33}.ribbon--success .ribbon__content::before{background-color:#37d3bd}.ribbon--warning .ribbon__content::before{background-color:#ffb000}.ribbon--danger .ribbon__content::before{background-color:#fd4164} \ No newline at end of file diff --git a/src/scss/ribbons.scss b/src/scss/ribbons.scss index 90d293b..a1e9ab8 100644 --- a/src/scss/ribbons.scss +++ b/src/scss/ribbons.scss @@ -5,29 +5,92 @@ @import 'utils/enables'; @import 'utils/syntaxes'; @import 'utils/trowel-variables'; -@import 'utils/mixin-example'; +@import 'utils/mixin-ribbons'; +@import 'utils/mixin-ribbons-band'; -$ribbon--selector: selector(new 'ribbon' with $ribbons--syntax); @if $ribbons--enabled { + $ribbon--selector: selector(new 'ribbon' with $ribbons--syntax); + @include statement($ribbon--selector, ( - ('@include ribbons--mixin-example', null), ('font-size', $ribbons--font-size), ('font-family', $ribbons--font-family), ('font-weight', $ribbons--font-weight), ('text-transform', $ribbons--text-transform), ('letter-spacing', $ribbons--letter-spacing), ('line-height', $ribbons--line-height), - ('text-align', $ribbons--text-align), ('text-decoration', $ribbons--text-decoration), ('margin', $ribbons--margin), - ('border-width', $ribbons--border-width), - ('border-style', $ribbons--border-style), - ('border-color', $ribbons--border-color), - ('border-radius', $ribbons--border-radius), ('color', $ribbons--color), ('box-shadow', $ribbons--box-shadow), ('background', $ribbons--background), + ('position', relative), + ('width', $ribbons--size), + ('height', $ribbons--size), + ('overflow', hidden), + ('pointer-events', none), + ('display', block), + )); + + + $ribbon-band--selector: selector(set $ribbon--selector element 'band'); + + @include statement($ribbon-band--selector, ( + ('@include ribbons--position', $ribbons--position), + ('@include ribbons-band--width', $ribbons--gutter), + ('background-color', $ribbons--background-color), + ('position', absolute), + ('top', 0), + ('height', $ribbons--height), + ('text-align', center), + ('user-select', none), + ('display', block), + )); + + + $ribbon-band-before--selector: selector(set $ribbon-band--selector pseudo-element 'before'); + + @include statement($ribbon-band-before--selector, ( + ('@include ribbons-band-pseudos--commons', ''), ('background-color', $ribbons--background-color), + ('left', 100%), )); + + + $ribbon-band-after--selector: selector(set $ribbon-band--selector pseudo-element 'after'); + + @include statement($ribbon-band-after--selector, ( + ('@include ribbons-band-pseudos--commons', ''), + ('background-color', $ribbons--background-color), + ('right', 100%), + )); + + + $ribbon-content--selector: selector(set $ribbon--selector element 'content'); + + @include statement($ribbon-content--selector, ( + ('position', absolute), + ('top', 50%), + ('left', 50%), + ('transform', translate(-50%, -50%)), + ('z-index', 1), + ('white-space', nowrap), + ('overflow', hidden), + ('display', block), + )); + + + $ribbon-content-before--selector: selector(set $ribbon-content--selector pseudo-element 'before'); + + @include statement($ribbon-content-before--selector, ( + ('content', ''), + ('background-color', $ribbons--background-color), + ('position', absolute), + ('top', -1px), + ('bottom', -1px), + ('left', -1px), + ('right', -1px), + ('z-index', -1), + ('overflow', hidden), + )) } diff --git a/src/scss/utils/_get-hypotenuse.scss b/src/scss/utils/_get-hypotenuse.scss new file mode 100644 index 0000000..e5e7025 --- /dev/null +++ b/src/scss/utils/_get-hypotenuse.scss @@ -0,0 +1,28 @@ +@function square-root($r) { + $x0: 1; + $x1: $x0; + + @for $i from 1 through 10 { + $x1: $x0 - ($x0 * $x0 - abs($r)) / (2 * $x0); + $x0: $x1; + } + + @return $x1; +} + +@function strip-units($number) { + @return $number / ($number * 0 + 1); +} + +@function square($number) { + $unitless: strip-units($number); + @return ($unitless * $unitless); +} + +@function get-hypotenuse($ab, $ac) { + @if unit($ab) == unit($ac) { + @return square-root(square($ab) + square($ac)) + unquote(unit($ab)); + } @else { + @error 'The two value into the get-hypotenuse() function must share the same unit type'; + } +} diff --git a/src/scss/utils/_mixin-example.scss b/src/scss/utils/_mixin-example.scss deleted file mode 100644 index 9ada614..0000000 --- a/src/scss/utils/_mixin-example.scss +++ /dev/null @@ -1,5 +0,0 @@ -@function ribbons--mixin-example($value, $flags) { - @return ( - ('content', $value, $flags), - ); -} diff --git a/src/scss/utils/_mixin-ribbons-band.scss b/src/scss/utils/_mixin-ribbons-band.scss new file mode 100644 index 0000000..a7bc119 --- /dev/null +++ b/src/scss/utils/_mixin-ribbons-band.scss @@ -0,0 +1,26 @@ +@import './get-hypotenuse'; + +@function ribbons-band--width($gutter, $flags) { + @return ( + ('width', get-hypotenuse($gutter, $gutter), $flags), + ); +} + + +// (1) Big static value in order to make sure that for any gutter value the +// before and after goes off the thumbnail element +// (2) We set a negative margin on x axis in order to avoid a very thin band +// where the `::after` and `::before` pseudo elements are not perfectly +// sticked to the `.thumbnail__ribbon`. + +@function ribbons-band-pseudos--commons($nothing, $flags) { + @return ( + ('content', ''), + ('display', block), + ('position', absolute), + ('top', 0), + ('height', 100%), + ('width', 10000px), // (1) + ('margin', 0 -1px), // (2) + ); +} diff --git a/src/scss/utils/_mixin-ribbons.scss b/src/scss/utils/_mixin-ribbons.scss new file mode 100644 index 0000000..14a5f05 --- /dev/null +++ b/src/scss/utils/_mixin-ribbons.scss @@ -0,0 +1,19 @@ +@function ribbons--position($orientation, $flags) { + $property-affected: if($orientation == 'right', 'left', 'right'); + + @if $orientation == 'right' or $orientation == 'left' { + $rotate-direction: if($orientation == 'left', -1, 1); + + @return ( + ($property-affected, 100%, $flags), + ($orientation, auto, $flags), + ('margin-#{$property-affected}', value($ribbons--gutter, $flags) * -1, $flags), + ('margin-#{$orientation}', 0, $flags), + ('transform-origin', top #{$property-affected}, $flags), + ('transform', rotate(45deg * $rotate-direction), $flags), + ); + } @else { + @error "The parameter `$orientation` must be a string value that can only be 'right' or 'left'"; + } + +} diff --git a/src/scss/utils/_trowel-variables.scss b/src/scss/utils/_trowel-variables.scss index db65b4c..3d9ed2f 100644 --- a/src/scss/utils/_trowel-variables.scss +++ b/src/scss/utils/_trowel-variables.scss @@ -1,17 +1,25 @@ -$ribbons--font-size: 1rem !default; +$ribbons--font-size: trwl-theme-size('md') !default; $ribbons--font-family: null !default; $ribbons--font-weight: null !default; $ribbons--text-transform: null !default; $ribbons--letter-spacing: null !default; $ribbons--line-height: null !default; -$ribbons--text-align: null !default; $ribbons--text-decoration: null !default; $ribbons--margin: null !default; -$ribbons--border-width: null !default; -$ribbons--border-style: null !default; -$ribbons--border-color: null !default; -$ribbons--border-radius: null !default; -$ribbons--color: null !default; +$ribbons--color: rgb(255, 255, 255) !default; $ribbons--box-shadow: null !default; $ribbons--background: null !default; -$ribbons--background-color: null !default; +$ribbons--background-color: ( + 'default': trwl-theme-color('gray-darker'), + '-primary': trwl-theme-color('primary'), + '-success': trwl-theme-color('success'), + '-warning': trwl-theme-color('warning'), + '-danger': trwl-theme-color('danger'), +) !default; +$ribbons--size: 7.5em !default; +$ribbons--position: ( + 'default': 'left', + '-right': 'right', +) !default; // 'left' or 'right' +$ribbons--gutter: 3.75em !default; +$ribbons--height: 1.875em !default; diff --git a/src/twig/ribbon.html.twig b/src/twig/ribbon.html.twig index 00788a4..2406ec3 100644 --- a/src/twig/ribbon.html.twig +++ b/src/twig/ribbon.html.twig @@ -9,6 +9,13 @@ {% set blockSelector = syntax.prefix|default(false) ? syntax.prefix ~ syntax.separator.prefix ~ 'ribbon' : 'ribbon' %} -
- {{ block('body') }} -
+{% set modifiersClass = '' %} +{% for modifier in modifiers|default([]) %} + {% set modifiersClass = modifiersClass ~ ' ' ~ blockSelector ~ syntax.separator.modifier ~ modifier %} +{% endfor %} + + + + {{ block('content') }} + + diff --git a/test/src/index.html.twig b/test/src/index.html.twig index a56d22e..4986b4b 100644 --- a/test/src/index.html.twig +++ b/test/src/index.html.twig @@ -16,9 +16,17 @@ {% embed '../../src/twig/ribbon.html.twig' %} - {% block body %}hello world !{% endblock %} + {% block content %}default{% endblock %} {% endembed %} - + {% embed '../../src/twig/ribbon.html.twig' with { modifiers: ['right'] } %} + {% block content %}on right{% endblock %} + {% endembed %} + + {% for theme in ['primary', 'success', 'warning', 'danger'] %} + {% embed '../../src/twig/ribbon.html.twig' with { modifiers: [theme] } %} + {% block content %}{{ theme }}{% endblock %} + {% endembed %} + {% endfor %}