Commit 9845f2bd authored by alexandre's avatar alexandre

WIP

parent 5705a39a
...@@ -338,11 +338,6 @@ section.hidden { display: none; } ...@@ -338,11 +338,6 @@ section.hidden { display: none; }
/* Main menu (sidebar) /* Main menu (sidebar)
========================================================================== */ ========================================================================== */
.main-header {
position: relative;
left: 0;
box-sizing: border-box;
}
.main-header .content { .main-header .content {
width: 300px; width: 300px;
...@@ -352,64 +347,6 @@ section.hidden { display: none; } ...@@ -352,64 +347,6 @@ section.hidden { display: none; }
.main-header.is-collapsed .content { margin-left: -330px; } .main-header.is-collapsed .content { margin-left: -330px; }
/* .btn-hamburger { */
/* position: absolute; */
/* bottom: 100%; */
/* } */
/* .btn-hamburger--right { */
/* left: 100%; */
/* transform-origin: bottom left; */
/* transform: rotate(90deg); */
/* } */
/* .btn-hamburger--left { */
/* right: 100%; */
/* transform-origin: bottom right; */
/* transform: rotate(-90deg); */
/* } */
/* .btn-hamburger__inner { */
/* display: block; */
/* padding-right: 30px; */
/* } */
/* .btn-hamburger--right .btn-hamburger__inner { */
/* transform: rotate(180deg); */
/* padding-top: 10px; */
/* } */
/* .btn-hamburger--left .btn-hamburger__inner { */
/* padding-bottom: 10px; */
/* } */
.btn-hamburger--right {
/* outline: 1px solid red; */
width: 100vh;
text-align: right;
position: absolute;
bottom: 0;
left: 100%;
transform-origin: bottom left;
transform: rotate(-90deg);
box-sizing: border-box;
padding-right: 30px;
line-height: 30px;
}
.btn-hamburger--left {
/* outline: 1px solid red; */
width: 100vh;
position: absolute;
top: 100%;
left: 0;
transform-origin: top left;
transform: rotate(-90deg);
text-align: right;
box-sizing: border-box;
padding-right: 30px;
line-height: 30px;
}
.axis-title-edit { text-transform: uppercase; } .axis-title-edit { text-transform: uppercase; }
.axis-title-view { .axis-title-view {
...@@ -418,20 +355,6 @@ section.hidden { display: none; } ...@@ -418,20 +355,6 @@ section.hidden { display: none; }
border: none !important; border: none !important;
} }
.btn-hamburger:hover {
cursor: pointer;
color: #173a42;
filter: brightness(200%);
}
.main-header.is-collapsed .btn-hamburger {
/* right: -26px; */
}
#help.is-collapsed .btn-hamburger {
/* left: -26px; */
}
.logo { margin: 21px 0 42px 0; } .logo { margin: 21px 0 42px 0; }
.logo h1 { .logo h1 {
...@@ -455,7 +378,7 @@ section.hidden { display: none; } ...@@ -455,7 +378,7 @@ section.hidden { display: none; }
.main-area { .main-area {
overflow: auto; overflow: auto;
margin-left: 0; margin-left: 0;
padding: 30px 60px; /* padding: 30px 60px; */
transition: all .2s; transition: all .2s;
flex: 1; flex: 1;
} }
...@@ -1096,12 +1019,6 @@ li form { color: var(--row-color); } */ ...@@ -1096,12 +1019,6 @@ li form { color: var(--row-color); } */
} }
#help {
position: relative;
right: 0;
padding-left: 30px;
}
.help__frame { .help__frame {
overflow: auto; overflow: auto;
width: 500px; width: 500px;
...@@ -1343,4 +1260,62 @@ li .icon--tag { color: white } */ ...@@ -1343,4 +1260,62 @@ li .icon--tag { color: white } */
.score-list { display: flex; }
.scores { flex: 1; }
.score-filters {
height: 100vh;
}
.panel {
position: relative;
box-sizing: border-box;
}
.panel--right {
right: 0;
padding-left: 30px;
}
.panel--left {
left: 0;
padding-right: 30px;
}
.panel__toggle {
box-sizing: border-box;
line-height: 30px;
outline: 1px solid white;
padding-right: 30px;
position: absolute;
text-align: right;
transform: rotate(-90deg);
width: 100vh;
}
.panel--left .panel__toggle {
bottom: 0;
left: 100%;
transform-origin: bottom left;
}
.panel--right .panel__toggle {
left: 0;
top: 100%;
transform-origin: top left;
}
.panel__toggle:hover {
cursor: pointer;
color: #173a42;
filter: brightness(200%);
}
.panel__content {
}
.content {
padding: 30px;
}
...@@ -1545,6 +1545,7 @@ window.W = window.W || {}; ...@@ -1545,6 +1545,7 @@ window.W = window.W || {};
attributes: { attributes: {
id: 'score', id: 'score',
class: "content",
tabindex: '1' tabindex: '1'
}, },
...@@ -2214,6 +2215,10 @@ window.W = window.W || {}; ...@@ -2214,6 +2215,10 @@ window.W = window.W || {};
W.UserDetailView = Backbone.Marionette.View.extend({ W.UserDetailView = Backbone.Marionette.View.extend({
template: '#user-detail-template', template: '#user-detail-template',
attributes : {
class: 'content',
},
regions: { regions: {
list: '#list', list: '#list',
pagination: '#pagination', pagination: '#pagination',
...@@ -2402,7 +2407,7 @@ window.W = window.W || {}; ...@@ -2402,7 +2407,7 @@ window.W = window.W || {};
W.AboutView = Backbone.Marionette.View.extend({ W.AboutView = Backbone.Marionette.View.extend({
template: '#about-template', template: '#about-template',
attributes: { class: 'body-text body-text--about' } attributes: { class: 'body-text body-text--about content' }
}); });
...@@ -2413,6 +2418,10 @@ window.W = window.W || {}; ...@@ -2413,6 +2418,10 @@ window.W = window.W || {};
latest_updated: '#latest_updated' latest_updated: '#latest_updated'
}, },
attributes: {
class: 'content',
},
onRender: function () { onRender: function () {
var that = this; var that = this;
...@@ -2466,11 +2475,11 @@ window.W = window.W || {}; ...@@ -2466,11 +2475,11 @@ window.W = window.W || {};
attributes: { attributes: {
id: 'help', id: 'help',
class: 'is-collapsed' class: 'is-collapsed panel panel--right'
}, },
ui: { ui: {
'toggle': '.btn-hamburger', 'toggle': '.panel__toggle',
}, },
triggers: { triggers: {
...@@ -2486,11 +2495,11 @@ window.W = window.W || {}; ...@@ -2486,11 +2495,11 @@ window.W = window.W || {};
template: '#header-template', template: '#header-template',
attributes: { attributes: {
class: 'main-header' class: 'main-header panel panel--left'
}, },
ui: { ui: {
'toggle': '.btn-hamburger', 'toggle': '.panel__toggle',
'login': '.btn-login', 'login': '.btn-login',
'logout': '.btn-logout', 'logout': '.btn-logout',
'register': '.btn-register', 'register': '.btn-register',
......
<div class="btn-hamburger btn-hamburger--right js-collapse"><span class="btn-hamburger__inner">menu</span></div> <div class="panel__toggle js-collapse"><span class="btn-hamburger__inner">menu</span></div>
<div class="content"> <div class="content">
<nav> <nav>
......
<div class="btn-hamburger btn-hamburger--left js-collapse"><span class="btn-hamburger__inner">aide</span></div> <div class="panel__toggle btn-hamburger btn-hamburger--left js-collapse"><span class="btn-hamburger__inner">aide</span></div>
<iframe class="help__frame" src="/pages/home/"></iframe> <iframe class="help__frame" src="/pages/home/"></iframe>
<div> <div class="scores content">
<div> <h1><%- t('Partitions existantes') %></h1>
<div id="list"></div>
<div id="pagination"></div>
</div>
<div class="score-filters panel panel--right">
<div class="panel__toggle js-collapse">filtres</div>
<div class="content">
<div id="applied-filters"></div>
<div id="search"></div>
<div class="filters"> <div class="filters">
<div class="filters__filter"> <div class="filters__filter">
<p><%- t('langue') %></p> <p><%- t('langue') %></p>
...@@ -16,18 +27,6 @@ ...@@ -16,18 +27,6 @@
<div id="tag-filter"></div> <div id="tag-filter"></div>
</div> </div>
</div> </div>
</div>
<div>
<h1><%- t('Partitions existantes') %></h1>
<div id="applied-filters"></div>
<div id="search"></div>
<div id="list"></div>
<div id="pagination"></div>
</div> </div>
</div> </div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment