From db8b512670c522d653f8941b510d122562e6a99a Mon Sep 17 00:00:00 2001
From: Simon Vieille <simon@deblan.fr>
Date: Sun, 15 Oct 2017 13:18:06 +0200
Subject: [PATCH] Mobile view optimised

---
 src/Gist/Resources/views/View/embed.html.twig | 80 +++++++++++++-----
 src/Gist/Resources/views/View/view.html.twig  | 81 ++++++++++++++-----
 2 files changed, 118 insertions(+), 43 deletions(-)

diff --git a/src/Gist/Resources/views/View/embed.html.twig b/src/Gist/Resources/views/View/embed.html.twig
index 12c7f1b..c69eda7 100644
--- a/src/Gist/Resources/views/View/embed.html.twig
+++ b/src/Gist/Resources/views/View/embed.html.twig
@@ -35,31 +35,67 @@
         <div class="col-md-12" id="embed">
             <div class="panel panel-default">
                 <div class="panel-heading">
-                    <div class="pull-right actions">
-                        <a target="_blank" href="{{ path('view', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm cipher-link">
-                            <span class="btn btn-warning btn-xs">
-                                {{ commit|slice(0, 10) }}
-                            </span>
-                        </a>
+                    <div class="row">
+                        <div class="col-md-6 col-xs-9">
+                            {{ gist.title ? gist.title : 'gist.untitled'|trans }}
+                        </div>
+                        <div class="col-md-6 col-xs-3">
+                            <div class="visible-sm visible-xs pull-right">
+                                <div class="btn-group">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                        <span class="glyphicon glyphicon-menu-hamburger"></span>
+                                    </button>
+                                    <ul class="dropdown-menu dropdown-menu-right">
+                                        <li>
+                                            <a target="_blank" href="{{ path('view', app.request.attributes.get('_route_params')) }}" class="cipher-link">
+                                                <span class="btn btn-warning btn-xs">
+                                                    {{ commit|slice(0, 10) }}
+                                                </span>
+                                            </a>
+                                        </li>
+                                        {% if not gist.cipher %}
+                                            <li>
+                                                <a href="{{ path('raw', app.request.attributes.get('_route_params')) }}">
+                                                    {{ 'gist.action.raw'|trans }}
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a href="{{ path('download', app.request.attributes.get('_route_params')) }}" class="btn-sm">
+                                                    {{ 'gist.action.download'|trans }}
+                                                </a>
+                                            </li>
+                                        {% endif %}
+                                        <li>
+                                            <a href="{{ path('clone', app.request.attributes.get('_route_params')) }}" class="cipher-link">
+                                                {{ 'gist.action.clone'|trans }}
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </div>
+                            <div class="visible-md visible-lg">
+                                <div class="text-right actions">
+                                    <a target="_blank" href="{{ path('view', app.request.attributes.get('_route_params')) }}" class="cipher-link"><span class="btn btn-warning btn-xs">{{ commit|slice(0, 10) }}</span></a>
 
-                        {% if not gist.cipher %}
-                            <a target="_blank" href="{{ path('raw', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
-                                <span class="glyphicon glyphicon-eye-open"></span>
-                                {{ 'gist.action.raw'|trans }}
-                            </a>
-                            <a target="_blank" href="{{ path('download', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
-                                <span class="glyphicon glyphicon-save-file"></span>
-                                {{ 'gist.action.download'|trans }}
-                            </a>
-                        {% endif %}
+                                    {% if not gist.cipher %}
+                                        <a href="{{ path('raw', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
+                                            <span class="glyphicon glyphicon-eye-open"></span>
+                                            {{ 'gist.action.raw'|trans }}
+                                        </a>
+                                        <a href="{{ path('download', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
+                                            <span class="glyphicon glyphicon-save-file"></span>
+                                            {{ 'gist.action.download'|trans }}
+                                        </a>
+                                    {% endif %}
 
-                        <a target="_blank" href="{{ path('clone', app.request.attributes.get('_route_params')) }}" class="btn btn-success btn-sm cipher-link">
-                            <span class="glyphicon glyphicon-copy"></span>
-                            {{ 'gist.action.clone'|trans }}
-                        </a>
+                                    <a href="{{ path('clone', app.request.attributes.get('_route_params')) }}" class="btn btn-success btn-sm cipher-link">
+                                        <span class="glyphicon glyphicon-copy"></span>
+                                        {{ 'gist.action.clone'|trans }}
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
                     </div>
