kevin/r2c
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update code

Browse Source
This commit is contained in:
kevin
2018-07-26 15:01:36 +02:00
parent 3e7c0c56ed
commit aea6f4f6ce
10 changed files with 109 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files
user/themes/r2c/css-compiled/template.css
+10 -6
View File
File diff suppressed because one or more lines are too long
user/themes/r2c/css-compiled/template.min.css
Vendored
+1 -1
View File
@@ -1 +1 @@
*{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{font:inherit;font-size:16px;margin:0;padding:0;vertical-align:baseline;border:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body,html{height:100%}body{line-height:1}ol,ul{list-style:none}a{text-decoration:none;color:#000}blockquote,q{quotes:none}img{width:100%;height:100%;vertical-align:bottom}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-spacing:0;border-collapse:collapse}p{font-style:normal}em{font-style:italic}strong{font-weight:bolder}.handler{position:absolute;z-index:999;top:50%;left:calc((100%/3) - 25px);width:50px;height:50px;border-radius:25px;background:#00f}body{overflow:hidden}#page{height:100%}#page .navbar{width:100%;height:50px}#page #start{width:100%;height:calc(100% - 50px)}#page #start .bottom,#page #start .top{position:relative;height:calc(100% / 2)}#page #start .blocs{position:absolute;overflow-y:auto;width:calc(100% / 3);height:100%}#page #start .blocs:nth-child(1){background:red}#page #start .blocs:nth-child(2){left:calc(100% / 3);background:pink}#page #start .blocs:nth-child(3){right:0;background:green}
*{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{font:inherit;font-size:16px;margin:0;padding:0;vertical-align:baseline;border:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body,html{height:100%}body{line-height:1}ol,ul{list-style:none}a{text-decoration:none;color:#000}blockquote,q{quotes:none}img{width:100%;height:100%;vertical-align:bottom}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-spacing:0;border-collapse:collapse}p{font-style:normal}em{font-style:italic}strong{font-weight:bolder}body{overflow:hidden}#page{height:100%}#page .navbar{width:100%;height:50px}#page .handler{position:absolute;z-index:999;top:50%;left:calc((100%/3) - 25px);width:50px;height:50px;border-radius:25px;background:#00f}#page #start{width:100%;height:calc(100% - 50px)}#page #start .bottom,#page #start .top{display:-ms-inline-flexbox;display:inline-flex;width:100%;-ms-flex-pack:justify;justify-content:space-between}#page #start .top{position:relative;height:calc(100% / 2)}#page #start .bottom{position:absolute;bottom:0;height:auto}#page #start .blocs{overflow-y:auto;width:calc(100% / 3);margin:5px}#page #start .blocs:nth-child(1){background:red}#page #start .blocs:nth-child(2){left:calc(100% / 3);background:pink}#page #start .blocs:nth-child(3){background:green}
user/themes/r2c/js/site.js
+59 -51
View File
@@ -9,64 +9,72 @@ function drag() {
$hand.draggable({
drag: function(){
// handler
// dimension handler
var $Hhand = $(this).outerHeight();
var $Whand = $(this).outerWidth();
// ajust handler
var ajustH = $Hhand / 2;
var ajustW = $Whand / 2;
// dimension handler
var $heighthand = $(this).outerHeight();
var $widthhand = $(this).outerWidth();
// position handler
var offset = $(this).offset();
var xPos = offset.left + ajustW;
var yPos = offset.top - ajustH;
// ajust handler
var ajustH = $heighthand /2;
var ajustW = $widthhand /2;
var xPos2 = xPos + (ajustW * 2);
var yPos2 = yPos + (ajustH * 2);
// position handler
var offset = $(this).offset();
var xPos = offset.left + ajustW;
var yPos = offset.top - ajustH;
// Blocs
// top
var $recits = $(this).parent('#page').find('#recits');
var $itw = $(this).parent('#page').find("#interviews");
var $img = $(this).parent('#page').find("#images");
var xPos2 = xPos + (ajustW * 2);
var yPos2 = yPos + (ajustH * 2);
// bottom
var $links = $(this).parent('#page').find("#links");
var $rs = $(this).parent('#page').find("#reseaux-sociaux");
var $stmp = $(this).parent('#page').find("#streetmap");
var $bottom = $(this).parent('#page').find(".bottom");
// top
var $recits = $(this).parent('#page').find('#recits');
var $itw = $(this).parent('#page').find("#interviews");
var $links = $(this).parent('#page').find("#links");
// dimension blocs
var Array_Dw0 = [];
var Array_Dw1 = [];
var Array_Dw2 = [];
var Array_Dw3 = [];
// bottom
var $rs = $(this).parent('#page').find("#reseaux-sociaux");
var $stmp = $(this).parent('#page').find("#streetmap");
var $img = $(this).parent('#page').find("#images");
var Dw0 = $(window).outerWidth(true);
var Dw1 = $recits.outerWidth(true);
var Dw2 = $itw.outerWidth(true);
var Dw3 = $img.outerWidth(true);
// style
var style_recit = { width: xPos, height : yPos }
var style_height = { height : yPos }
// app style
$recits.css(style_recit);
$itw.css(style_height);
$links.css(style_height);
// width div
var $w0 = $('html').outerWidth();
var $w1_1 = $recits.outerWidth();
var $w1_2 = $itw.outerWidth();
var $w1_3 = $links.outerWidth();
var $w2_1 = ($w1_2 + $w1_3) - $w0;
var $w2_2 = ($w1_1 + $w1_3) - $w0;
var $l2_2 = ($w1_1);
var $w2_3 = ($w1_1 + $w1_2) - $w0;
var $l2_3 = ($l2_2 + $w1_2);
// style_bottom
var yPos2 = yPos + (ajustH * 2);
var $style_rs = { width: xPos, top : yPos2, height: 'auto' }
var $style_stmp = { width: $w1_2, top : yPos2, left : $l2_2, height: 'auto' }
var $style_img = { width: $w1_3, top : yPos2, left : $l2_3, height: 'auto' }
$rs.css($style_rs);
$stmp.css($style_stmp);
$img.css($style_img);
// var Bw1 = (Dw0 - (Dw2 + Dw3));
var Bw2 = (Dw0 - (Dw1 + Dw3));
var Bw3 = (Dw0 - (Dw1 + Dw2));
var Bl3 = Dw1 + Dw2;
// app dimension
$recits.css({
"width": xPos,
"height": yPos,
});
$itw.css({
"width": Bw2,
"height": yPos,
});
$img.css({
"width": '33%',
"height": yPos,
});
$bottom.css({
"top": yPos2,
})
$links.css({
"width": xPos,
"top": yPos2,
})
$rs.css({
"width": Bw2,
});
}
});
};
user/themes/r2c/scss/configuration/_config.scss
+3 -9
View File
@@ -9,21 +9,15 @@
// $fem
// $fbold
// color
//width
// $33: calc(100% / 3);
// header
$heightH: 25px;
$heightH: calc(25px + 2.5px);
// taille & position blocs
// height
$H100: 100%;
$H50: calc(#{$H100} / 2);
$H50-25: calc(#{$H100} / 2 - #{$heightH});
// width
$W100: 100%;
$W33: calc(#{$W100} / 3);
@@ -40,4 +34,4 @@ $B100: 100%;
// left
$L100: 100%;
$L33: calc(#{$L100} / 3);
$L66: calc(#{$L100} / 3);
$L66: calc(#{$L33} * 2);
user/themes/r2c/scss/template/_section.scss
+31 -49
View File
@@ -1,37 +1,48 @@
.handler{
width: 50px;
height: 50px;
border-radius: 25px;
background: blue;
position: absolute;
left : calc((100%/3) - 25px);
top: 50%;
z-index: 999;
}
body{
overflow: hidden;
}
#page{
height: 100%;
.navbar{
width: 100%;
height: 50px;
}
.handler{
width: 50px;
height: 50px;
border-radius: 25px;
background: blue;
position: absolute;
left : calc((100%/3) - 25px);
top: 50%;
z-index: 999;
}
#start{
width: 100%;
height: calc(100% - 50px);
.top, .bottom{
width: 100%;
display: inline-flex;
justify-content: space-between;
}
.top{
position: relative;
height: $H50;
}
.bottom{
position: absolute;
height: auto;
bottom: 0;
}
.blocs{
overflow-y: auto;
position: absolute;
// position: fixed;
margin: 5px;
width: $W33;
height: $H100;
// height: $H50-25;
&:nth-child(1){
background: red;
}
&:nth-child(2){
background: pink;
@@ -39,43 +50,14 @@ body{
}
&:nth-child(3){
background: green;
right: 0;
// left: $L66;
// right: 0;
}
}
.bottom{
.blocs{
// display: none;
}
}
}
}
// .top{
// height: 50%;
// }
// .top, .bottom{
// // display: inline-grid;
// // grid-template-columns: auto auto auto;
// }
//
// #start{
// height: 100%;
// & > div {
// position: fixed;
// height: 100%;
// }
// }
//
// .top, .bottom{
// & > div{
// position: fixed;
// width: calc(100%/3);
// top: calc(100%/2 + 25px);
// height: calc(100%/2 - 25px);
// bottom: 0;
// &:nth-child(2){
// left: calc(100%/3);
// }
// &:nth-child(3){
// right: 0;
// }
// }
// }