diff --git a/doc/presentations/meetup4/LICENSE.md b/doc/presentations/meetup4/LICENSE.md new file mode 100644 index 00000000000..bd3449d3576 --- /dev/null +++ b/doc/presentations/meetup4/LICENSE.md @@ -0,0 +1,21 @@ +# The MIT License + +Copyright © 2010–2015 Vadim Makeev, http://pepelsbey.net/ + +Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + +--- + +# Лицензия MIT + +Copyright © 2010–2015 Вадим Макеев, http://pepelsbey.net/ + +Данная лицензия разрешает лицам, получившим копию данного программного обеспечения и сопутствующей документации (в дальнейшем именуемыми «Программное Обеспечение»), безвозмездно использовать Программное Обеспечение без ограничений, включая неограниченное право на использование, копирование, изменение, добавление, публикацию, распространение, сублицензирование и/или продажу копий Программного Обеспечения, также как и лицам, которым предоставляется данное Программное Обеспечение, при соблюдении следующих условий: + +Указанное выше уведомление об авторском праве и данные условия должны быть включены во все копии или значимые части данного Программного Обеспечения. + +ДАННОЕ ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ ПРЕДОСТАВЛЯЕТСЯ «КАК ЕСТЬ», БЕЗ КАКИХ-ЛИБО ГАРАНТИЙ, ЯВНО ВЫРАЖЕННЫХ ИЛИ ПОДРАЗУМЕВАЕМЫХ, ВКЛЮЧАЯ, НО НЕ ОГРАНИЧИВАЯСЬ ГАРАНТИЯМИ ТОВАРНОЙ ПРИГОДНОСТИ, СООТВЕТСТВИЯ ПО ЕГО КОНКРЕТНОМУ НАЗНАЧЕНИЮ И ОТСУТСТВИЯ НАРУШЕНИЙ ПРАВ. НИ В КАКОМ СЛУЧАЕ АВТОРЫ ИЛИ ПРАВООБЛАДАТЕЛИ НЕ НЕСУТ ОТВЕТСТВЕННОСТИ ПО ИСКАМ О ВОЗМЕЩЕНИИ УЩЕРБА, УБЫТКОВ ИЛИ ДРУГИХ ТРЕБОВАНИЙ ПО ДЕЙСТВУЮЩИМ КОНТРАКТАМ, ДЕЛИКТАМ ИЛИ ИНОМУ, ВОЗНИКШИМ ИЗ, ИМЕЮЩИМ ПРИЧИНОЙ ИЛИ СВЯЗАННЫМ С ПРОГРАММНЫМ ОБЕСПЕЧЕНИЕМ ИЛИ ИСПОЛЬЗОВАНИЕМ ПРОГРАММНОГО ОБЕСПЕЧЕНИЯ ИЛИ ИНЫМИ ДЕЙСТВИЯМИ С ПРОГРАММНЫМ ОБЕСПЕЧЕНИЕМ. diff --git a/doc/presentations/meetup4/index.html b/doc/presentations/meetup4/index.html new file mode 100644 index 00000000000..0d6089c5930 --- /dev/null +++ b/doc/presentations/meetup4/index.html @@ -0,0 +1,337 @@ + + + + ClickHouse meetup в Новосибирске + + + + + + +
+

ClickHouse meetup в Новосибирске

+
+ +
+

ClickHouse meetup
в Новосибирске

+
+ +
+

ClickHouse: настоящее и будущее

+
+ +
+

Что такое ClickHouse?

+

ClickHouse - distributed analytical column-oriented DBMS

+
+ +
+

Почему column-oriented?

+

Так работают row-oriented системы:

+

+
+
+

Почему column-oriented?

+

Так работают column-oriented системы:

+

+
+
+

Почему ClickHouse?

+

Ничего готового не подошло.

+

Тогда мы сделали ClickHouse.

+

«Эволюция структур данных в Яндекс.Метрике»

+

https://habrahabr.ru/company/yandex/blog/273305/

+
+
+

Метрика 2.0

+ +
+
+

Коротко

+ +
+
+

Основной кластер Метрики

+ +

* Если вы хотите попробовать ClickHouse, достаточно и одного сервера.

+
+
+

ClickHouse в Яндексе

+

Нам удалось сделать систему сравнительно удобной.

+

С самого начала мы имели подробную документацию.

+

В течение пары лет ClickHouse распространился по другим отделам Яндекса.

+

Почта, Маркет, Директ, Вебмастер, AdFox, Инфраструктура, Бизнес аналитика...

+

Есть случаи, когда аналитики самостоятельно устанавливали ClickHouse на виртуальные машины и успешно использовали без каких-либо вопросов.

+
+
+

Open-source

+

Потом мы решили — ClickHouse слишком хорошая система, чтобы нам одним на нём сидеть.

+

Чтобы было веселее, надо подсадить на ClickHouse людей снаружи, пусть радуются. Решили сделать open-source.

+
+
+

Open-source

+

Лицензия Apache 2.0 — минимум ограничений.

+

Цель — максимальное распространение продукта.

+

Мы хотим, чтобы продуктом Яндекса пользовались по всему миру.

+

См. “Яндекс открывает ClickHouse”

+

https://habrahabr.ru/company/yandex/blog/303282/

+
+
+

Когда надо использовать ClickHouse

+

Хорошо структурированные, очищенные, неизменяемые события.

+

 

+

Click stream. Веб-аналитика. Рекламные сети. RTB. E-commerce.

+

Аналитика онлайн игр. Данные сенсоров и мониторингов. Телеком данные.

+

Финансовые транзакции. Биржевая аналитика.

+
+
+

Когда не надо использовать ClickHouse

+

OLTP
В ClickHouse нет UPDATE и полноценных транзакций.

+

Key-Value
Если нужны частые запросы на обновление по ключу, используйте другое решение.

+

Blob-store, document oriented
ClickHouse предназначен для большого количества мелко-гранулированных данных.

+

Излишне нормализованные данные
Лучше сделать широкую таблицу фактов.

+
+
+

Почему ClickHouse такой быстрый?

+

 

+

— от безысходности.

+

Яндекс.Метрика должна работать.

+
+
+

Почему ClickHouse такой быстрый?

+

Алгоритмическая оптимизация.

+

MergeTree, локальность расположения данных на диске
— быстрые диапазонные запросы.

+

Пример: функция uniqCombined состоит из комбинации трёх различных структур данных, подходящих под разные диапазоны кардинальностей.

+

Низкоуровневая оптимизация.

+

Пример: vectorized query execution.

+

Специализация и внимание к деталям.

+

Пример: у нас есть 17 разных алгоритмов выполнения GROUP BY. Для вашего запроса выбирается лучший.

+
+ + +
+

Что нового в ClickHouse

+
+ +
+

Команда

+

Теперь 5 разработчиков.

+

+ + + + + +

+
+ +
+ +

В предыдущих сериях

+ +

— HTTP и executable источники;

+

— оптимизация мержей, вертикальный мерж;

+

— трассировка распределённых запросов;

+

— clickhouse-local;

+

— операторы BETWEEN, ||;

+

— функции UUID - text;

+ +
+
+ +

Новое в языке запросов

+ +

— KILL QUERY;

+

— LIMIT BY;

+

— SELECT INTO OUTFILE;

+ +
+
+ +

Сборка

+ +

— «правильная» сборка и пакеты;

+

— Таблица system.build_options;

+ +
+
+ +

Интерфейсы

+ +

— возможность получить прогресс выполнения в HTTP заголовках;

+

— возможность пропуска ошибок в текстовых форматах;

+

— правильные коды ответа в HTTP интерфейсе;

+ +
+
+ +

Словари

+ +

— производительность кэшируемых внешних словарей;

+

— инструментирование кэшируемых внешних словарей;

+

— HTTPS словари;

+ +
+
+ +

Инструментирование

+ +

— информация об использовании памяти под индекс;

+

— информация о размере столбцов в несжатом виде;

+

— метрики по потреблению оперативки кэшами;

+

— метрики про мержи;

+ +
+
+ +

Оптимизации

+ +

— оптимизация DISTINCT;

+

— производительность gzip в HTTP интерфейсе;

+

— оптимизация mark cache;

+ +
+
+ +

Функции

+ +

— правильная логика сравнений, least, greatest;

+

— groupUniqArray для всех типов данных;

+

— decodeURLComponent;

+ +
+
+ +

Что-то ещё

+ +

— защита от случайного DROP TABLE;

+

— use_client_time_zone; timezone в конфиге;

+

— fsync_metadata;

+ +
+
+ +

Сообщество

+ +

— интеграция с Grafana, Redash, Apache Zeppelin, Superset;

+

— правильные пакеты для CentOS, RHEL, GosLinux;

+

— драйвер native протокола для Go и C++;

+

— возможность передавать заголовки X-ClickHouse-*;

