new design
This commit is contained in:
Nicolas Bally
parent
fbe51d20a4
commit
dfe98283b5
@ -1,9 +1,9 @@
|
||||
|
||||
#= require ./shared/jquery.js
|
||||
#= require jquery
|
||||
|
||||
#= require jquery_ujs
|
||||
|
||||
|
||||
#=require ./popover
|
||||
|
||||
|
||||
$ ->
|
||||
|
||||
@ -4,30 +4,32 @@
|
||||
@import "shared/superfish";
|
||||
@import "css3-mixins.scss";
|
||||
@import "public/layout";
|
||||
@import "public/articles";
|
||||
//@import "public/articles";
|
||||
@import "qi_grids";
|
||||
@import "popover";
|
||||
|
||||
|
||||
img{
|
||||
max-width:100%;
|
||||
|
||||
}
|
||||
body{
|
||||
padding:0;
|
||||
margin:0;
|
||||
|
||||
font-family:"museo-sans", serif;
|
||||
font-family:"freight-text-pro", serif;
|
||||
font-weight:500;
|
||||
font-size:15px;
|
||||
font-size:17px;
|
||||
line-height:1.6em;
|
||||
|
||||
}
|
||||
|
||||
p{
|
||||
line-height:1.4em;
|
||||
|
||||
}
|
||||
strong{
|
||||
font-weight:700;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
h1,h2,h3,h4{
|
||||
font-weight:normal;
|
||||
font-family:lato;
|
||||
font-family:"Lato";
|
||||
a{
|
||||
color:#1e1e1e;
|
||||
|
||||
@ -72,10 +74,6 @@ aside{
|
||||
|
||||
}
|
||||
|
||||
.article_infos{
|
||||
|
||||
margin-bottom:1em;
|
||||
}
|
||||
|
||||
.read{
|
||||
|
||||
|
||||
@ -1,11 +1,4 @@
|
||||
.widget{
|
||||
h2{
|
||||
font-family : "DanielRegular";
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.read{
|
||||
|
||||
display:block;
|
||||
@ -86,4 +79,5 @@
|
||||
font-size:0.8em;
|
||||
margin-bottom:1em;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,20 +1,30 @@
|
||||
body{
|
||||
padding:0px;
|
||||
background: url('/assets/front/fond.jpg');
|
||||
background: rgba(250,250,250,1);
|
||||
background-size:100%;
|
||||
|
||||
|
||||
|
||||
color: #333;
|
||||
}
|
||||
|
||||
#gradient{
|
||||
|
||||
|
||||
}
|
||||
header#top{
|
||||
display:block;
|
||||
|
||||
|
||||
.center{
|
||||
max-width:1200px;
|
||||
margin:auto;
|
||||
|
||||
}
|
||||
background: url('/assets/front/top.png') repeat-x;
|
||||
|
||||
img{
|
||||
width:120px;
|
||||
float:left;
|
||||
margin:20px 50px;
|
||||
margin:20px 0px;
|
||||
}
|
||||
|
||||
}
|
||||
@ -40,60 +50,43 @@ navigation#first_nav{
|
||||
}
|
||||
#main{
|
||||
|
||||
|
||||
|
||||
header{
|
||||
h1{
|
||||
margin-bottom:10px;
|
||||
}
|
||||
|
||||
h2{
|
||||
margin-top:0em;
|
||||
margin-bottom:1em;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
max-width:1200px;
|
||||
margin:auto;
|
||||
|
||||
img{
|
||||
max-width:100%;
|
||||
}
|
||||
|
||||
|
||||
article{
|
||||
margin-bottom:3em;
|
||||
border-top:2px solid #97bc4a;
|
||||
padding-top:1em !important;
|
||||
aside{
|
||||
img{
|
||||
display:none;
|
||||
}
|
||||
|
||||
*{
|
||||
display:inline;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
#corps{
|
||||
background:white;
|
||||
padding:40px;
|
||||
float:left;
|
||||
width:70%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.article_corps{
|
||||
background:white;
|
||||
|
||||
}
|
||||
#sidebar{
|
||||
padding:0% 2%;
|
||||
padding:20px;
|
||||
margin-left:70%;
|
||||
box-sizing: border-box;
|
||||
|
||||
|
||||
|
||||
background:#97bc4a;
|
||||
|
||||
|
||||
img{
|
||||
margin:0.5em 0;
|
||||
}
|
||||
|
||||
|
||||
color:white;
|
||||
|
||||
h3,a{
|
||||
color:white;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
@ -144,405 +137,10 @@ footer{
|
||||
|
||||
|
||||
|
||||
@media only screen and (min-width: 0px) {
|
||||
|
||||
header#top{
|
||||
|
||||
img{
|
||||
width:120px;
|
||||
|
||||
margin:20px 5%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#main{
|
||||
margin:auto;
|
||||
|
||||
max-width:800px;
|
||||
width:90%;
|
||||
}
|
||||
|
||||
#sidebar{
|
||||
margin:auto;
|
||||
padding:2% !important;
|
||||
max-width:800px;
|
||||
width:86%;
|
||||
|
||||
img{
|
||||
margin:0.5em 0;
|
||||
max-width:98%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.img_with_legend{
|
||||
position:relative;
|
||||
|
||||
figcaption{
|
||||
margin-top:5px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (min-width: 769px) {
|
||||
|
||||
|
||||
#main{
|
||||
margin-left:2%;
|
||||
|
||||
|
||||
max-width:800px;
|
||||
width:69%;
|
||||
float:left;
|
||||
|
||||
padding:0px;
|
||||
|
||||
|
||||
article{
|
||||
padding:0px 6%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#sidebar{
|
||||
float:right;
|
||||
width:23%;
|
||||
padding-top:0px !important;
|
||||
min-height:1000px;
|
||||
|
||||
img{
|
||||
max-width:100%;
|
||||
margin:0.5em 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//@media only screen and (min-width: 0px) {
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (min-width: 950px) {
|
||||
|
||||
|
||||
#main{
|
||||
margin-left:5%;
|
||||
|
||||
width:64%;
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1200px) {
|
||||
|
||||
|
||||
#main{
|
||||
margin-left:18%;
|
||||
|
||||
width:53%;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#sidebar{
|
||||
|
||||
padding-top:0em !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
article{
|
||||
position:relative;
|
||||
|
||||
|
||||
|
||||
aside{
|
||||
|
||||
display:block;
|
||||
position:absolute;
|
||||
left : -39%;
|
||||
|
||||
top:-2px;
|
||||
padding-top:0em;
|
||||
line-height:1.6em;
|
||||
width:42%;
|
||||
|
||||
text-align:center;
|
||||
|
||||
|
||||
p{
|
||||
margin:0px;
|
||||
display:block !important;
|
||||
}
|
||||
|
||||
img{
|
||||
display:block !important;
|
||||
margin:auto;
|
||||
border-radius:50%;
|
||||
}
|
||||
|
||||
time{
|
||||
display:block;
|
||||
|
||||
}
|
||||
|
||||
*{
|
||||
text-align:center;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.img_with_legend{
|
||||
position:relative;
|
||||
|
||||
figcaption{
|
||||
display:block;
|
||||
position:absolute;
|
||||
left : -35%;
|
||||
width:32%;
|
||||
top:10px;
|
||||
|
||||
*{
|
||||
text-align:right;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
#comments{
|
||||
|
||||
.comment{
|
||||
margin-bottom:3em;
|
||||
|
||||
aside{
|
||||
|
||||
img{
|
||||
float:left;
|
||||
margin:auto;
|
||||
border-radius:50%;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
blockquote{
|
||||
|
||||
text-align:justify !important;
|
||||
border-color : #97bc4a;
|
||||
min-height:3em;
|
||||
padding-right:0px;
|
||||
|
||||
p{
|
||||
text-align:justify !important;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.header, blockquote{
|
||||
margin-left:100px;
|
||||
|
||||
}
|
||||
|
||||
.header{
|
||||
font-size: 0.95em;
|
||||
line-height:1.6em;
|
||||
|
||||
img{
|
||||
display:none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
#comment_form{
|
||||
background:#e4f1d5;
|
||||
background-color:rgba(127,182,55,0.2);
|
||||
padding:20px;
|
||||
padding-bottom:35px;
|
||||
margin:0px 0px 0px 0px;
|
||||
|
||||
h3{
|
||||
margin-top:0px;
|
||||
text-transform:uppercase;
|
||||
|
||||
}
|
||||
|
||||
input,textarea{
|
||||
background:white;
|
||||
background-color:rgba(255,255,255,0.8);
|
||||
padding:1%;
|
||||
|
||||
}
|
||||
|
||||
textarea{
|
||||
line-height:1.6em;
|
||||
|
||||
}
|
||||
|
||||
label{
|
||||
display:inline-block;
|
||||
min-width:90px;
|
||||
padding:5px;
|
||||
|
||||
}
|
||||
|
||||
.submit{
|
||||
float:right;
|
||||
@include border-radius(10px);
|
||||
margin-top:-16px;
|
||||
cursor:pointer;
|
||||
|
||||
&:hover{
|
||||
background:#97bc4a;
|
||||
color:white;
|
||||
|
||||
}
|
||||
padding:1% 2%;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
//iPhone
|
||||
@media only screen and (max-width: 480px) {
|
||||
|
||||
|
||||
|
||||
|
||||
body{
|
||||
font-size:50%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 320px) {
|
||||
|
||||
|
||||
|
||||
|
||||
body{
|
||||
font-size:75%;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width: 600px) {
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
header#top{
|
||||
|
||||
text-align:center;
|
||||
img{
|
||||
float:none;
|
||||
display:block;
|
||||
margin:auto;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
navigation{
|
||||
text-align:center;
|
||||
float:none;
|
||||
display:block;
|
||||
margin-top:10px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#comment_form{
|
||||
margin:0px !important;
|
||||
}
|
||||
|
||||
#comments{
|
||||
|
||||
.comment{
|
||||
|
||||
aside{
|
||||
|
||||
img{
|
||||
float:left;
|
||||
margin:auto;
|
||||
border-radius:50%;
|
||||
width:40px;
|
||||
height:40px;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
.header, blockquote{
|
||||
margin-left:50px;
|
||||
|
||||
}
|
||||
blockquote{
|
||||
margin-left:10px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
footer{
|
||||
@ -584,3 +182,27 @@ footer{
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.article_small{
|
||||
|
||||
margin-bottom:20px;
|
||||
position:relative;
|
||||
h1{
|
||||
text-align:center;
|
||||
|
||||
}
|
||||
background:white;
|
||||
|
||||
padding:10px;
|
||||
padding-left:120px;
|
||||
.img{
|
||||
width:100px;
|
||||
position:absolute;
|
||||
|
||||
top:10px;
|
||||
left:10px;
|
||||
background-size:cover;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,9 +4,9 @@
|
||||
=form.input :category_id, :as => :select, :collection => Category.order(:name)
|
||||
= form.input :enabled,:as => :boolean , :label => "Actif"
|
||||
= form.input :published_at, :label => "Date de publication : ",:as => :qi_date_picker
|
||||
|
||||
= form.input :image_file_id, :label => "Image :" , :as => :qi_image_select
|
||||
= form.input :title, :label => "Titre :"
|
||||
= form.input :title_cached,:as => :boolean , :label => "Titre masqué ?"
|
||||
=# form.input :title_cached,:as => :boolean , :label => "Titre masqué ?"
|
||||
=# form.input :slug, :label => "Slug :"
|
||||
|
||||
= form.input :description, :label => "Description courte :", :as => :text
|
||||
|
||||
@ -19,6 +19,7 @@
|
||||
<script src="//use.typekit.net/siq4hcp.js"></script>
|
||||
<script>try{Typekit.load();}catch(e){}</script>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
=javascript_include_tag "http://maps.google.com/maps/api/js?sensor=false®ion=FR"
|
||||
=render :partial => "public/shared/ga"
|
||||
|
||||
%body
|
||||
@ -27,31 +28,34 @@
|
||||
|
||||
%header#top
|
||||
|
||||
=link_to image_tag("front/logo.png"), "/"
|
||||
.center
|
||||
=link_to image_tag("front/logo.png"), "/"
|
||||
|
||||
%navigation#first_nav
|
||||
=link_to "A propos", "/a-propos-de-nicolas-bally.html"
|
||||
=link_to "Blog", "/"
|
||||
%navigation#first_nav
|
||||
=link_to "A propos", "/a-propos-de-nicolas-bally.html"
|
||||
=link_to "Blog", "/"
|
||||
|
||||
=link_to "Contact", "/contact.html"
|
||||
=link_to "Contact", "/contact.html"
|
||||
|
||||
|
||||
%p{:style => "clear:both;"}
|
||||
#main=yield
|
||||
%p{:style => "clear:both;"}
|
||||
|
||||
%section#sidebar
|
||||
|
||||
%h3=link_to "À propos", "/a-propos-de-nicolas-bally.html"
|
||||
|
||||
#main
|
||||
#corps{:class => ("article_corps" if @article)}=yield
|
||||
|
||||
%section#sidebar
|
||||
=render :partial => "public/articles/sidebar_recents"
|
||||
|
||||
|
||||
%h3 Mes activités
|
||||
%ul
|
||||
%li= link_to "Création de site web", "http://www.quartz-agence.com", :title => "Site de l'agence Nicolas Bally, création de sites web", :target => "_blank"
|
||||
%li= link_to "Photographie", "http://www.nicolasbally.com", :title => "Site photo de Nicolas Bally, Photographe", :target => "_blank"
|
||||
%h3 Mes activités
|
||||
%ul
|
||||
%li= link_to "Création de site web", "http://www.quartz-agence.com", :title => "Site de l'agence Nicolas Bally, création de sites web", :target => "_blank"
|
||||
%li= link_to "Photographie", "http://www.nicolasbally.com", :title => "Site photo de Nicolas Bally, Photographe", :target => "_blank"
|
||||
|
||||
|
||||
|
||||
%p{:style => "clear:both;height:1px;margin-top:0px;"}
|
||||
.clear
|
||||
|
||||
|
||||
%footer
|
||||
|
||||
@ -1,35 +1,20 @@
|
||||
%article
|
||||
|
||||
|
||||
%header
|
||||
|
||||
|
||||
|
||||
|
||||
%h1=link_to article.title, article_path(:slug => article.slug), :title => "Blog de Nicolas Bally "+article.title.to_s
|
||||
|
||||
.article_infos
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
%time.updated{:datetime => Time.now, :pubdate => true}
|
||||
Publié
|
||||
="le "+l(article.published_at, :format => :human_date)
|
||||
|
||||
="-"
|
||||
-if article.comments.count == 0
|
||||
=link_to "Pas de commentaires", article_path(:slug => article.slug, :anchor => "comments")
|
||||
-elsif article.comments.count == 1
|
||||
=link_to "1 commentaire", article_path(:slug => article.slug, :anchor => "comments")
|
||||
-else
|
||||
=link_to "#{article.comments.count} commentaires", article_path(:slug => article.slug, :anchor => "comments")
|
||||
|
||||
.desc
|
||||
%a{:href => article_path(:slug => article.slug)}= article.description
|
||||
%a.read{:href => article_path(:slug => article.slug)} Lire la suite
|
||||
|
||||
.article_small
|
||||
-if article.image_file
|
||||
%a{:href => article_path(:slug => article.slug)}=image_tag(article.image_file.file.large.medium.url, :alt => "")
|
||||
=image_tag(article.image_file.file.square.url, :class => "img")
|
||||
|
||||
|
||||
|
||||
%h3=link_to article.title, article_path(:slug => article.slug), :title => " "+article.title.to_s
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
%p.article_infos
|
||||
|
||||
|
||||
|
||||
%time.updated{:datetime => Time.now, :pubdate => true}
|
||||
|
||||
="le "+l(article.published_at, :format => :human_date)
|
||||
|
||||
|
||||
@ -1,35 +1,24 @@
|
||||
%article
|
||||
|
||||
%header
|
||||
|
||||
%aside
|
||||
<img src="http://www.gravatar.com/avatar/199574623fb5c99b721233fb31bee19f.png" class="avatar avatar-50 photo" >
|
||||
|
||||
%p
|
||||
Article de
|
||||
%strong
|
||||
|
||||
Nicolas Bally
|
||||
|
||||
|
||||
%time.updated{:datetime => Time.now, :pubdate => true}
|
||||
publié
|
||||
="le "+l(article.published_at, :format => :human_date)
|
||||
|
||||
%p{:style => "margin-top:1em;"}
|
||||
-if article.comments.count == 0
|
||||
=link_to "Pas de commentaires", article_path(:slug => article.slug, :anchor => "comments")
|
||||
-elsif article.comments.count == 1
|
||||
=link_to "1 commentaire", article_path(:slug => article.slug, :anchor => "comments")
|
||||
-else
|
||||
=link_to "#{article.comments.count} commentaires", article_path(:slug => article.slug, :anchor => "comments")
|
||||
|
||||
|
||||
|
||||
|
||||
%h1=link_to article.title, article_path(:slug => article.slug), :title => "blog conseil en image : "+article.title.to_s
|
||||
|
||||
%h2= article.description
|
||||
%header
|
||||
|
||||
|
||||
%p.article_infos
|
||||
|
||||
=render article.block
|
||||
|
||||
|
||||
|
||||
%time.updated{:datetime => Time.now, :pubdate => true}
|
||||
|
||||
="le "+l(article.published_at, :format => :human_date)
|
||||
|
||||
="-"
|
||||
=link_to i(:"comment-o")+" "+article.comments.count.to_s, article_path(:slug => article.slug, :anchor => "comments")
|
||||
|
||||
|
||||
|
||||
%h1=link_to article.title, article_path(:slug => article.slug), :title => "blog conseil en image : "+article.title.to_s
|
||||
|
||||
|
||||
=render article.block
|
||||
|
||||
%hr
|
||||
@ -1,8 +1,4 @@
|
||||
|
||||
.recents.widget
|
||||
%h3 Articles récents
|
||||
%ul
|
||||
-Article.recents.limit(10).each do |article|
|
||||
%li= link_to article.title, article_path(:slug => article.slug),:title => "Blog conseil en image - "+article.title.to_s
|
||||
|
||||
|
||||
=render Article.recents.limit(10)
|
||||
@ -1,7 +1,8 @@
|
||||
|
||||
-if @index_title
|
||||
%h1=@index_title
|
||||
=render :partial => "public/articles/article", :collection => @articles, :as => "article"
|
||||
=render :partial => "public/articles/article_intro", :collection => @articles, :as => "article"
|
||||
.clear
|
||||
#articles_pagination= paginate @articles
|
||||
|
||||
|
||||
BIN
public/arrow-next.png
Executable file
BIN
public/arrow-next.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
BIN
public/arrow-prev.png
Executable file
BIN
public/arrow-prev.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
BIN
public/close.png
Normal file
BIN
public/close.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.7 KiB |
BIN
public/controls.png
Executable file
BIN
public/controls.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Loading…
x
Reference in New Issue
Block a user