-
-                    {{ gist.title ? gist.title : 'gist.untitled'|trans }}
                 </div>
                 <div class="panel-body">
                     <div class="tab-content">
diff --git a/src/Gist/Resources/views/View/view.html.twig b/src/Gist/Resources/views/View/view.html.twig
index 7891faf..b722578 100644
--- a/src/Gist/Resources/views/View/view.html.twig
+++ b/src/Gist/Resources/views/View/view.html.twig
@@ -33,30 +33,69 @@
 
             <div class="panel panel-default">
                 <div class="panel-heading">
-                    <div class="pull-right actions">
-                        <span class="btn btn-warning btn-xs">
-                            {{ commit|slice(0, 10) }}
-                        </span>
+                    <div class="row">
+                        <div class="col-md-6 col-xs-9">
+                            {{ gist.title ? gist.title : 'gist.untitled'|trans }}
+                        </div>
+                        <div class="col-md-6 col-xs-3">
+                            <div class="visible-sm visible-xs pull-right">
+                                <div class="btn-group">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                        <span class="glyphicon glyphicon-menu-hamburger"></span>
+                                    </button>
+                                    <ul class="dropdown-menu dropdown-menu-right">
+                                        <li>
+                                            <a target="_blank" href="{{ path('view', app.request.attributes.get('_route_params')) }}" class="cipher-link">
+                                                <span class="btn btn-warning btn-xs">
+                                                    {{ commit|slice(0, 10) }}
+                                                </span>
+                                            </a>
+                                        </li>
+                                        {% if not gist.cipher %}
+                                            <li>
+                                                <a href="{{ path('raw', app.request.attributes.get('_route_params')) }}">
+                                                    {{ 'gist.action.raw'|trans }}
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a href="{{ path('download', app.request.attributes.get('_route_params')) }}" class="btn-sm">
+                                                    {{ 'gist.action.download'|trans }}
+                                                </a>
+                                            </li>
+                                        {% endif %}
+                                        <li>
+                                            <a href="{{ path('clone', app.request.attributes.get('_route_params')) }}" class="cipher-link">
+                                                {{ 'gist.action.clone'|trans }}
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </div>
+                            <div class="visible-md visible-lg">
+                                <div class="text-right actions">
+                                    <span class="btn btn-warning btn-xs">
+                                        {{ commit|slice(0, 10) }}
+                                    </span>
 
-                        {% if not gist.cipher %}
-                            <a href="{{ path('raw', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
-                                <span class="glyphicon glyphicon-eye-open"></span>
-                                {{ 'gist.action.raw'|trans }}
-                            </a>
-                            <a href="{{ path('download', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
-                                <span class="glyphicon glyphicon-save-file"></span>
-                                {{ 'gist.action.download'|trans }}
-                            </a>
-                        {% endif %}
+                                    {% if not gist.cipher %}
+                                        <a href="{{ path('raw', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
+                                            <span class="glyphicon glyphicon-eye-open"></span>
+                                            {{ 'gist.action.raw'|trans }}
+                                        </a>
+                                        <a href="{{ path('download', app.request.attributes.get('_route_params')) }}" class="btn btn-default btn-sm">
+                                            <span class="glyphicon glyphicon-save-file"></span>
+                                            {{ 'gist.action.download'|trans }}
+                                        </a>
+                                    {% endif %}
 
-                        <a href="{{ path('clone', app.request.attributes.get('_route_params')) }}" class="btn btn-success btn-sm cipher-link">
-                            <span class="glyphicon glyphicon-copy"></span>
-                            {{ 'gist.action.clone'|trans }}
-                        </a>
+                                    <a href="{{ path('clone', app.request.attributes.get('_route_params')) }}" class="btn btn-success btn-sm cipher-link">
+                                        <span class="glyphicon glyphicon-copy"></span>
+                                        {{ 'gist.action.clone'|trans }}
+                                    </a>
+                                </div>
+                            </div>
+                        </div>
                     </div>
-
-                    {{ gist.title ? gist.title : 'gist.untitled'|trans }}
-
                 </div>
                 <div class="panel-body">
                     <div class="tab-content">