+

— бенчмарки NYC Taxi, Percona (Spark);

+

— бенчмарк Greenplum;

+

— англоязычный Telegram чат;

+

— встречи и доклады (Париж - февраль, Сан-Франциско - апрель);

+ +
+ +
+

ClickHouse vs. Spark

+

https://www.percona.com/blog/2017/02/13/clickhouse-new-opensource-columnar-database/

+ +
+ +
+

ClickHouse vs. Greenplum

+

+
+ +
+ +

TODO (март-апрель 2017)

+ +

— распределённые DDL запросы;

+

конфиги в ZooKeeper;

+

— полная поддержка NULL;

+ +
+
+ +

TODO (весна-лето 2017)

+ +

— работоспособность ODBC драйвера под Windows;

+

— переделать анализ запроса: правильная поддержка JOIN;

+ +
+ +
+

Сообщество

+

Сайт: https://clickhouse.yandex/

+

Google groups: https://groups.google.com/forum/#!forum/clickhouse

+

Рассылка: clickhouse-feedback@yandex-team.com

+

Telegram чат: https://telegram.me/clickhouse_en and https://telegram.me/clickhouse_ru (уже 500 участников)

+

GitHub: https://github.com/yandex/ClickHouse/

+

 

+

+ встречи. Москва, Санкт-Петербург, Новосибирск... Далее: Екатеринбург, Киев, Минск, Сан-Франциско...

+
+ + +
+

Подключение к ClickHouse

+

HTTP REST

+

clickhouse-client

+

JDBC

+

 

+

Python, PHP, Go, Perl, Ruby, Node.JS, R, .NET

+

 

+

Web UI: https://github.com/smi2/clickhouse-frontend

+
+ +
+

ClickHouse vs. typical row-oriented DBMS

+

Itai Shirav:

«I haven't made a rigorous comparison, but I did convert a time-series table with 9 million rows from Postgres to ClickHouse.

+

Under ClickHouse queries run about 100 times faster, and the table takes 20 times less disk space. Which is pretty amazing if you ask me».

+
+
+

 

+

Bao Dang:

«Obviously, ClickHouse outperformed PostgreSQL at any metric».

+

https://github.com/AnalyticsGo/AnalyticsGo/issues/1

+
+
+

ClickHouse vs. Vertica

+

Timur Shenkao:

«ClickHouse is extremely fast at simple SELECTs without joins, much faster than Vertica».

+
+
+

ClickHouse vs. PrestoDB

+

Ömer Osman Koçak:

