Joli Fablabo : Différence entre versions

De fablabo
Aller à : navigation, rechercher
 
(63 révisions intermédiaires par 4 utilisateurs non affichées)
Ligne 1 : Ligne 1 :
 
{{Projet
 
{{Projet
 
|status=Prototype
 
|status=Prototype
 +
|image=accueil maquette.png
 
|description=faire ce site plus joli
 
|description=faire ce site plus joli
−
|contributeurs=Cedric , MOna  
+
|license=CC-by-sa-3.0
 +
|contributeurs=Cedric, MOna, Divag,
 
|inspiration=http://wiki.labomedia.net
 
|inspiration=http://wiki.labomedia.net
 +
|source=http://fablabo.net/wiki/Fichier:Vectorfablabo.skin.zip
 
}}
 
}}
 +
[[:File:vectorfablabo.skin.zip]]
 +
 +
==la maquette du nouveau style==
 +
 +
sobre et classieux
 +
 +
 +
 +
==Pages exemples contenant toutes les sortes d'éléments==
 +
 +
à checker avec la nouvelle skin
 +
 +
===les pages [[DataFab]] :===
 +
 +
 +
Les pages suivantes font partie d'un jeu de templates qui sont appelés à être redistribués sous forme de jeu de pages exportable.
 +
 +
il faut transplanter les css dans ...une page?
 +
 +
