modifs 1
This commit is contained in:
parent
d5715c354e
commit
b9f60ba2e9
@ -6,6 +6,7 @@
|
||||
#= require jquery.animate-enhanced.min
|
||||
#= require jquery.tagcanvas
|
||||
|
||||
|
||||
#= require jquery.bxslider.min
|
||||
|
||||
|
||||
@ -21,7 +22,20 @@ bottom = 0
|
||||
prev_link = ""
|
||||
$("document").ready ->
|
||||
position_img_now = ->
|
||||
$("#large .large-img").css("margin-top", (( $(window).height() - $("#large .large-img").height() - 100) / 2 )+"px")
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
imgheight = $("#large .large-img").height()
|
||||
imgwidth = $("#large .large-img").height()
|
||||
|
||||
|
||||
|
||||
$("#large .large-img").css
|
||||
"margin-top" :((( $(window).height() - $("#large .large-img").outerHeight()) / 2 )+"px")
|
||||
#"width" : "100px"
|
||||
|
||||
|
||||
|
||||
position_img = ->
|
||||
@ -32,13 +46,32 @@ $("document").ready ->
|
||||
|
||||
|
||||
$("#rea-gal a").click ->
|
||||
maxwidth = 1000
|
||||
maxheight = 900
|
||||
|
||||
|
||||
|
||||
|
||||
prev_link = $(this)
|
||||
$("body").append "<div id='large'></div>"
|
||||
$("#large").fadeIn(500)
|
||||
$("#large").append "<img src='/arrow-next.png' class='next' />"
|
||||
$("#large").append "<img src='/arrow-prev.png' class='prev' />"
|
||||
|
||||
$("#large").append "<img src="+$(this).attr("href")+" class='large-img' />"
|
||||
$("#large").append "<div class='img_container first'></div>"
|
||||
$(".img_container.first").append "<img src="+$(this).attr("href")+" class='large-img' />"
|
||||
if $(window).height() > (maxheight+100)
|
||||
$("#large .large-img").css
|
||||
"max-height" : maxheight
|
||||
else
|
||||
$("#large .large-img").css
|
||||
"max-height" : "90%"
|
||||
|
||||
if $(window).width() > (maxwidth+100)
|
||||
$("#large .large-img").css
|
||||
"max-width" : maxwidth
|
||||
else
|
||||
$("#large .large-img").css
|
||||
"max-width" : "90%"
|
||||
|
||||
position_img();
|
||||
|
||||
@ -64,9 +97,10 @@ $("document").ready ->
|
||||
|
||||
|
||||
#titre = photo.find("h3")
|
||||
$('#large .large-img').fadeOut 300, ->
|
||||
$(".img_container.first").fadeOut 300, ->
|
||||
$('#large .large-img').attr("src", link.attr("href"))
|
||||
$('#large .large-img').fadeIn()
|
||||
$("#large .large-img").one "load", ->
|
||||
$(".img_container.first").fadeIn()
|
||||
position_img();
|
||||
prev_link = link
|
||||
|
||||
@ -85,11 +119,13 @@ $("document").ready ->
|
||||
|
||||
|
||||
#titre = photo.find("h3")
|
||||
$('#large .large-img').fadeOut 300, ->
|
||||
$('#large .large-img').attr("src", link.attr("href"))
|
||||
$('#large .large-img').fadeIn()
|
||||
position_img();
|
||||
prev_link = link
|
||||
$(".img_container.first").fadeOut 300, ->
|
||||
$('#large .large-img').attr("src", link.attr("href"))
|
||||
$("#large .large-img").one "load", ->
|
||||
$(".img_container.first").fadeIn()
|
||||
position_img();
|
||||
|
||||
|
||||
false
|
||||
|
||||
|
||||
@ -13,6 +13,7 @@
|
||||
*= require superslides
|
||||
*= require lightSlider
|
||||
*= require jquery.bxslider
|
||||
|
||||
*= require_self
|
||||
*/
|
||||
|
||||
@ -34,34 +35,42 @@
|
||||
left:0;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background:rgba(156,200,102,1);//rgba(132,187,64,0.8);
|
||||
z-index:10;
|
||||
padding:50px;
|
||||
box-sizing: border-box;
|
||||
.next, .prev{
|
||||
width:20px;
|
||||
position:absolute;
|
||||
top:50%;
|
||||
transform:translateY(-50%);
|
||||
cursor:pointer;
|
||||
|
||||
|
||||
}
|
||||
.prev{
|
||||
left:15px;
|
||||
}
|
||||
.next{
|
||||
right:15px;
|
||||
}
|
||||
.large-img{
|
||||
cursor:pointer;
|
||||
max-height:100%;
|
||||
max-width:100%;
|
||||
|
||||
display:block;
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
background:rgba(0,0,0,0.8);//rgba(132,187,64,0.8);
|
||||
z-index:10;
|
||||
|
||||
.next, .prev{
|
||||
width:20px;
|
||||
position:absolute;
|
||||
top:50%;
|
||||
transform:translateY(-50%);
|
||||
cursor:pointer;
|
||||
|
||||
|
||||
}
|
||||
.prev{
|
||||
left:15px;
|
||||
}
|
||||
.next{
|
||||
right:15px;
|
||||
}
|
||||
|
||||
.img_container{
|
||||
height:100%;
|
||||
width:100%;
|
||||
|
||||
|
||||
box-sizing: border-box;
|
||||
|
||||
.large-img{
|
||||
cursor:pointer;
|
||||
padding:10px;
|
||||
background:white;
|
||||
|
||||
display:block;
|
||||
margin:auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
body{
|
||||
font-family:Lato;
|
||||
@ -86,28 +95,19 @@ right:15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.infos{
|
||||
h3{
|
||||
margin-top:5px;
|
||||
|
||||
hr{
|
||||
border:0px;
|
||||
border-bottom:1px solid rgba(250,250,250,0.6);
|
||||
|
||||
}
|
||||
.samples{
|
||||
min-width:400px;
|
||||
width:50%;
|
||||
float:right;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.gal{
|
||||
li{
|
||||
height:390px;
|
||||
height:540px;
|
||||
text-align:center;
|
||||
}
|
||||
img{
|
||||
height:350px;
|
||||
height:500px;
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
@ -277,23 +277,21 @@ width:560px;
|
||||
#cristal-protect, #my-strat{
|
||||
padding-bottom:0px;
|
||||
|
||||
.infos{
|
||||
|
||||
padding:1em;
|
||||
|
||||
|
||||
}
|
||||
.more{
|
||||
padding:0.5em 0;
|
||||
display:inline-block;
|
||||
|
||||
text-align:left;
|
||||
ul{
|
||||
margin-left:120px;
|
||||
.span{
|
||||
float:left;
|
||||
padding:0 10px;
|
||||
|
||||
}
|
||||
img{
|
||||
width:100px;
|
||||
margin:40px 10px;
|
||||
width:140px;
|
||||
margin:32px 0px;
|
||||
margin-right:20px;
|
||||
|
||||
float:left;
|
||||
}
|
||||
@ -309,30 +307,29 @@ width:560px;
|
||||
background:rgba(132,187,64,1);
|
||||
|
||||
|
||||
padding:0px;
|
||||
padding:55px 0px;
|
||||
position:relative;
|
||||
|
||||
h2{
|
||||
background:rgba(132,187,64,0.9);
|
||||
position:absolute;
|
||||
top:70px;
|
||||
padding:10px 20px;
|
||||
z-index:2;
|
||||
font-size:1.5em;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
#about{
|
||||
padding-top:70px;
|
||||
text-align:left;
|
||||
color:white;
|
||||
background:rgba(40,40,40,1);
|
||||
h2{
|
||||
text-align:center;
|
||||
font-size:2em;
|
||||
padding-bottom:30px;
|
||||
margin-bottom:0;
|
||||
font-weight:500;
|
||||
|
||||
}
|
||||
h3{
|
||||
margin-top:0px;
|
||||
padding-top:0px;
|
||||
padding-bottom:30px;
|
||||
text-align:center;
|
||||
font-weight:500;
|
||||
font-size:1.6em;
|
||||
}
|
||||
|
||||
}
|
||||
@ -365,9 +362,9 @@ background:rgba(132,187,64,1);
|
||||
right:0px;
|
||||
#logo-min{
|
||||
position:absolute;
|
||||
top:4px;
|
||||
top:5px;
|
||||
left:10px;
|
||||
height:35px;
|
||||
height:40px;
|
||||
display:none;
|
||||
|
||||
z-index:100;
|
||||
|
||||
@ -86,7 +86,7 @@
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border:1px solid rgba(10,10,10, 0.6);
|
||||
border:1px solid rgba(250,250,250, 0.9);
|
||||
margin: 0 5px;
|
||||
outline: 0;
|
||||
|
||||
@ -97,8 +97,8 @@
|
||||
|
||||
.bx-wrapper .bx-pager.bx-default-pager a:hover,
|
||||
.bx-wrapper .bx-pager.bx-default-pager a.active {
|
||||
background: rgba(10,10,10, 0.6);
|
||||
border:1px solid rgba(10,10,10, 0);
|
||||
background: rgba(250,250,250, 0.9);
|
||||
border:1px solid transparent;
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -61,17 +61,14 @@
|
||||
%li
|
||||
%img{alt: "Cinelli", src: "images/04.jpg"}/
|
||||
|
||||
%nav.slides-navigation
|
||||
%a.next{href: "#"} Next
|
||||
%a.prev{href: "#"} Previous
|
||||
|
||||
#menu-container
|
||||
#menu
|
||||
=link_to image_tag("/logo-min.png", :id => "logo-min"), "#home", :onclick => "scrollToAnchor('home');return false;"
|
||||
=link_to "Société", "#about", :onclick => "scrollToAnchor('about');return false;"
|
||||
=link_to "Présentation", "#about", :onclick => "scrollToAnchor('about');return false;"
|
||||
=link_to raw("Cristal Protect<sup>®</sup>"), "#cristal-protect", :onclick => "scrollToAnchor('cristal-protect');return false;"
|
||||
=link_to raw("MyStrat<sup>®</sup>"), "#my-strat", :onclick => "scrollToAnchor('my-strat');return false;"
|
||||
=link_to "Idées", "#brainstorming", :onclick => "scrollToAnchor('brainstorming');return false;"
|
||||
=link_to "Accompagnement", "#brainstorming", :onclick => "scrollToAnchor('brainstorming');return false;"
|
||||
=link_to "Réalisations", "#realisations", :onclick => "scrollToAnchor('realisations');return false;"
|
||||
=link_to "Contact", "#contact", :onclick => "scrollToAnchor('contact');return false;"
|
||||
|
||||
@ -80,22 +77,20 @@
|
||||
#about
|
||||
.center
|
||||
%h2
|
||||
Art des Sens, solutions décoratives personnalisées
|
||||
%br
|
||||
Solutions décoratives personnalisées
|
||||
%h3
|
||||
pour l’agencement, la décoration et la signalétique
|
||||
%p
|
||||
|
||||
Fort d’une expérience de plus de onze années dans les différentes technologies d’impression numérique, la société
|
||||
Fort d’une expérience de plus de onze années dans l’impression numérique, la société
|
||||
Art des Sens
|
||||
est spécialisée dans la commercialisation de supports imprimés, résistants aux agressions extérieures (UV, rayures, graffitis…)
|
||||
%p
|
||||
Mais au-delà de la fourniture de panneaux imprimés, selon vos besoins,
|
||||
En complément de la fourniture de panneaux imprimés et selon vos besoins, Art des Sens vous
|
||||
|
||||
Art des Sens
|
||||
|
||||
vous accompagnera dans l’étude, la conception, la fabrication et la pose de vos projets.
|
||||
accompagnera dans l’étude, la conception, la fabrication et la pose de vos projets.
|
||||
%p Ensemble, concrétisons vos idées...
|
||||
=image_tag "/sign.jpg", :style => "width:230px;float:right;padding-bottom:2em;"
|
||||
=image_tag "/sign.png", :style => "width:230px;float:right;padding-bottom:2em;"
|
||||
%p{:style => "clear:both;"}
|
||||
|
||||
#cristal-protect
|
||||
@ -106,64 +101,53 @@
|
||||
|
||||
=image_tag "/cristal-protect.png", :class => "icons"
|
||||
|
||||
%p Associé à la société Cris-Graphic, nous avons développé l’impression numérique haute définition pérenne.
|
||||
%p Associé à la société Cris-graphic, nous avons mis au point un procédé permettant de réaliser des impression numérique en haute définition et pérenne.
|
||||
%p
|
||||
Notre technologie consiste à encapsuler n’importe quelle image numérique au cœur d’un vernis UV extrêmement résistant. Ce traitement apporte à l’ensemble une résistance et une durabilité d’exposition en extérieur exceptionnelles.
|
||||
La technologie consiste à encapsuler n’importe quelle image numérique au cœur d’un vernis UV extrêmement résistant. Ce traitement apporte à l’ensemble une résistance et une durabilité d’exposition en extérieur exceptionnelles.
|
||||
%p Il est ainsi possible d'imprimer directement sur une grande variété de supports comme l'aluminium, des matériaux composites (Dibond<sup>®</sup>, Reynobond<sup>®</sup>, Alucore<sup>®</sup>, Forex<sup>®</sup>...), du verre et du bois.
|
||||
|
||||
.infos
|
||||
.center
|
||||
.samples
|
||||
%ul.gal
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/01.jpg"
|
||||
|
||||
Impression sur feuille aluminium brossé pour l'EHPAD de Rungis
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/02.jpg"
|
||||
|
||||
Impression pour les sites de l'Office National des Anciens combattants
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/03.jpg"
|
||||
Inclusion numérique pour les Monuments Nationaux
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/04.jpg"
|
||||
Réalisation d'une signalétique pour le Parc de l'Oise
|
||||
|
||||
|
||||
|
||||
|
||||
%h3 Caractéristiques techniques
|
||||
%p
|
||||
Supports disponibles :
|
||||
%ul
|
||||
%li Aluminium
|
||||
%li Composite (Dibond<sup>®</sup>, Reynobond<sup>®</sup>, Alucore<sup>®</sup>, Forex<sup>®</sup>...)
|
||||
%li Verre
|
||||
%li Bois
|
||||
%p Autre supports, nous consulter.
|
||||
|
||||
|
||||
.samples
|
||||
%ul.gal
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/01.jpg"
|
||||
|
||||
%p
|
||||
Format maximum disponnible :
|
||||
%ul
|
||||
%li 4000 x 1600 mm
|
||||
|
||||
%p Epaisseur maximum : 60 mm
|
||||
Impression sur feuille aluminium brossé pour l'EHPAD de Rungis
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/02.jpg"
|
||||
|
||||
%p
|
||||
Finitions disponibles :
|
||||
%ul
|
||||
%li Mat
|
||||
%li Brillant
|
||||
Impression pour les sites de l'Office National des Anciens combattants
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/03.jpg"
|
||||
Inclusion numérique pour les Monuments Nationaux
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/cristal-protect/04.jpg"
|
||||
Réalisation d'une signalétique pour le Parc de l'Oise
|
||||
|
||||
|
||||
.center
|
||||
|
||||
|
||||
.center
|
||||
%hr
|
||||
.more
|
||||
=image_tag "/more.png"
|
||||
%ul
|
||||
%li Bords tombés décorés.
|
||||
%li Découpe, façonnabge, gravure possible.
|
||||
%li Intégration de braille sur demande.
|
||||
%li Extrême résistance aux agressions extérieurs.
|
||||
%li Pas de minimum de commande.
|
||||
.span
|
||||
=image_tag "/more.png"
|
||||
.span
|
||||
%ul
|
||||
%li Bords tombés décorés.
|
||||
%li Découpe, façonnabge, gravure possible.
|
||||
%li Intégration de braille sur demande.
|
||||
%li Extrême résistance aux agressions extérieurs.
|
||||
%li Pas de minimum de commande.
|
||||
.span
|
||||
%ul
|
||||
%li Epaisseur maximum : 60 mm
|
||||
%li Finition : mat ou brillant
|
||||
%li Format maximum disponnible : 4000 x 1600 mm
|
||||
.clear
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -184,71 +168,49 @@
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.infos
|
||||
.center
|
||||
|
||||
.samples
|
||||
%ul.gal
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/mystrat/01.jpg", :class => ".preserve"
|
||||
|
||||
Découpe de lettres en stratifié
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/mystrat/02.jpg", :class => ".preserve"
|
||||
|
||||
Panneau en stratifié numérique & structure.
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/mystrat/03.jpg", :class => ".preserve"
|
||||
.samples
|
||||
%ul.gal
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/mystrat/01.jpg", :class => ".preserve"
|
||||
|
||||
Habillage de DAB en panneaux décorés.
|
||||
|
||||
|
||||
|
||||
Découpe de lettres en stratifié
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/mystrat/02.jpg", :class => ".preserve"
|
||||
|
||||
Panneau en stratifié numérique & structure.
|
||||
%li{:class => ".preserve"}
|
||||
=image_tag "/mystrat/03.jpg", :class => ".preserve"
|
||||
|
||||
Habillage de DAB en panneaux décorés.
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
%h3 Caractéristiques techniques
|
||||
%p
|
||||
Formats maximum disponibles :
|
||||
%ul
|
||||
%li 2440 x 1220 mm
|
||||
%li 3050 x 1300 mm
|
||||
%li 3660 x 1525 mm
|
||||
|
||||
%p
|
||||
Epaisseurs disponnibles :
|
||||
%p
|
||||
0,7mm, 3mm, 6mm, 8mm, 10mm et 20mm.
|
||||
%br/
|
||||
Autre épaisseurs, nous consulter.
|
||||
|
||||
%p
|
||||
Finitions disponibles :
|
||||
%ul
|
||||
%li Matte
|
||||
%li Brillant
|
||||
%p
|
||||
Impression recto/verso possible, nous consulter.
|
||||
|
||||
|
||||
.center
|
||||
%hr
|
||||
.more
|
||||
|
||||
=image_tag "/more.png"
|
||||
%ul
|
||||
%li Garantie 10 ans en extérieur.
|
||||
%li Découpe, façonnabge, gravure possible.
|
||||
%li Intégration de braille sur demande
|
||||
%li Extrême résistance aux agressions extérieurs
|
||||
%li Pas de minimum de commande
|
||||
.span
|
||||
=image_tag "/more.png"
|
||||
.span
|
||||
%ul
|
||||
%li Garantie 10 ans en extérieur.
|
||||
%li Découpe, façonnabge, gravure possible
|
||||
%li Intégration de braille sur demande
|
||||
%li Extrême résistance aux agressions extérieurs
|
||||
%li Pas de minimum de commande
|
||||
.span
|
||||
%ul
|
||||
%li Formats maximum disponibles : 3660 x 1525 mm
|
||||
%li Epaisseurs disponnibles : de 0,7mm à 20mm
|
||||
%li Impression recto/verso possible, nous consulter.
|
||||
%li Finitions disponibles : Matte et Brillant
|
||||
.clear
|
||||
.clear
|
||||
#brainstorming
|
||||
.center
|
||||
@ -306,7 +268,7 @@
|
||||
|
||||
#rea-gal
|
||||
-(1..10).each do |i|
|
||||
=link_to image_tag("/realisation/#{i}-p.jpg"), "/realisation/#{i}.jpg"
|
||||
=link_to image_tag("/realisation/#{i}-p.jpg"), "/realisation/#{i}.jpg", :data => {:title => "test",:lightbox => "image-1"}
|
||||
.clear
|
||||
#contact
|
||||
.center
|
||||
@ -314,9 +276,7 @@
|
||||
%p
|
||||
N'hésitez pas à nous contacter pour nous parler de votre projet !
|
||||
%p
|
||||
=image_tag "/logo-couleurs.png", :style => "width:300px;"
|
||||
%br
|
||||
%strong Thomas Blanc-Brude
|
||||
=image_tag "/logo-couleurs.png", :style => "width:400px;"
|
||||
%br
|
||||
296 rue de la Béalière
|
||||
%br
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 20 KiB |
BIN
public/more.png
BIN
public/more.png
Binary file not shown.
|
Before Width: | Height: | Size: 3.6 KiB After Width: | Height: | Size: 8.0 KiB |
BIN
public/sign.jpg
BIN
public/sign.jpg
Binary file not shown.
|
Before Width: | Height: | Size: 73 KiB After Width: | Height: | Size: 73 KiB |
Loading…
x
Reference in New Issue
Block a user