+ «When we evaluated ClickHouse the results were great compared to Prestodb. Even though the columnar storage optimizations for ORC and Clickhouse is quite similar, Clickhouse uses CPU and Memory resources more efficiently (Presto also uses vectorized execution but cannot take advantage of hardware level optimizations such as SIMD instruction sets because it's written in Java so that's fair) so we also wanted to add support for Clickhouse for our open-source analytics platform Rakam (https://github.com/rakam-io/rakam)»

+
+
+

ClickHouse vs. Spark

+

«Я потестировал Clickhouse, по скорости просто отлично = намного быстрее spark на одной машине (у меня получилось порядка 3x, но еще буду сравнивать). Кроме того compression получается лучше».

+
+
+

ClickHouse vs. Google BigQuery

+

«ClickHouse показывает сравнимую скорость на таком запросе за 30 дней и в 8 раз быстрее (!) на таком запросе. В планах есть протестировать и другие запросы, еще не добрались.

Скорость выполнения запросов стабильна. В Google BigQuery в период пиковых нагрузок, например в 4:00 p.m. PDT или в начале месяца, время выполнения запросов может заметно увеличиваться».

+
+
+

ClickHouse vs. Druid

+

«В этом году мы развернули сборку на основе Druid — Imply Analytics Platform, а также Tranquility, и уже приготовились запускать в продакшн… Но после выхода ClickHouse сразу отказались от Druid, хотя потратили два месяца на его изучение и внедрение».

+

https://habrahabr.ru/company/smi2/blog/314558/

+
+
+

ClickHouse vs. InfiniDB

+

«结论:clickhouse速度更快!»

+

«In conclusion, ClickHouse is faster!»

+

http://verynull.com/2016/08/22/infinidb与clickhouse对比/

+

+
+
+

ClickHouse for sensor data

+

+
+ +
+ + + diff --git a/doc/presentations/meetup4/pictures/column_oriented.gif b/doc/presentations/meetup4/pictures/column_oriented.gif new file mode 100644 index 00000000000..15f4b12e697 Binary files /dev/null and b/doc/presentations/meetup4/pictures/column_oriented.gif differ diff --git a/doc/presentations/meetup4/pictures/greenplum.png b/doc/presentations/meetup4/pictures/greenplum.png new file mode 100644 index 00000000000..e919a45dadc Binary files /dev/null and b/doc/presentations/meetup4/pictures/greenplum.png differ diff --git a/doc/presentations/meetup4/pictures/infinidb_cn.png b/doc/presentations/meetup4/pictures/infinidb_cn.png new file mode 100644 index 00000000000..957c392a448 Binary files /dev/null and b/doc/presentations/meetup4/pictures/infinidb_cn.png differ diff --git a/doc/presentations/meetup4/pictures/kaspersky.png b/doc/presentations/meetup4/pictures/kaspersky.png new file mode 100644 index 00000000000..f8aae1da9ee Binary files /dev/null and b/doc/presentations/meetup4/pictures/kaspersky.png differ diff --git a/doc/presentations/meetup4/pictures/metrika2.png b/doc/presentations/meetup4/pictures/metrika2.png new file mode 100644 index 00000000000..3ee37e98fc6 Binary files /dev/null and b/doc/presentations/meetup4/pictures/metrika2.png differ diff --git a/doc/presentations/meetup4/pictures/milovidov.jpg b/doc/presentations/meetup4/pictures/milovidov.jpg new file mode 100644 index 00000000000..eb0317f8608 Binary files /dev/null and b/doc/presentations/meetup4/pictures/milovidov.jpg differ diff --git a/doc/presentations/meetup4/pictures/proller.jpg b/doc/presentations/meetup4/pictures/proller.jpg new file mode 100644 index 00000000000..02b1daa1d6c Binary files /dev/null and b/doc/presentations/meetup4/pictures/proller.jpg differ diff --git a/doc/presentations/meetup4/pictures/row_oriented.gif b/doc/presentations/meetup4/pictures/row_oriented.gif new file mode 100644 index 00000000000..53daa20f322 Binary files /dev/null and b/doc/presentations/meetup4/pictures/row_oriented.gif differ diff --git a/doc/presentations/meetup4/pictures/spark.png b/doc/presentations/meetup4/pictures/spark.png new file mode 100644 index 00000000000..3ae61297631 Binary files /dev/null and b/doc/presentations/meetup4/pictures/spark.png differ diff --git a/doc/presentations/meetup4/pictures/stanly.jpg b/doc/presentations/meetup4/pictures/stanly.jpg new file mode 100644 index 00000000000..fb406f156ba Binary files /dev/null and b/doc/presentations/meetup4/pictures/stanly.jpg differ diff --git a/doc/presentations/meetup4/pictures/vludv.jpg b/doc/presentations/meetup4/pictures/vludv.jpg new file mode 100644 index 00000000000..ebe6db87126 Binary files /dev/null and b/doc/presentations/meetup4/pictures/vludv.jpg differ diff --git a/doc/presentations/meetup4/pictures/ztlpn.jpg b/doc/presentations/meetup4/pictures/ztlpn.jpg new file mode 100644 index 00000000000..a2931b91585 Binary files /dev/null and b/doc/presentations/meetup4/pictures/ztlpn.jpg differ diff --git a/doc/presentations/meetup4/shower/shower.min.js b/doc/presentations/meetup4/shower/shower.min.js new file mode 100644 index 00000000000..449843ac45d --- /dev/null +++ b/doc/presentations/meetup4/shower/shower.min.js @@ -0,0 +1,8 @@ +/** + * Core for Shower HTML presentation engine + * shower-core v2.0.7, https://github.com/shower/core + * @copyright 2010–2016 Vadim Makeev, http://pepelsbey.net/ + * @license MIT + */ +!function(a){var b,c={NOT_RESOLVED:"NOT_RESOLVED",IN_RESOLVING:"IN_RESOLVING",RESOLVED:"RESOLVED"},d=function(){var l={trackCircularDependencies:!0,allowMultipleDeclarations:!0},m={},n=!1,o=[],p=function(a,d,e){e||(e=d,d=[]);var f=m[a];f||(f=m[a]={name:a,decl:b}),f.decl={name:a,prev:f.decl,fn:e,state:c.NOT_RESOLVED,deps:d,dependents:[],exports:b}},q=function(b,c,d){"string"==typeof b&&(b=[b]),n||(n=!0,k(v)),o.push({deps:b,cb:function(b,f){f?(d||e)(f):c.apply(a,b)}})},r=function(a){var b=m[a];return b?c[b.decl.state]:"NOT_DEFINED"},s=function(a){return!!m[a]},t=function(a){for(var b in a)a.hasOwnProperty(b)&&(l[b]=a[b])},u=function(){var a,b={};for(var c in m)m.hasOwnProperty(c)&&(a=m[c],(b[a.decl.state]||(b[a.decl.state]=[])).push(c));return b},v=function(){n=!1,w()},w=function(){var a,b=o,c=0;for(o=[];a=b[c++];)x(null,a.deps,[],a.cb)},x=function(a,b,c,d){var e=b.length;e||d([]);for(var g,h,i=[],j=function(a,b){if(b)return void d(null,b);if(!--e){for(var c,f=[],g=0;c=i[g++];)f.push(c.exports);d(f)}},k=0,l=e;k ")+'"')},h=function(a){return Error('Declaration of module "'+a.name+'" has already been provided')},i=function(a){return Error('Multiple declarations of module "'+a.name+'" have been detected')},j=function(a,b){for(var c,d=0;c=b[d++];)if(a===c)return!0;return!1},k=function(){var b=[],c=function(a){return 1===b.push(a)},d=function(){var a=b,c=0,d=b.length;for(b=[];c=0&&!b.defaultPrevented();){var d=a[c];d&&(d.context?d.callback.call(d.context,b):d.callback(b)),c--}}}),a(e)}),shower.modules.define("Plugins",["Emitter","util.extend"],function(a,b,c){function d(a){this.events=new b({context:this}),this._showerGlobal=a,this._showerInstances=a.getInited(),this._plugins={},this._instances=[],a.events.on("init",this._onShowerInit,this)}c(d.prototype,{destroy:function(){this._showerGlobal.events.off("init",this._onShowerInit,this),this._plugins=null},add:function(a,b){if(this._plugins.hasOwnProperty(a))throw new Error("Plugin "+a+" already exist.");return this._requireAndAdd({name:a,options:b}),this},remove:function(a){if(!this._plugins.hasOwnProperty(a))throw new Error("Plugin "+a+" not found.");return delete this._plugins[a],this.events.emit("remove",{name:a}),this},get:function(a,b){var c,d=this._plugins[a];if(d&&b)for(var e=0,f=this._instances.length;e=0;e--)if(d[e].getId()===a){b=d[e],c=e;break}return{slide:b,index:c}},_onSlideActivate:function(a){window.location.hash=a.get("slide").getId(),this._setTitle()},_onContainerSlideModeChange:function(){this._setTitle(),this.save()},_isSlideMode:function(){return this._shower.container.isSlideMode()},_onPopstate:function(){var a,b=this._shower,c=window.location.hash.substr(1),d=b.player.getCurrentSlide(),e=b.player.getCurrentSlideIndex();this._isSlideMode()&&e===-1?b.player.go(0):e===-1&&""!==window.location.hash&&b.player.go(0),d&&c!==d.getId()&&(a=this._getSlideById(c),b.player.go(a.index))},_setTitle:function(){var a=document.title,b=this._isSlideMode(),c=this._shower.player.getCurrentSlide();if(b&&c){var d=c.getTitle();document.title=d?d+" — "+this._documentTitle:this._documentTitle}else this._documentTitle!==a&&(document.title=this._documentTitle)}}),a(e)}),shower.modules.define("shower.Player",["Emitter","util.bound","util.extend"],function(a,b,c,d){function e(a){this.events=new b({context:this,parent:a.events}),this._shower=a,this._showerListeners=null,this._playerListeners=null,this._currentSlideNumber=-1,this._currentSlide=null,this.init()}d(e.prototype,{init:function(){this._showerListeners=this._shower.events.group().on("slideadd",this._onSlideAdd,this).on("slideremove",this._onSlideRemove,this).on("slidemodeenter",this._onSlideModeEnter,this),this._playerListeners=this.events.group().on("prev",this._onPrev,this).on("next",this._onNext,this),document.addEventListener("keydown",c(this,"_onKeyDown"))},destroy:function(){this._showerListeners.offAll(),this._playerListeners.offAll(),document.removeEventListener("keydown",c(this,"_onKeyDown")),this._currentSlide=null,this._currentSlideNumber=null,this._shower=null},next:function(){return this.events.emit("next"),this},prev:function(){return this.events.emit("prev"),this},first:function(){return this.go(0),this},last:function(){return this.go(this._shower.getSlidesCount()-1),this},go:function(a){"number"!=typeof a&&(a=this._shower.getSlideIndex(a));var b=this._shower.getSlidesCount(),c=this._currentSlide;return a!=this._currentSlideNumber&&a=0&&(c&&c.isActive()&&c.deactivate(),c=this._shower.get(a),this._currentSlide=c,this._currentSlideNumber=a,c.isActive()||c.activate(),this.events.emit("activate",{index:a,slide:c})),this},getCurrentSlide:function(){return this._currentSlide},getCurrentSlideIndex:function(){return this._currentSlideNumber},_onPrev:function(){this._changeSlide(this._currentSlideNumber-1)},_onNext:function(){this._changeSlide(this._currentSlideNumber+1)},_changeSlide:function(a){this.go(a)},_onSlideAdd:function(a){var b=a.get("slide");b.events.on("activate",this._onSlideActivate,this)},_onSlideRemove:function(a){var b=a.get("slide");b.events.off("activate",this._onSlideActivate,this)},_onSlideActivate:function(a){var b=a.get("slide"),c=this._shower.getSlideIndex(b);this.go(c)},_onKeyDown:function(a){if(this._shower.isHotkeysEnabled()&&!/^(?:button|input|select|textarea)$/i.test(a.target.tagName))switch(this.events.emit("keydown",{event:a}),a.which){case 33:case 38:case 37:case 72:case 75:if(a.altKey||a.ctrlKey||a.metaKey)return;a.preventDefault(),this.prev();break;case 34:case 40:case 39:case 76:case 74:if(a.altKey||a.ctrlKey||a.metaKey)return;a.preventDefault(),this.next();break;case 36:a.preventDefault(),this.first();break;case 35:a.preventDefault(),this.last();break;case 32:this._shower.container.isSlideMode()&&(a.shiftKey?this.prev():this.next())}},_onSlideModeEnter:function(){this._currentSlide||this.go(0)}}),a(e)}),shower.modules.define("shower.slidesParser",["Slide"],function(a,b){function c(a,c){var d=a.querySelectorAll(c);return d=Array.prototype.slice.call(d),d.map(function(a,c){var d=new b(a);return a.id||(a.id=c+1),d})}a(c)}),shower.modules.define("Slide",["shower.defaultOptions","Emitter","Options","slide.Layout","slide.layoutFactory","util.Store","util.extend"],function(a,b,c,d,e,f,g,h){function i(a,b,e){this.events=new c,this.options=new d(b),this.layout=null,this.state=new g({visited:0,index:null},e),this._content=a,this._isVisited=this.state.get("visited")>0,this._isActive=!1,this.init()}h(i.prototype,{init:function(){this.layout="string"==typeof this._content?new f.createLayout({content:this._content}):new e(this._content,this.options),this.layout.setParent(this),this._setupListeners()},destroy:function(){this._clearListeners(),this._isActive=null,this.options=null,this.layout.destroy()},activate:function(){this._isActive=!0;var a=this.state.get("visited");return this.state.set("visited",++a),this.events.emit("activate",{slide:this}),this},deactivate:function(){return this._isActive=!1,this.events.emit("deactivate",{slide:this}),this},isActive:function(){return this._isActive},isVisited:function(){return this.state.get("visited")>0},getTitle:function(){return this.layout.getTitle()},setTitle:function(a){return this.layout.setTitle(a),this},getId:function(){return this.layout.getElement().id},getContent:function(){return this.layout.getContent()},_setupListeners:function(){this.layoutListeners=this.layout.events.group().on("click",this._onSlideClick,this)},_clearListeners:function(){this.layoutListeners.offAll()},_onSlideClick:function(){this.activate(),this.events.emit("click",{slide:this})}}),a(i)}),shower.modules.define("slide.Layout",["Options","shower.defaultOptions","Emitter","util.bound","util.extend"],function(a,b,c,d,e,f){function g(a,e){this.options=new b({title_element_selector:c.slide_title_element_selector,active_classname:c.slide_active_classname,visited_classname:c.slide_visited_classname},e),this.events=new d,this._element=a,this._parent=null,this._parentElement=null,this.init()}f(g.prototype,{init:function(){var a=this._element.parentNode;a?this._parentElement=a:this.setParentElement(a)},destroy:function(){this.setParent(null)},setParent:function(a){this._parent!=a&&(this._clearListeners(),this._parent=a,this._parent&&this._setupListeners(),this.events.emit("parentchange",{parent:a}))},getParent:function(){return this._parent},setParentElement:function(a){a!=this._parentElement&&(this._parentElement=a,a.appendChild(this._element),this.events.emit("parentelementchange",{parentElement:a}))},getParentElement:function(){return this._parentElement},getElement:function(){return this._element},setTitle:function(a){var b=this.options.get("title_element_selector"),c=this._element.querySelector(b);c?c.innerHTML=a:(c=document.createElement(b),c.innerHTML=a,this._element.insertBefore(c,this._element.firstChild))},getTitle:function(){var a=this.options.get("title_element_selector"),b=this._element.querySelector(a);return b?b.textContent:null},getData:function(a){var b=this._element;return b.dataset?b.dataset[a]:b.getAttribute("data-"+a)},getContent:function(){return this._element.innerHTML},_setupListeners:function(){this._slideListeners=this._parent.events.group().on("activate",this._onSlideActivate,this).on("deactivate",this._onSlideDeactivate,this),this._element.addEventListener("click",e(this,"_onSlideClick"),!1)},_clearListeners:function(){this._slideListeners&&this._slideListeners.offAll(),this._element.removeEventListener("click",e(this,"_onSlideClick"))},_onSlideActivate:function(){this._element.classList.add(this.options.get("active_classname"))},_onSlideDeactivate:function(){var a=this._element.classList;a.remove(this.options.get("active_classname")),a.add(this.options.get("visited_classname"))},_onSlideClick:function(){this.events.emit("click")}}),a(g)}),shower.modules.define("slide.layoutFactory",["slide.Layout","util.extend"],function(a,b,c){var d={};c(d,{createLayout:function(a){a=a||{};var e=d._createElement(c({content:"",contentType:"slide"},a));return new b(e)},_createElement:function(a){var b=document.createElement("section");return b.innerHTML=a.content,b.classList.add(a.contentType),b}}),a(d)}),shower.modules.define("util.bound",function(a){function b(a,b){return a["__bound_"+b]||(a["__bound_"+b]=a[b].bind(a))}a(b)}),shower.modules.define("util.extend",function(a){function b(a){if(!a)throw new Error("util.extend: Target not found");return"undefined"==typeof Object.assign?c.apply(null,arguments):Object.assign.apply(null,arguments)}function c(a){for(var b=1,c=arguments.length;b0&&(a.preventDefault(),this.prev())},_go:function(){for(var a=0,b=this._elements.length;awindow.innerWidth/2?c.player.next():c.player.prev()),d||f.activate())},_onTouchMove:function(a){this._shower.container.isSlideMode()&&a.preventDefault()},_getSlideByElement:function(a){for(var b=this._shower.getSlides(),c=null,d=0,e=b.length;d` of your presentation. + +## PDF + +Ribbon could be exported to PDF by printing it from the list mode in Chrome or Opera browsers. See [printing documentation](https://github.com/shower/shower/blob/master/docs/printing-en.md) for more options. + +## Development + +If you want to adjust theme for your needs: + +1. Fork this repository and clone it to your local machine. +2. Install dependencies: `npm install`. +3. Start a local server with watcher: `npm run dev` or just `gulp` if you have it installed globally. +4. Edit your files and see changes in the opened browser. + +To take part in Ribbon development please read [contributing guidelines](CONTRIBUTING.md) first and [file an issue](https://github.com/shower/shower/issues/new) before sending any pull request. + +--- +Licensed under [MIT License](LICENSE.md). diff --git a/doc/presentations/meetup4/shower/themes/ribbon/index.html b/doc/presentations/meetup4/shower/themes/ribbon/index.html new file mode 100644 index 00000000000..02ad835e8a8 --- /dev/null +++ b/doc/presentations/meetup4/shower/themes/ribbon/index.html @@ -0,0 +1,304 @@ + + + + Ribbon theme for Shower + + + + + + +
+

Presentation Title

+

Yours Truly, Famous Inc.

+
+
+

Slide Header

+

Echo Park 8-bit sustainable umami deep v Kickstarter. DIY cliche typewriter brunch, Odd Future sriracha pickled aesthetic. Farm-to-table bespoke fingerstache, kale chips umami brunch letterpress.

+

Whatever authentic disrupt, you probably haven't heard of them direct trade mlkshk Etsy. Gluten-free roof party plaid four loko quinoa.

+

Echo Park 8-bit sustainable umami deep v Kickstarter.

+
+
+

Inline Elements

+

Retro meh brunch aesthetic Cosby sweater Shoreditch. Banksy Tumblr sriracha, flexitarian pug chia master cleanse vinyl wayfarers fanny pack bespoke Helvetica roof party. Messenger bag retro cred Portland next level. Yr stumptown Schlitz Carles deep v small batch. Hella sustainable messenger bag, leggings skateboard literally1 bicycle rights H20 mumblecore banh mi DIY VHS. Semiotics four loko street art asymmetrical. Asymmetrical <paleo> you probably haven’t heard of.

+
+

Retro meh brunch aesthetic Cosby sweater Shoreditch. Banksy Tumblr sriracha, flexitarian pug chia master cleanse vinyl wayfarers fanny pack bespoke Helvetica roof party. Messenger bag retro cred Portland next level. Yr stumptown Schlitz Carles deep v small batch. Hella sustainable messenger bag, leggings skateboard literally1 bicycle rights H20 mumblecore banh mi DIY VHS. Semiotics four loko street art asymmetrical. Asymmetrical <paleo> you probably haven’t heard of.

+
+
+
+

Quotes

+
+

Flannel bicycle rights locavore selfies skateboard. Authentic fanny pack paleo four loko bespoke. Artisan tattooed chia XOXO ennui, lomo disrupt 8-bit art party Tumblr scenester.

+
+
+
+

Post-ironic fashion axe flexitarian, Tonx narwhal messenger bag Tumblr. Portland gentrify deep v kale chips literally.

+
+
Yours Truly
+
+
+
+

Nested Lists

+
    +
  1. Literally viral vegan, ugh drinking vinegar photo booth
  2. +
  3. Wes Anderson chillwave Marfa pour-over Etsy banh mi
  4. +
  5. Ethnic polaroid lo-fi iPhone ennui +
      +
    • Yr wayfarers before they sold out Kickstarter asymmetrical
    • +
    • Irony flexitarian readymade quinoa, kogi bespoke meggings narwhal
    • +
    • Skateboard Etsy twee artisan Echo Park
    • +
    +
  6. +
  7. Tonx kitsch fingerstache readymade, retro single-origin coffee
  8. +
+
+
+

Block Lists

+
    +
  • Retro meh brunch aesthetic Cosby sweater Shoreditch. Banksy Tumblr sriracha, flexitarian pug chia master cleanse vinyl wayfarers fanny pack.
  • +
  • Messenger bag retro cred Portland next level. Yr stumptown Schlitz Carles deep v small batch. Hella sustainable messenger bag.
  • +
  • Leggings skateboard literally1 bicycle rights H20 mumblecore banh mi DIY VHS. Semiotics four loko street art asymmetrical. Asymmetrical paleo you probably haven’t heard of.
  • +
+
+
+

Latin and Cyrillic List Bullets

+
    +
  • Occupy locavore blog, mustache you probably haven't heard of them
  • +
  • Skateboard pork belly aesthetic hoodie selfies brunch
  • +
  • Food truck gluten-free disrupt Portland
  • +
+
    +
  • Helvetica narwhal drinking vinegar chillwave, post-ironic ennui
  • +
  • Cray pug paleo retro, Echo Park narwhal Wes Anderson
  • +
  • Disrupt Williamsburg fixie, shabby chic bicycle rights hashtag kogi
  • +
+
+
+

Two Columns

+

Echo Park 8-bit sustainable umami deep v Kickstarter. DIY cliche typewriter brunch, Odd Future sriracha pickled aesthetic. Farm-to-table bespoke fingerstache, kale chips umami brunch American Apparel letterpress. Whatever authentic disrupt, you probably haven't heard of them direct trade mlkshk Etsy. Gluten-free roof party plaid American Apparel four loko quinoa. Echo Park 8-bit sustainable.

+
+
+

Three Columns

+

Echo Park 8-bit sustainable umami deep v Kickstarter. DIY cliche typewriter brunch, Odd Future sriracha pickled aesthetic. Farm-to-table bespoke fingerstache, kale chips umami brunch American Apparel letterpress. Whatever authentic disrupt, you probably haven't heard of them direct trade mlkshk Etsy. Gluten-free roof party plaid American Apparel four loko quinoa. Echo Park 8-bit sustainable.

+
+
+

Simple Table

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
GentrifyTweeArtisanBanksy
MessengerMixtapeSmall batchBicycle rights
MeggingsFreeganRetro biodieselSlow-carb
VeganOccupyNormcorePut a bird on it
Next levelSelfiesSustainableOrganic
UmamiAsymmetricalKeytarCraft beer
BiodieselHaven’t heardSkateboardFarm-to-table
+
+
+

Striped Table

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
GentrifyTweeArtisanBanksy
MessengerMixtapeSmall batchBicycle rights
MeggingsFreeganRetro biodieselSlow-carb
VeganOccupyNormcorePut a bird on it
Next levelSelfiesSustainableOrganic
UmamiAsymmetricalKeytarCraft beer
BiodieselHaven’t heardSkateboardFarm-to-table
+
+
+

Plain Code Listing

+
<html lang="en">
+<head> <!--Comment-->
+	<title>Shower</title>
+	<meta charset="UTF-8">
+	<link rel="stylesheet" href="screen.css">
+	<script src="script.js"></script>
+</head>
+
+
+

Numbered Code Listing

+
+			<html lang="en">
+			<head> <!--Comment-->
+				<title>Shower</title>
+				<meta charset="UTF-8">
+				<link rel="stylesheet" href="screen.css">
+				<script src="script.js"></script>
+			</head>
+		
+
+
+

Highlighted Code Lines

+
+			<html lang="en">
+			<head> <!--Comment-->
+				<title>Shower</title>
+				<meta charset="UTF-8">
+				<link rel="stylesheet" href="screen.css">
+				<script src="script.js"></script>
+			</head>
+		
+
+
+

Hidden Code Steps

+
+			<html lang="en">
+			<head> <!--Comment-->
+				<title>Shower</title>
+				<meta charset="UTF-8">
+				<link rel="stylesheet" href="screen.css">
+				<script src="script.js"></script>
+			</head>
+		
+
+
+

Highlighted Code Steps

+
+			<html lang="en">
+			<head> <!--Comment-->
+				<title>Shower</title>
+				<meta charset="UTF-8">
+				<link rel="stylesheet" href="screen.css">
+				<script src="script.js"></script>
+			</head>
+		
+
+
+

Grid Slide

+
+
+

White Slide

+
+
+

Black Slide

+
+
+

Shout

+
+
+

Multiline
Shout

+
+
+

Linked Shout

+
+
+

Growing Shout

+
+
+

Shrinking Shout

+
+
+
+ +
Copyright © 2016 Yours Truly, Famous Inc.
+
+
+
+ +
+
+ +
+
+ + + + + + + + + +
+
+

Timer

+
+
+

List Navigation

+
    +
  1. Ennui keffiyeh thundercats
  2. + + + + +
+

Before they sold out master

+
+
+ + + + + diff --git a/doc/presentations/meetup4/shower/themes/ribbon/pictures/canvas.png b/doc/presentations/meetup4/shower/themes/ribbon/pictures/canvas.png new file mode 100644 index 00000000000..6ddd30154f2 Binary files /dev/null and b/doc/presentations/meetup4/shower/themes/ribbon/pictures/canvas.png differ diff --git a/doc/presentations/meetup4/shower/themes/ribbon/pictures/exact.png b/doc/presentations/meetup4/shower/themes/ribbon/pictures/exact.png new file mode 100644 index 00000000000..b27251c57cb Binary files /dev/null and b/doc/presentations/meetup4/shower/themes/ribbon/pictures/exact.png differ diff --git a/doc/presentations/meetup4/shower/themes/ribbon/pictures/square.png b/doc/presentations/meetup4/shower/themes/ribbon/pictures/square.png new file mode 100644 index 00000000000..62cb2384a5f Binary files /dev/null and b/doc/presentations/meetup4/shower/themes/ribbon/pictures/square.png differ diff --git a/doc/presentations/meetup4/shower/themes/ribbon/pictures/tall.png b/doc/presentations/meetup4/shower/themes/ribbon/pictures/tall.png new file mode 100644 index 00000000000..fbc9f09a2ab Binary files /dev/null and b/doc/presentations/meetup4/shower/themes/ribbon/pictures/tall.png differ diff --git a/doc/presentations/meetup4/shower/themes/ribbon/pictures/wide.png b/doc/presentations/meetup4/shower/themes/ribbon/pictures/wide.png new file mode 100644 index 00000000000..1e83b0ac7ad Binary files /dev/null and b/doc/presentations/meetup4/shower/themes/ribbon/pictures/wide.png differ diff --git a/doc/presentations/meetup4/shower/themes/ribbon/styles/presentation_links.html b/doc/presentations/meetup4/shower/themes/ribbon/styles/presentation_links.html new file mode 100644 index 00000000000..74981d8eac5 --- /dev/null +++ b/doc/presentations/meetup4/shower/themes/ribbon/styles/presentation_links.html @@ -0,0 +1,2 @@ +http://www.slideshare.net/AlexeyMilovidov1/clickhouse-69616890/AlexeyMilovidov1/clickhouse-69616890 +file:///home/milovidov/work/Presentation/shower/index.html#cover diff --git a/doc/presentations/meetup4/shower/themes/ribbon/styles/screen-16x10.css b/doc/presentations/meetup4/shower/themes/ribbon/styles/screen-16x10.css new file mode 100644 index 00000000000..d21f190feea --- /dev/null +++ b/doc/presentations/meetup4/shower/themes/ribbon/styles/screen-16x10.css @@ -0,0 +1,204 @@ +/** + * Ribbon theme for Shower HTML presentation engine + * shower-ribbon v2.0.8, https://github.com/shower/ribbon + * @copyright 2010–2016 Vadim Makeev, http://pepelsbey.net/ + * @license MIT + */ +@charset "UTF-8"; + + @font-face { + font-family: 'Yandex Sans Text Web'; + src: url(https://yastatic.net/adv-www/_/yy5JveR58JFkc97waf-xp0i6_jM.eot); + src: url(https://yastatic.net/adv-www/_/yy5JveR58JFkc97waf-xp0i6_jM.eot?#iefix) format('embedded-opentype'), + url(https://yastatic.net/adv-www/_/CYblzLEXzCqQIvrYs7QKQe2omRk.woff2) format('woff2'), + url(https://yastatic.net/adv-www/_/pUcnOdRwl83MvPPzrNomhyletnA.woff) format('woff'), + url(https://yastatic.net/adv-www/_/vNFEmXOcGYKJ4AAidUprHWoXrLU.ttf) format('truetype'), + url(https://yastatic.net/adv-www/_/0w7OcWZM_QLP8x-LQUXFOgXO6dE.svg#YandexSansTextWeb-Bold) format('svg'); + font-weight: 700; + font-style: normal; + font-stretch: normal + } + + @font-face { + font-family: 'Yandex Sans Text Web'; + src: url(https://yastatic.net/adv-www/_/LI6l3L2RqcgxBe2pXmuUha37czQ.eot); + src: url(https://yastatic.net/adv-www/_/LI6l3L2RqcgxBe2pXmuUha37czQ.eot?#iefix) format('embedded-opentype'), + url(https://yastatic.net/adv-www/_/z3MYElcut0R2MF_Iw1RDNrstgYs.woff2) format('woff2'), + url(https://yastatic.net/adv-www/_/1jvKJ_-hCXl3s7gmFl-y_-UHTaI.woff) format('woff'), + url(https://yastatic.net/adv-www/_/9nzjfpCR2QHvK1EzHpDEIoVFGuY.ttf) format('truetype'), + url(https://yastatic.net/adv-www/_/gwyBTpxSwkFCF1looxqs6JokKls.svg#YandexSansTextWeb-Regular) format('svg'); + font-weight: 400; + font-style: normal; + font-stretch: normal + } + + @font-face { + font-family: 'Yandex Sans Text Web'; + src: url(https://yastatic.net/adv-www/_/ayAFYoY8swgBLhq_I56tKj2JftU.eot); + src: url(https://yastatic.net/adv-www/_/ayAFYoY8swgBLhq_I56tKj2JftU.eot?#iefix) format('embedded-opentype'), + url(https://yastatic.net/adv-www/_/lGQcYklLVV0hyvz1HFmFsUTj8_0.woff2) format('woff2'), + url(https://yastatic.net/adv-www/_/f0AAJ9GJ4iiwEmhG-7PWMHk6vUY.woff) format('woff'), + url(https://yastatic.net/adv-www/_/4UDe4nlVvgEJ-VmLWNVq3SxCsA.ttf) format('truetype'), + url(https://yastatic.net/adv-www/_/EKLr1STNokPqxLAQa_RyN82pL98.svg#YandexSansTextWeb-Light) format('svg'); + font-weight: 300; + font-style: normal; + font-stretch: normal + } + + @font-face { + font-family: 'Yandex Sans Display Web'; + src: url(https://yastatic.net/adv-www/_/H63jN0veW07XQUIA2317lr9UIm8.eot); + src: url(https://yastatic.net/adv-www/_/H63jN0veW07XQUIA2317lr9UIm8.eot?#iefix) format('embedded-opentype'), + url(https://yastatic.net/adv-www/_/sUYVCPUAQE7ExrvMS7FoISoO83s.woff2) format('woff2'), + url(https://yastatic.net/adv-www/_/v2Sve_obH3rKm6rKrtSQpf-eB7U.woff) format('woff'), + url(https://yastatic.net/adv-www/_/PzD8hWLMunow5i3RfJ6WQJAL7aI.ttf) format('truetype'), + url(https://yastatic.net/adv-www/_/lF_KG5g4tpQNlYIgA0e77fBSZ5s.svg#YandexSansDisplayWeb-Regular) format('svg'); + font-weight: 400; + font-style: normal; + font-stretch: normal + } + + @font-face { + font-family: 'Yandex Sans Display Web'; + src: url(https://yastatic.net/adv-www/_/g8_MyyKVquSZ3xEL6tarK__V9Vw.eot); + src: url(https://yastatic.net/adv-www/_/g8_MyyKVquSZ3xEL6tarK__V9Vw.eot?#iefix) format('embedded-opentype'), + url(https://yastatic.net/adv-www/_/LGiRvlfqQHlWR9YKLhsw5e7KGNA.woff2) format('woff2'), + url(https://yastatic.net/adv-www/_/40vXwNl4eYYMgteIVgLP49dwmfc.woff) format('woff'), + url(https://yastatic.net/adv-www/_/X6zG5x_wO8-AtwJ-vDLJcKC5228.ttf) format('truetype'), + url(https://yastatic.net/adv-www/_/ZKhaR0m08c8CRRL77GtFKoHcLYA.svg#YandexSansDisplayWeb-Light) format('svg'); + font-weight: 300; + font-style: normal; + font-stretch: normal + } + +*,::after,::before{box-sizing:border-box} +a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline} +article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block} +.caption p,body{line-height:1} +p {line-height: 1} +ol,ul{list-style:none} +blockquote,q{quotes:none} +blockquote::after,blockquote::before,q::after,q::before{content:none} +table{border-collapse:collapse;border-spacing:0} +a{text-decoration:none} +@page{margin:0;size:1280px 720px} +.shower{color:#000;counter-reset:slide;font:25px/2 Yandex Sans Display Web,sans-serif;-webkit-print-color-adjust:exact;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none} +@media print{.shower{text-rendering:geometricPrecision} +} +.caption{font-size:25px;display:none;margin-top:-.2em;padding:0 1em .93em;width:100%;color:#3c3d40;text-shadow:0 1px 0 #8d8e90} +@media (min-width:1174px){.caption{font-size:50px} +} +@media (min-width:2348px){.caption{font-size:100px} +} +.caption h1{padding-bottom:.15em;font:1em/2 Yandex Sans Display Web,sans-serif} +.caption p{font-size:.6em} +.caption a{color:#4b86c2;text-shadow:0 -1px 0 #1f3f60} +.slide{position:relative;z-index:1;overflow:hidden;padding:20px 100px 0;width:1024px;height:640px;background:#fff;font-size:25px} + +/*.slide::after{position:absolute;top:0;right:100px;padding-top:15px;width:50px;height:100px;background:url(../images/ribbon.svg) no-repeat;color:#fff;counter-increment:slide;content:counter(slide);text-align:center}*/ + +.slide h1{vertical-align:middle; color:#000;font:400 50px/2 Yandex Sans Display Web,sans-serif} +.slide h2{margin-bottom:34px;color:#000;font:400 50px/2 Yandex Sans Display Web,sans-serif} +.slide p{margin-bottom:1em} +.slide p.note{color:#979a9e} +.slide a{background:-webkit-linear-gradient(bottom,currentColor .09em,transparent .09em) repeat-x;background:linear-gradient(to top,currentColor .09em,transparent .09em) repeat-x;color:#4b86c2} +.slide b,.slide strong{font-weight:700} +.slide blockquote,.slide dfn,.slide em,.slide i{font-style:italic} +.slide code,.slide kbd,.slide mark,.slide samp{padding:.1em .3em;border-radius:.2em} +.slide code,.slide kbd,.slide samp{background:rgba(88,90,94,.1);line-height:1;font-family:PT Mono,monospace,monospace} +.slide mark{background:#fafaa2} +.slide sub,.slide sup{position:relative;line-height:0;font-size:75%} +.slide sub{bottom:-.25em} +.slide sup{top:-.5em} +.slide blockquote::before{position:absolute;margin:-.15em 0 0 -.43em;color:#ccc;line-height:1;font-size:8em;content:'\201C'} +.slide blockquote+figcaption{margin:-1em 0 1em;font-style:italic;font-weight:700} +.slide ol,.slide ul{margin-bottom:0em;counter-reset:list} +.slide ol li,.slide ul li{page-break-inside:avoid;text-indent:-2em} +.slide ol li::before,.slide ul li::before{display:inline-block;width:2em;color:#979a9e;text-align:right} +.slide ol ol,.slide ol ul,.slide ul ol,.slide ul ul{margin-bottom:0;margin-left:2em} +.slide ul>li::before{padding-right:.5em;content:'•'} +.slide ul>li:lang(ru)::before{content:'—'} +.slide ol>li::before{padding-right:.4em;counter-increment:list;content:counter(list) "."} +.slide table{margin-left:-100px;margin-bottom:1em;width:calc(100% + 100px + 100px)} +.slide table td:first-child,.slide table th:first-child{padding-left:96px} +.slide table td:last-child,.slide table th:last-child{padding-right:96px} +.slide table th{text-align:left;font-weight:700} +.slide table tr:not(:last-of-type)>*{background:-webkit-linear-gradient(bottom,rgba(88,90,94,.5) .055em,transparent .055em) repeat-x;background:linear-gradient(to top,rgba(88,90,94,.5) .055em,transparent .055em) repeat-x} +.slide table.striped tr:nth-child(even){background:rgba(88,90,94,.1)} +.slide table.striped tr>*{background-image:none} +.slide pre{margin-bottom:1em;counter-reset:code;white-space:normal} +.slide pre code{display:block;margin-left:-100px;padding:0 0 0 100px;width:calc(100% + 100px + 100px);border-radius:0;background:0 0;line-height:2;white-space:pre;-moz-tab-size:4;-o-tab-size:4;tab-size:4} +.slide pre code:not(:only-child).mark{background:rgba(88,90,94,.1)} +.slide pre code:not(:only-child)::before{position:absolute;margin-left:-2em;color:#979a9e;counter-increment:code;content:counter(code,decimal-leading-zero) "."} +.slide pre mark{position:relative;z-index:-1;margin:0 -.3em} +.slide pre mark.important{background:#c00;color:#fff} +.slide pre .comment{color:#999} +.slide footer{position:absolute;right:0;bottom:-640px;left:0;display:none;padding:41px 100px 8px;background:#fbfbba;box-shadow:0 1px 0 #fafaa2 inset;-webkit-transition:bottom .3s;transition:bottom .3s} +.slide footer mark{background:rgba(255,255,255,.8)} +.slide:hover>footer{bottom:0} +.slide.grid{background-image:url(../images/grid.png);-ms-interpolation-mode:nearest-neighbor;image-rendering:-webkit-optimize-contrast;image-rendering:-moz-crisp-edges;image-rendering:pixelated} +@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.slide.grid{background-image:url(../images/grid@2x.png);background-size:1024px auto} +} +.slide.black{background-color:#000} +.slide.black::after,.slide.white::after{visibility:hidden} +.slide.white{background-color:#fff} +.slide .double,.slide .triple{-webkit-column-gap:75px;-moz-column-gap:75px;column-gap:75px;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto} +.slide .double{-webkit-column-count:2;-moz-column-count:2;column-count:2} +.slide .triple{-webkit-column-count:3;-moz-column-count:3;column-count:3} +.slide .shout{position:absolute;top:50%;left:0;width:100%;text-align:center;line-height:1;font-size:150px;-webkit-transform:translateY(-50%);transform:translateY(-50%)} +.slide .shout a{background:-webkit-linear-gradient(bottom,currentColor .11em,transparent .11em) repeat-x;background:linear-gradient(to top,currentColor .11em,transparent .11em) repeat-x} +.slide .cover{z-index:-1;max-width:100%;max-height:100%} +.slide .cover.w,.slide .cover.width{width:100%;max-height:none} +.slide .cover.h,.slide .cover.height{height:100%;max-width:none} +.slide .cover+figcaption{position:absolute;bottom:20px;right:10px;font-size:12px;opacity:.7;-webkit-transform-origin:0 100%;transform-origin:0 100%;-webkit-transform:translateX(100%) rotate(-90deg);transform:translateX(100%) rotate(-90deg)} +.slide .cover+figcaption.white{color:#fff} +.slide .cover+figcaption a{color:currentcolor} +.slide .cover,.slide .place{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)} +.slide .place.b.l,.slide .place.b.r,.slide .place.bottom.left,.slide .place.bottom.right,.slide .place.t.l,.slide .place.t.r,.slide .place.top.left,.slide .place.top.right{-webkit-transform:none;transform:none} +.slide .place.b,.slide .place.bottom,.slide .place.t,.slide .place.top{-webkit-transform:translate(-50%,0);transform:translate(-50%,0)} +.slide .place.l,.slide .place.left,.slide .place.r,.slide .place.right{-webkit-transform:translate(0,-50%);transform:translate(0,-50%)} +.slide .place.t,.slide .place.t.r,.slide .place.top,.slide .place.top.left,.slide .place.top.right{top:0} +.slide .place.r,.slide .place.right{right:0;left:auto} +.slide .place.b,.slide .place.b.l,.slide .place.b.r,.slide .place.bottom,.slide .place.bottom.left,.slide .place.bottom.right{top:auto;bottom:0} +.slide .place.l,.slide .place.left{left:0} +.progress{left:-20px;bottom:0;z-index:1;display:none;width:0;height:0;box-sizing:content-box;border:10px solid #4b86c2;border-right-color:transparent;-webkit-transition:width .2s linear;transition:width .2s linear;clip:rect(10px,1044px,20px,20px)} +.progress[style*='100%']{padding-left:10px} +.badge,.badge a,.progress{position:absolute} +.badge{font-size:10px;top:0;z-index:1;overflow:hidden;display:none;width:9em;height:9em;right:0;visibility:hidden} +@media (min-width:1174px){.badge{font-size:20px} +} +@media (min-width:2348px){.badge{font-size:40px} +} +.badge a{right:-50%;bottom:50%;left:-50%;visibility:visible;background:#4b86c2;color:#fff;text-align:center;line-height:2;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transform:rotate(45deg);transform:rotate(45deg)} +.region{display:none} +@media screen{.shower.list{padding-top:25px;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;background:#585a5e;position:absolute;clip:rect(0,auto,auto,0)} +} +@media screen and (min-width:1174px){.shower.list{padding-top:50px} +} +@media screen and (min-width:2348px){.shower.list{padding-top:100px} +} +@media screen{.shower.list .caption{display:block} +.shower.list .slide{-webkit-transform-origin:0 0;transform-origin:0 0;margin:0 -768px -455px 25px;-webkit-transform:scale(.25);transform:scale(.25);border-radius:2px;box-shadow:0 20px 50px rgba(0,0,0,.3)} +} +@media screen and (min-width:1174px){.shower.list .slide{margin:0 -512px -270px 50px;-webkit-transform:scale(.5);transform:scale(.5)} +} +@media screen and (min-width:2348px){.shower.list .slide{margin:0 0 100px 100px;-webkit-transform:scale(1);transform:scale(1)} +} +@media screen{.shower.list .slide:hover{box-shadow:0 0 0 20px rgba(0,0,0,.1),0 20px 50px rgba(0,0,0,.3)} +.shower.list .slide:target{box-shadow:0 0 0 1px #376da3,0 0 0 20px #4b86c2,0 20px 50px rgba(0,0,0,.3)} +.shower.list .slide *{pointer-events:none} +.shower.list .badge,.shower.list .slide footer{display:block} +.shower.full{position:absolute;top:50%;left:50%;overflow:hidden;margin:-320px 0 0 -512px;width:1024px;height:640px;background:#000} +.shower.full .slide{position:absolute;top:0;left:0;margin-left:-150%;visibility:hidden} +.shower.full .slide:target{margin:0;visibility:visible} +.shower.full .slide pre code:not(:only-child).mark.next{visibility:visible;background:0 0} +.shower.full .slide pre code:not(:only-child).mark.next.active{background:rgba(88,90,94,.1)} +.shower.full .slide .next{visibility:hidden} +.shower.full .slide .next.active{visibility:visible} +.shower.full .slide .shout.grow,.shower.full .slide .shout.shrink{opacity:0;-webkit-transition:.4s ease-out;transition:.4s ease-out;-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform} +.shower.full .slide .shout.grow{-webkit-transform:scale(.1) translateY(-50%);transform:scale(.1) translateY(-50%)} +.shower.full .slide .shout.shrink{-webkit-transform:scale(10) translateY(-50%);transform:scale(10) translateY(-50%)} +.shower.full .slide:target .shout.grow,.shower.full .slide:target .shout.shrink{opacity:1;-webkit-transform:scale(1) translateY(-50%);transform:scale(1) translateY(-50%)} +.shower.full .progress{display:block;-webkit-transform:translateZ(0);transform:translateZ(0)} +.shower.full .region{position:absolute;clip:rect(0 0 0 0);overflow:hidden;margin:-1px;padding:0;width:1px;height:1px;border:none;display:block} +} diff --git a/doc/presentations/meetup4/shower/themes/ribbon/styles/screen-4x3.css b/doc/presentations/meetup4/shower/themes/ribbon/styles/screen-4x3.css new file mode 100644 index 00000000000..6648b972c30 --- /dev/null +++ b/doc/presentations/meetup4/shower/themes/ribbon/styles/screen-4x3.css @@ -0,0 +1,7 @@ +/** + * Ribbon theme for Shower HTML presentation engine + * shower-ribbon v2.0.8, https://github.com/shower/ribbon + * @copyright 2010–2016 Vadim Makeev, http://pepelsbey.net/ + * @license MIT + */ +@charset "UTF-8";@font-face{font-family:PT Sans;src:url(../fonts/pt-sans-regular.woff) format("woff")}@font-face{font-weight:700;font-family:PT Sans;src:url(../fonts/pt-sans-bold.woff) format("woff")}@font-face{font-style:italic;font-family:PT Sans;src:url(../fonts/pt-sans-italic.woff) format("woff")}@font-face{font-style:italic;font-weight:700;font-family:PT Sans;src:url(../fonts/pt-sans-bold-italic.woff) format("woff")}@font-face{font-family:PT Sans Narrow;font-weight:700;src:url(../fonts/pt-sans-narrow-bold.woff) format("woff")}@font-face{font-family:PT Mono;src:url(../fonts/pt-mono-regular.woff) format("woff")}*,::after,::before{box-sizing:border-box}a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}.caption p,body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote::after,blockquote::before,q::after,q::before{content:none}table{border-collapse:collapse;border-spacing:0}a{text-decoration:none}@page{margin:0;size:1024px 768px}.shower{color:#000;counter-reset:slide;font:25px/2 PT Sans,sans-serif;-webkit-print-color-adjust:exact;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none}@media print{.shower{text-rendering:geometricPrecision}}.caption{font-size:25px;display:none;margin-top:-.2em;padding:0 1em .93em;width:100%;color:#3c3d40;text-shadow:0 1px 0 #8d8e90}@media (min-width:1174px){.caption{font-size:50px}}@media (min-width:2348px){.caption{font-size:100px}}.caption h1{padding-bottom:.15em;font:700 1em/1 PT Sans Narrow,sans-serif}.caption p{font-size:.6em}.caption a{color:#4b86c2;text-shadow:0 -1px 0 #1f3f60}.slide{position:relative;z-index:1;overflow:hidden;padding:106px 100px 0;width:1024px;height:768px;background:#fff;font-size:25px}.slide::after{position:absolute;top:0;right:100px;padding-top:15px;width:50px;height:100px;background:url(../images/ribbon.svg) no-repeat;color:#fff;counter-increment:slide;content:counter(slide);text-align:center}.slide h2{margin-bottom:34px;color:#585a5e;font:700 50px/1 PT Sans Narrow,sans-serif}.slide p{margin-bottom:1em}.slide p.note{color:#979a9e}.slide a{background:-webkit-linear-gradient(bottom,currentColor .09em,transparent .09em) repeat-x;background:linear-gradient(to top,currentColor .09em,transparent .09em) repeat-x;color:#4b86c2}.slide b,.slide strong{font-weight:700}.slide blockquote,.slide dfn,.slide em,.slide i{font-style:italic}.slide code,.slide kbd,.slide mark,.slide samp{padding:.1em .3em;border-radius:.2em}.slide code,.slide kbd,.slide samp{background:rgba(88,90,94,.1);line-height:1;font-family:PT Mono,monospace,monospace}.slide mark{background:#fafaa2}.slide sub,.slide sup{position:relative;line-height:0;font-size:75%}.slide sub{bottom:-.25em}.slide sup{top:-.5em}.slide blockquote::before{position:absolute;margin:-.15em 0 0 -.43em;color:#ccc;line-height:1;font-size:8em;content:'\201C'}.slide blockquote+figcaption{margin:-1em 0 1em;font-style:italic;font-weight:700}.slide ol,.slide ul{margin-bottom:1em;counter-reset:list}.slide ol li,.slide ul li{page-break-inside:avoid;text-indent:-2em}.slide ol li::before,.slide ul li::before{display:inline-block;width:2em;color:#979a9e;text-align:right}.slide ol ol,.slide ol ul,.slide ul ol,.slide ul ul{margin-bottom:0;margin-left:2em}.slide ul>li::before{padding-right:.5em;content:'•'}.slide ul>li:lang(ru)::before{content:'—'}.slide ol>li::before{padding-right:.4em;counter-increment:list;content:counter(list) "."}.slide table{margin-left:-100px;margin-bottom:1em;width:calc(100% + 100px + 100px)}.slide table td:first-child,.slide table th:first-child{padding-left:96px}.slide table td:last-child,.slide table th:last-child{padding-right:96px}.slide table th{text-align:left;font-weight:700}.slide table tr:not(:last-of-type)>*{background:-webkit-linear-gradient(bottom,rgba(88,90,94,.5) .055em,transparent .055em) repeat-x;background:linear-gradient(to top,rgba(88,90,94,.5) .055em,transparent .055em) repeat-x}.slide table.striped tr:nth-child(even){background:rgba(88,90,94,.1)}.slide table.striped tr>*{background-image:none}.slide pre{margin-bottom:1em;counter-reset:code;white-space:normal}.slide pre code{display:block;margin-left:-100px;padding:0 0 0 100px;width:calc(100% + 100px + 100px);border-radius:0;background:0 0;line-height:2;white-space:pre;-moz-tab-size:4;-o-tab-size:4;tab-size:4}.slide pre code:not(:only-child).mark{background:rgba(88,90,94,.1)}.slide pre code:not(:only-child)::before{position:absolute;margin-left:-2em;color:#979a9e;counter-increment:code;content:counter(code,decimal-leading-zero) "."}.slide pre mark{position:relative;z-index:-1;margin:0 -.3em}.slide pre mark.important{background:#c00;color:#fff}.slide pre .comment{color:#999}.slide footer{position:absolute;right:0;bottom:-768px;left:0;display:none;padding:41px 100px 8px;background:#fbfbba;box-shadow:0 1px 0 #fafaa2 inset;-webkit-transition:bottom .3s;transition:bottom .3s}.slide footer mark{background:rgba(255,255,255,.8)}.slide:hover>footer{bottom:0}.slide.grid{background-image:url(../images/grid.png);-ms-interpolation-mode:nearest-neighbor;image-rendering:-webkit-optimize-contrast;image-rendering:-moz-crisp-edges;image-rendering:pixelated}@media (-webkit-min-device-pixel-ratio:2),(min-resolution:2dppx){.slide.grid{background-image:url(../images/grid@2x.png);background-size:1024px auto}}.slide.black{background-color:#000}.slide.black::after,.slide.white::after{visibility:hidden}.slide.white{background-color:#fff}.slide .double,.slide .triple{-webkit-column-gap:75px;-moz-column-gap:75px;column-gap:75px;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}.slide .double{-webkit-column-count:2;-moz-column-count:2;column-count:2}.slide .triple{-webkit-column-count:3;-moz-column-count:3;column-count:3}.slide .shout{position:absolute;top:50%;left:0;width:100%;text-align:center;line-height:1;font-size:150px;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.slide .shout a{background:-webkit-linear-gradient(bottom,currentColor .11em,transparent .11em) repeat-x;background:linear-gradient(to top,currentColor .11em,transparent .11em) repeat-x}.slide .cover{z-index:-1;max-width:100%;max-height:100%}.slide .cover.w,.slide .cover.width{width:100%;max-height:none}.slide .cover.h,.slide .cover.height{height:100%;max-width:none}.slide .cover+figcaption{position:absolute;bottom:20px;right:10px;font-size:12px;opacity:.7;-webkit-transform-origin:0 100%;transform-origin:0 100%;-webkit-transform:translateX(100%) rotate(-90deg);transform:translateX(100%) rotate(-90deg)}.slide .cover+figcaption.white{color:#fff}.slide .cover+figcaption a{color:currentcolor}.slide .cover,.slide .place{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.slide .place.b.l,.slide .place.b.r,.slide .place.bottom.left,.slide .place.bottom.right,.slide .place.t.l,.slide .place.t.r,.slide .place.top.left,.slide .place.top.right{-webkit-transform:none;transform:none}.slide .place.b,.slide .place.bottom,.slide .place.t,.slide .place.top{-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}.slide .place.l,.slide .place.left,.slide .place.r,.slide .place.right{-webkit-transform:translate(0,-50%);transform:translate(0,-50%)}.slide .place.t,.slide .place.t.r,.slide .place.top,.slide .place.top.left,.slide .place.top.right{top:0}.slide .place.r,.slide .place.right{right:0;left:auto}.slide .place.b,.slide .place.b.l,.slide .place.b.r,.slide .place.bottom,.slide .place.bottom.left,.slide .place.bottom.right{top:auto;bottom:0}.slide .place.l,.slide .place.left{left:0}.progress{left:-20px;bottom:0;z-index:1;display:none;width:0;height:0;box-sizing:content-box;border:10px solid #4b86c2;border-right-color:transparent;-webkit-transition:width .2s linear;transition:width .2s linear;clip:rect(10px,1044px,20px,20px)}.progress[style*='100%']{padding-left:10px}.badge,.badge a,.progress{position:absolute}.badge{font-size:10px;top:0;z-index:1;overflow:hidden;display:none;width:9em;height:9em;right:0;visibility:hidden}@media (min-width:1174px){.badge{font-size:20px}}@media (min-width:2348px){.badge{font-size:40px}}.badge a{right:-50%;bottom:50%;left:-50%;visibility:visible;background:#4b86c2;color:#fff;text-align:center;line-height:2;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.region{display:none}@media screen{.shower.list{padding-top:25px;width:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;background:#585a5e;position:absolute;clip:rect(0,auto,auto,0)}}@media screen and (min-width:1174px){.shower.list{padding-top:50px}}@media screen and (min-width:2348px){.shower.list{padding-top:100px}}@media screen{.shower.list .caption{display:block}.shower.list .slide{-webkit-transform-origin:0 0;transform-origin:0 0;margin:0 -768px -551px 25px;-webkit-transform:scale(.25);transform:scale(.25);border-radius:2px;box-shadow:0 20px 50px rgba(0,0,0,.3)}}@media screen and (min-width:1174px){.shower.list .slide{margin:0 -512px -334px 50px;-webkit-transform:scale(.5);transform:scale(.5)}}@media screen and (min-width:2348px){.shower.list .slide{margin:0 0 100px 100px;-webkit-transform:scale(1);transform:scale(1)}}@media screen{.shower.list .slide:hover{box-shadow:0 0 0 20px rgba(0,0,0,.1),0 20px 50px rgba(0,0,0,.3)}.shower.list .slide:target{box-shadow:0 0 0 1px #376da3,0 0 0 20px #4b86c2,0 20px 50px rgba(0,0,0,.3)}.shower.list .slide *{pointer-events:none}.shower.list .badge,.shower.list .slide footer{display:block}.shower.full{position:absolute;top:50%;left:50%;overflow:hidden;margin:-384px 0 0 -512px;width:1024px;height:768px;background:#000}.shower.full .slide{position:absolute;top:0;left:0;margin-left:-150%;visibility:hidden}.shower.full .slide:target{margin:0;visibility:visible}.shower.full .slide pre code:not(:only-child).mark.next{visibility:visible;background:0 0}.shower.full .slide pre code:not(:only-child).mark.next.active{background:rgba(88,90,94,.1)}.shower.full .slide .next{visibility:hidden}.shower.full .slide .next.active{visibility:visible}.shower.full .slide .shout.grow,.shower.full .slide .shout.shrink{opacity:0;-webkit-transition:.4s ease-out;transition:.4s ease-out;-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}.shower.full .slide .shout.grow{-webkit-transform:scale(.1) translateY(-50%);transform:scale(.1) translateY(-50%)}.shower.full .slide .shout.shrink{-webkit-transform:scale(10) translateY(-50%);transform:scale(10) translateY(-50%)}.shower.full .slide:target .shout.grow,.shower.full .slide:target .shout.shrink{opacity:1;-webkit-transform:scale(1) translateY(-50%);transform:scale(1) translateY(-50%)}.shower.full .progress{display:block;-webkit-transform:translateZ(0);transform:translateZ(0)}.shower.full .region{position:absolute;clip:rect(0 0 0 0);overflow:hidden;margin:-1px;padding:0;width:1px;height:1px;border:none;display:block}} \ No newline at end of file