ou direct dans le texte :
 +
 +
{{#css:  body {    background: yellow;    font-size: 20pt;    color: red;  }}}
 +
 +
en utilisant https://www.mediawiki.org/wiki/Extension:CSS ? ou une autre solution
 +
 +
====page projet====
 +
* un pas trop plein : cette page même
 +
* un bien plein : [[Controleur_de_Lumière]]
 +
 +
particularité : dans le [[Modèle:Projet]] l'apparence du cartouche est dépendante du statut du projet
 +
 +
Pour l'instant ça pilote la couleur, mais on peut juste mettre un tampon
 +
 +
bug relevé : le premier titre du texte libre n'apparait pas
 +
 +
====page machine====
 +
 +
le cartouche pour l'instant à droite est très laid
 +
 +
exemple :[[Laser_Smoothignstech]]
 +
 +
====Page usager====
 +
 +
je suis [[Utilisateur:Cedric|Cobaille]]
 +
 +
sera amené à évoluer...
 +
 +
====Page Tache====
 +
 +
exemple : [[Récupération_d'impression3D_stoppée_en_cours_de_route]]
 +
  
  
 +
====Liste des projets====
  
 +
elle est là [[Accueil#Projets]] et est mise en forme avec [[Modèle:ListeProjets]]
  
 +
ça chie avec vector skin
  
 +
====Liste des machines et des outils====
  
 +
à refaire (dans la page d'[[Accueil]])
  
 +
====page logiciel====
  
  
 +
exemple : [[Ibniz]]
  
−
==la maquette du nouveau style==
+
rien de spécial si ce n'est un tableau
 +
 
 +
un autre tableau est visible sur [[Laser_Smoothignstech/Modedemploi#Vitesses_de_travail]]
 +
 
 +
 
 +
====formatages divers====
 +
 
 +
visibles dans [[Aide:Syntaxe]]
 +
 
 +
==skins de bases==
 +
 
 +
ici des pistes pour les skins de base
 +
 
 +
http://fablabo.net/mediawiki/index.php?title=Accueil&useskin=vector
 +
 
 +
==Trucs à intégrer dans le cahier des charges==
 +
 
 +
 
 +
 
 +
===À faire pour Mona et Cedric===
 +
 
 +
* cliner les menus
 +
* refaire la page d'accueil
 +
* rajouter en pied de page "Un site animé par l'association PiNG" + logo
 +
* un bouton(s) "partager" sur twitter, identica et diaspora
 +
* une page "trucs à faire et coups de main à donner"
 +
 
 +
===À faire pour Maelle===
 +
 
 +
[[Fablabo:Actualités]]
 +
 
 +
==Notes pour Gaetan==
 +
 
 +
 
 +
''Faire un border image avec CSS http://www.pompage.net/traduction/la-propriete-border-image-en-css3''
 +
 
 +
 
 +
Voici le dossier contenant les éléments actuels de la maquette (page accueil et page projet modifiées, typo, etc)
 +
[[Fichier:Maquette_elements.zip]]
 +
 
 +
Version de travail de mise en place du nouveau style :
 +
http://fablabo.net/wiki/Utilisateur:Divag/vector.css
 +
 
 +
===Pour le site en général :===
 +
 
 +
tout est dans [[MediaWiki:Common.css]]
 +
 
 +
- Se baser sur la skin vector
 +
 
 +
- Lignes en pointillés en svg pour les niveaux 1 et 2
 +
 
 +
- Grand cadre page = traits crayonnés
 +
 
 +
- Background blanc
 +
 
 +
- Logo rafraichi, 150x150px  -> à fournir par ping
 +
 
 +
- Puces : on part sur les flèches vers le côté et vers le bas, c'est la solution la plus claire
 +
 
 +
- Typo général : Arial / Typo titre à trancher par PiNG
 +
 
 +
- Couleurs :
 +
 
 +
    texte  #4d4d4d
 +
    liens #b46508
 +
    liens suivis  #fe8b04
 +
    liens cassés #c20000
 +
 
 +
===Menu top : ===
 +
 
 +
- barres séparations verticales des boutons édition : trait estompé
 +
 
 +
- garder menu déroulant de la skin vector
 +
 
 +
- bouton recherche : pas de fond grisé du bouton, faire propositions d'un look plus léger (meme typo que le logo)
 +
 
 +
 
 +
===Sidebar : ===
 +
 
 +
- séparation sidebar : garder les traits horizontés estompés de la skin vector
 +
 
 +
 
 +
===Page projet  :===
 +
 
 +
- pour le statut : tampon à cheval sur le cartouche // à revoir
  
−
sobre et classieux
+
==Ressources==
  
 +
[ http://charlesmartinreid.com/wiki/Skinning_MediaWiki ]
  
 +
===Typos===
  
−
==trucs à intégrer dans le cahier des charges==
+
http://www.fontsquirrel.com
  
−
===page projet===
+
http://openfontlibrary.org
  
−
le premier titre du texte libre n'apparait pas
+
http://velvetyne.fr/

Version actuelle en date du 18 février 2015 à 14:57


faire ce site plus joli



File:vectorfablabo.skin.zip

la maquette du nouveau style

sobre et classieux


Pages exemples contenant toutes les sortes d'éléments

à checker avec la nouvelle skin

les pages DataFab :

Les pages suivantes font partie d'un jeu de templates qui sont appelés à être redistribués sous forme de jeu de pages exportable.

il faut transplanter les css dans ...une page?

ou direct dans le texte :

{{#css: body { background: yellow; font-size: 20pt; color: red; }}}

en utilisant https://www.mediawiki.org/wiki/Extension:CSS ? ou une autre solution

page projet

particularité : dans le Modèle:Projet l'apparence du cartouche est dépendante du statut du projet

Pour l'instant ça pilote la couleur, mais on peut juste mettre un tampon 

bug relevé : le premier titre du texte libre n'apparait pas

page machine

le cartouche pour l'instant à droite est très laid

exemple :Laser_Smoothignstech

Page usager

je suis Cobaille

sera amené à évoluer...

Page Tache

exemple : Récupération_d'impression3D_stoppée_en_cours_de_route


Liste des projets

elle est là Accueil#Projets et est mise en forme avec Modèle:ListeProjets

ça chie avec vector skin

Liste des machines et des outils

à refaire (dans la page d'Accueil)

page logiciel

exemple : Ibniz

rien de spécial si ce n'est un tableau

un autre tableau est visible sur Laser_Smoothignstech/Modedemploi#Vitesses_de_travail


formatages divers

visibles dans Aide:Syntaxe

skins de bases

ici des pistes pour les skins de base

http://fablabo.net/mediawiki/index.php?title=Accueil&useskin=vector

Trucs à intégrer dans le cahier des charges

À faire pour Mona et Cedric

  • cliner les menus
  • refaire la page d'accueil
  • rajouter en pied de page "Un site animé par l'association PiNG" + logo
  • un bouton(s) "partager" sur twitter, identica et diaspora
  • une page "trucs à faire et coups de main à donner"

À faire pour Maelle

Fablabo:Actualités

Notes pour Gaetan

Faire un border image avec CSS http://www.pompage.net/traduction/la-propriete-border-image-en-css3


Voici le dossier contenant les éléments actuels de la maquette (page accueil et page projet modifiées, typo, etc) Fichier:Maquette elements.zip

Version de travail de mise en place du nouveau style : http://fablabo.net/wiki/Utilisateur:Divag/vector.css

Pour le site en général :

tout est dans MediaWiki:Common.css

- Se baser sur la skin vector

- Lignes en pointillés en svg pour les niveaux 1 et 2

- Grand cadre page = traits crayonnés

- Background blanc

- Logo rafraichi, 150x150px -> à fournir par ping

- Puces : on part sur les flèches vers le côté et vers le bas, c'est la solution la plus claire

- Typo général : Arial / Typo titre à trancher par PiNG

- Couleurs : 

   texte  #4d4d4d
   liens #b46508
   liens suivis   #fe8b04
   liens cassés #c20000

Menu top :

- barres séparations verticales des boutons édition : trait estompé

- garder menu déroulant de la skin vector

- bouton recherche : pas de fond grisé du bouton, faire propositions d'un look plus léger (meme typo que le logo)


Sidebar :

- séparation sidebar : garder les traits horizontés estompés de la skin vector


Page projet  :

- pour le statut : tampon à cheval sur le cartouche // à revoir

Ressources

[ http://charlesmartinreid.com/wiki/Skinning_MediaWiki ]

Typos

http://www.fontsquirrel.com

http://openfontlibrary.org

http://velvetyne.fr/

Récupérée de « https://archive.fablabo.net/mediawiki/index.php?title=Joli_Fablabo&oldid=13776 »