Joli Fablabo : Différence entre versions

De fablabo
Aller à : navigation, rechercher
(→‎Pages exemples contenant toutes les sortes d'éléments)
 
(54 révisions intermédiaires par 3 utilisateurs non affichées)
Ligne 3 : Ligne 3 :
 
|image=accueil maquette.png
 
|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==
 
==la maquette du nouveau style==
  
Ligne 16 : Ligne 20 :
 
à checker avec la nouvelle skin
 
à checker avec la nouvelle skin
  
−
les pages [[DataFab]] :
+
===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===  
+
====page projet====  
 
* un pas trop plein : cette page même
 
* un pas trop plein : cette page même
 
* un bien plein : [[Controleur_de_Lumière]]
 
* un bien plein : [[Controleur_de_Lumière]]
  
−
trucs bizarres : dans le [[Modèle:Projet]] l'apparence du cartouche est dépendante du statut du 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
 
Pour l'instant ça pilote la couleur, mais on peut juste mettre un tampon
  
−
===page machine===
+
bug relevé : le premier titre du texte libre n'apparait pas
 +
 
 +
====page machine====
  
 
le cartouche pour l'instant à droite est très laid
 
le cartouche pour l'instant à droite est très laid
Ligne 32 : Ligne 49 :
 
exemple :[[Laser_Smoothignstech]]
 
exemple :[[Laser_Smoothignstech]]
  
−
===Page usager===
+
====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====
  
  
−
===page logiciel===
+
exemple : [[Ibniz]]
  
 
rien de spécial si ce n'est un tableau
 
rien de spécial si ce n'est un tableau
Ligne 42 : Ligne 80 :
 
un autre tableau est visible sur [[Laser_Smoothignstech/Modedemploi#Vitesses_de_travail]]
 
un autre tableau est visible sur [[Laser_Smoothignstech/Modedemploi#Vitesses_de_travail]]
  
−
==trucs à intégrer dans le cahier des charges==
 
  
−
===page projet===
+
====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)
 +
 
  
−
le premier titre du texte libre n'apparait pas
+
===Sidebar : ===
  
−
==ressources==
+
- 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 ]
 
[ http://charlesmartinreid.com/wiki/Skinning_MediaWiki ]
 +
 +
===Typos===
 +
 +
http://www.fontsquirrel.com
 +
 +
http://openfontlibrary.org
 +
 +
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 »