Forum

Discussions Générales [Wip] Babsolune BBCode maxi best of plus

babsolune Membre non connecté

Modérateur

Rang

Avatar

Equipe Graphique

Inscrit le : 16/05/2008 à 12h52

Messages: 2296

Le 01/12/2013 à 13h04
Ce topic est destiné à la présentation de l'évolution des thèmes et des modules que je proposerai au téléchargement, évolution à laquelle j'invite chacun à participer/critiquer.
Chaque thème/module fini fera l'objet d'un nouveau topic afin d'en assurer le support plus facilement

Thèmes

Nom Version PBT initiale Support Téléchargement
Blog Booster 4.0 4.0 - 4.1
Dojo 4.0 4.0
United Colors 4.1 4.1 - 5.0
Lanzarote 4.1 4.1
Iceland 4.1 4.1
Valley 4.1 4.1
Blue Stones 5.0 forum 5.0


Modules

Nom Version PBT initiale Support Téléchargement
HomeLanding 5.0 forum 5.0
countdown 5.0 forum 5.0
Lastcoms 5.0 forum 5.0

Edité par babsolune Le 19/12/2016 à 11h44


Site web    
babsolune Membre non connecté

Modérateur

Rang

Avatar

Equipe Graphique

Inscrit le : 16/05/2008 à 12h52

Messages: 2296

Le 01/12/2013 à 13h05
Je la vois, je peux la toucher, jouer avec, mais je sais qu'elle n'est qu'en version d'évolution et que ça ne manque pas de "commit". Alors vraiment travailler dessus reste difficile pour moi puisque soumis à une mise à jour quotidienne avec des morceaux de stratosphère dedans (voir googlecode). "La", il s'agit bien sur de la V4.1 et ses promesses de nuits courtes.
Frustré donc, je me suis réfugié chez mon p'tit dreamweaver (j’entends les rires au fond) en cs4 (ah? tiens! y en a un qui s'étouffe), et suis parti avec une 4.0 et pour seul objectif : 4.1.
Vaste programme...

J'ai commencé à sortir les vieux themes, certains à peine commencés d'autres à qui il ne manque plus qu'une touche de je ne sais quoi pour être déclaré apte à être partagé, et puis la réalité refait surface, à quoi bon, de toute façon, faudra refaire en 4.1. Et de frustrations en idées nouvelles, j'ai fini par vider la bouteille de whisky.

Je me permet donc un instant de lucidité, pour vous présenter quelques images des thèmes qui auront la joie et l'arrogance d'orner mon tableau de chasse dans cette savane numérique.

Aquazen/blackwater



que dire, ... theme base un peu raboté et une slidebox (css only) 6 images en guise de background
le nom reste à définir. un premier pas vers le responsive, mais il reste du boulot.
Theme avec son propre pack d'icones, du temps ou je n'avais pas encore mis le lien vers les icones fonts sur le forum (si si relisez bien c'est moi qui en ai parlé le premier, juste avant de passer 4 jours à refaire le pack :mat )
bref j'aime bien son coté transparence sombre, attention toute fois à ne mettre que des background avec peu de détails.

Eclip's



Theme issu d'eclips.fr, gamers sur Cs Go, je leur faisais un thème en échange de son partage ici. Cela demande encore pas mal de boulot notamment pour les menus en animation css3 non supportées par tous les navigateurs.
Coté design je me suis essayé au Sci-Fi, ça mérite quelques détails en plus, à peaufiner.

50 Shades of Grey



Décliné sur un site de club sportif, j'ai surtout bossé sur une admin alternative.
on retrouve le background en slide avec 6 fonds identiques, différents par leur couleur.
l'image header/fond est basée sur la première image que je connaisse de phpboost: la page d'accueil du pdf de présentation de la 1.6
Diverses animations css3 sobres et douces sur le menus et le header
le top header est fixe
module connect revu pour etre adapté à FontAwesome 3.1(**fail**) qui régit les icônes. ah ça va y aller du <i class :)
d'ailleurs, l'admin en est truffée avec mention pour les icônes modules qui en ont 2, une FA et la leur en 16px, gonflé le type !!
J'apprends aussi que qui veut entreprendre cette profonde modification de l'administration, doit pouvoir se nourrir de lait d'alpaga, que l'on doit traire entre le début de la lune montante, et le crépuscule de cygnes.
cote responsive, j'utilise le menu horizontal déroulant dans le top header et je switch en menu vertical déroulant à 980px ce qui oblige à déclarer 2 fois le meme menu, mais donne une expérience utilisateur plus actuelle en attendant les solutions futures de pbt

Blackadam



Aux couleurs de pbt, il est né la première fois que j'ai touché la 4.1. Je l'ai continué sur la 4.0, ce n'était pas jouable. En 4.05 exactement, mais on y reviendra. Là, je me kiff trop ma page d'accueil mais le module HomeSlide n'est pas prévu sur cette page. Un module "accueil" n’étant pas prévu avant la 4.2, je serai amené à en reparler.
Slidebox sur les news, images sur les feeds .
tous les menus dépliants sont déclarés en horizontal déroulant, modifié selon son emplacement.(prochain sur la liste: bottom_central)
J'ai mis longtemps avant de mettre les module_mini_top en bleu, sans, c'est pas mal aussi.
responsive: à 980 le div#right passe à gauche

UI Boost



Le p'tit dernier. Je pense utiliser seulement le vert dans la version finale, plutôt que cette version multicolore. à voir si ça plait .
Je suis parti d'un UI kit trouvé sur le net, plus quelques sites-conseil pour taper dans les couleurs du flat même si ça manque d'air pour du flat véritable. icônes en FA 3.1 "icon-" renommé en "pbt-icon-" la veille de FA 4.0(**triple fail**) Perso je verrai bien un "pbt-" tout court mais il semble qu'on s'achemine vers un "icon-" pour pbt 4.1
Là, j'ai développé sur du 4.06 et ma page d'accueil ne se comporte pas comme sur la précédente en 4.05=>4.06, il faut (non, mais on avait dit qu'on ne parlait pas du HomeSlide - oui mais on s'en fout là, c'est tellement long que les gens ont décroché ... laisse moi finir qu'on aille au lit - ben justement, reste sur la 4.1 )
bon.. j'en étais où, ah oui, la shoutbox, alors si une bonne ame veut bien me montrer comment ajouter l'avatar dans la mini, je lui fais des gros bisoux. J'arrive à modifier le x-machin-request, j'ai left join la table exented pour l'avatar dans le fichier_mini.php qui va bien, j'ai bien essayé de copier l'appel du fichiernormaldumodule.php mais mes connaissance m'ont dit "non, ça doit pas être ça" quand elles ont vu le résultat.

Extra



Quoi?? avec tout ça, y a des bonus ?

Wesh gros, spéciale dediboost au patron
Alors j'ai quand meme réussi à coder sur la version 4.1 que j'ai récup (me demande pas comment, je ne sais pas toi-même)
Celui là, je ne le commenterai pas. juste que cette premiere tentative d'adaptation peut donner des idées alors je partage ;)

Voila voila
pour ceux qui sont arrivés jusque là, sachez que je mettrai en place, dès le lancement de la 4.1, un site dédié pour chaque thème.
Pour ceux qui souhaiteraient m'aider ou juste me conseiller, mon but premier, après celui de transposer les thèmes de 4.0 à 4.1, est de proposer chaque thème le plus complet possible, 1, 2 ou 3 colonnes, des menus et mini_modules graphiquement présentables dans tous les emplacements etc etc.
En attendant vous pouvez déjà réagir "ouaisheuu, celui là il est....heu??? spécial ." par exemple ou piquer des idées,

Je t'invite, toi le graphiste, mais ça marche aussi pour les dev, à copier mon initiative. Partage ton travail pendant sa création, au delà de ton expérience personnelle, tu enrichis la communauté de débats dont elle peut se nourrir ;)

Amen

Ah si j'oubliais... je veux bien apprendre à faire une livrée plus étoffée en article, et faire des articles.
je ne demande pas le développement d'un bouton "ajouter du contenu" à l'instal, j'ai juste envie de remplir le fichier install.php des modules et je pense que ça peut être très utile pour le développement des thèmes, un genre de livrée sdk sur gonflée.
Une image qui sort de la page, un mini_module dans un autre parce qu'on n'a pas prévu qu’après 5 articles, il y a un décalage (c'est un exemple hein n'allez pas chercher une coquille :p ) bref tous ces petits riens qui t'oblige à la longue à refaire et refaire refaire re des articles pour être sur de ne rien oublier, copiécollé il est sympa mais bon, partant du principe que chaque développement d'un thème nécessite son propre pbt, ça devient toride.
Donc si c'est possible, cool, mais interdit de s'y pencher avant la 4.1


Site web    
ElenWii Membre non connecté

Administrateur

Rang

Avatar

Equipe Graphique

Inscrit le : 14/08/2009 à 19h01

Messages: 4754

Le 01/12/2013 à 19h18
Ah ouai :)

Je vois que tu attend avec impatience que la 4.1 arrive. Tu me vois ravi.

J'attend avec impatience de voir tout ces petits rejoindre le rang :D

Merci babso pour cette alléchante présentation.
Site web    
lobab Membre non connecté

Booster Mortier

Rang

Avatar

Inscrit le : 25/02/2012 à 19h11

Messages: 602

Le 01/12/2013 à 19h48
Salut le graphiste fou,

bah .... que dire ... ça promet grave en qualité :top

Je suis fan à donf :love :+1


La puissance est un sommet de connaissances et l'intelligence est le moyen d'y accéder ... Est-ce pour ça qu'il y a tant de cons en bas des pistes ???
Heureux celui qui est sourd, lui au moins, peut écouter le silence :D
   
riptide Membre non connecté

Booster Roquette

Rang

Avatar

Inscrit le : 29/02/2012 à 04h18

Messages: 297

Le 01/12/2013 à 20h13
Bonsoir,

Sont tous magnifique :top , j'ai une préférence pour UI Boost avec toutes ses belles couleur et sont apparence moderne :| Edité par riptide Le 01/12/2013 à 20h13
Shoot Membre non connecté

Booster Bazooka

Rang

Avatar

Inscrit le : 14/08/2012 à 11h52

Messages: 201

Le 02/12/2013 à 11h26
Tous ces thèmes sont très jolie, bon travail !
   
forum6691 Membre non connecté

Booster Mortier

Rang

Avatar

Inscrit le : 04/10/2009 à 19h54

Messages: 846

Le 03/12/2013 à 06h43
Put.... comme on dit chez nous, ça en jette. J'ai l'impression avec certains thèmes de voir des CMS concurrents tellement c'est beau graphiquement.

Bravo en tout cas pour ce travail de précision. :clap :clap :clap


Testeur V5
   
babsolune Membre non connecté

Modérateur

Rang

Avatar

Equipe Graphique

Inscrit le : 16/05/2008 à 12h52

Messages: 2296

Le 03/12/2013 à 12h12
merci les gens :)


Site web    
forum6691 Membre non connecté

Booster Mortier

Rang

Avatar

Inscrit le : 04/10/2009 à 19h54

Messages: 846

Le 08/12/2013 à 18h19
Moi les thèmes 50 Shades of Grey et UI boost m'intéressent vraiment.

J'attends apprement leur mise à dispo.


Testeur V5
   
Patoufix Membre non connecté

Booster Roquette

Rang

Avatar

Inscrit le : 13/11/2012 à 17h30

Messages: 275

Le 09/12/2013 à 11h43
Quel boulot de Ouf! J'adore Blackadam dans sa présentation.

Bravo l'artiste.


Salut à tous
Monde...Raymonde et Patoufix...Patrice
Le site de Mon Moto Club en PHPBoost : www.mcleopards.fr
Notre Blog : Ma Fiat 850 : http://poukynette.wordpress.com
Mon coté Artiste : Peintures et Photos : http://www.photopat.free.fr
Site web    
TheWWorld Membre non connecté

Booster Fronde

Rang

Avatar

Inscrit le : 07/04/2013 à 12h31

Messages: 24

Le 09/12/2013 à 19h11
On peut avoir une date de sortie silteplait ? :p

Les thèmes sont très beau.
Extra et Brackadam m'attire vraiment .
L'administration du thèmes " 50 Shades of Grey "
Sera t'elle téléchargeable sans le thèmes lui même ,

Merci et bonne chance , j'attend avec impatience .
L'administration du thèmes " 50 Shades of Grey " Il n'y a que du CSS et du Php ?


Le mensonge n'est qu'un soupçon de vérité.
   
babsolune Membre non connecté

Modérateur

Rang

Avatar

Equipe Graphique

Inscrit le : 16/05/2008 à 12h52

Messages: 2296

Le 09/12/2013 à 20h56
une date heu ... apres la 4,1 :) promis xD

pour l'admin de 50 shades j'ai juste modifié le menu rapide (menu spécifique à chaque rubrique). le menu de navigation est celui pbt, j'ai juste inversé le positionnement (menu hor=>vert et dépliage vert=>hor)

etant donné la profonde restructuration de la mise en page de l'admin , elle ne peut se faire sans toucher aux admin des modules, ce qui représente un petit siecle de boulot. coté adaptation à un thème il faudra surement faire quelques modif sur le pack, ça devrait être jouable.


Site web    
Benjo Membre non connecté

Booster Fronde

Rang

Avatar

Inscrit le : 18/09/2013 à 22h06

Messages: 24

Le 16/12/2013 à 18h53
Alors moi perso j'attends vraiment impatiemment UI Boost qui m'a tout simplement l'air superbe! :top
   
forum6691 Membre non connecté

Booster Mortier

Rang

Avatar

Inscrit le : 04/10/2009 à 19h54

Messages: 846

Le 16/12/2013 à 21h10
Oui on dirait du windows 8. C'est très tendance 2013-2014


Testeur V5
   
babsolune Membre non connecté

Modérateur

Rang

Avatar

Equipe Graphique

Inscrit le : 16/05/2008 à 12h52

Messages: 2296

Le 22/12/2013 à 18h07
"C'est en cherchant un raccourci qu'il ne trouva jamais, qu'il les a rencontrés..."



Après des heures de lutte acharnée contre cet encensuré de float qui te met un gros doigt dans le flux dès qu'on lui demande un peu plus de souplesse, je décidai de couper un peu avec la surdose d'informations que me prodiguait chaque google clic. "am' suis fait une ch'tite liste de sites webdesign-tiens-toi-au-courant sur z'book, ava m'détendre les yeux tout ces beau design tout frais". coincidence? pas du tout. en fait.. rien... à peine plus que lors de mon dernier passage. bon... dépité je décide d'aller m'en jeter un sur Alsacréations, quand un type m'interpelle: " tu te souviens quand tu as essayé de créer une table en div ?". Je me retourne, personne. Normal, je suis dans mon bureau... je regarde le chien... il dort..."mais si, souviens toi, le table-flex...". ???. Je suis sorti précipitament, immédiatement suivi par brouillard de ce qui semblait être un conglomérat de bouts de code en suspension. Le soleil a eu la même idée, ce qui m'a suffisament appaisé pour arrêter de croire que j'avais "entendu" cette conversation.

De retour au dessus du clavier je tapais fébrilement, table-flex, qui m'amena vers un display:block-flex et enfin un display:flex. j'avais mon sésame.

C'est fou non? je passe des heures à essayer de décrire au mieux la fonction que je cherche à réaliser, en vain, et son simple nom m'ouvre les portes de toute la doc dans ses moindres détails. w3c, alsacreations, dev.mozilla, tous ceux qui se refusaient à mes recherches, me déroulaient soudainement leur plus beaux tapis rouge.

Je poussais donc la porte pour rester bouche bée ... à la fois si simplement petit mais aux trésors si prestigieux. Il y avait là, le graal tenu par Arthur lui-même, la toison d'or servait de présentoir à la corne d'abondance, 1000 vierges portant chacune un exemplaire de la clef des mines du roi Salomon.

Bon après, il y a un type qui t'explique que le bâtiment est encore en travaux, la corne ne répond pour l'instant qu'en américain, quelques vierges ne le sont plus trop (ben oui faut tester)et qu'ils mettront plus de blondes, maisque dans les grandes lignes tout est fonctionnel et que si je veux profiter des mines, c'est entièrement disponible.

Je taille le bout de gras avec Salomon qui m'explique comment ça fonctionne, et après quelques tonnelets de connaissances, je ressortais des mines avec mon premier butin :

Fabriquée à partir de la structure html du theme base, aucun float n'a été utilisé dans cette quête, à part un, qui m'a volontairement suivi pour agencer mon lorem autour d'une image, et encore, en réfléchissant un peu on doit pouvoir s'en passer. mais bon il avait l'air sympa.

Je vous invite également à regarder le comportement de la page en dessous de 640px de large.

Il reste encore quelques width par ci par là, mais dans la version finale il n'y en aura plus besoin non plus, sauf, comme pour le float, pour des envies de design et non plus par obligation de nature structurelle.



Coté compatibilité, l'idéal actuel est d'utiliser chrome pour un rendu le plus juste, sachant que j'ai, autant que faire se peut, essayé d'éviter l'utilisation des balises encore en bug.

Côté partage ben comme d'hab hein c'est du gratuit donc viendez tous essayer la bète.

voir les sites en fin de message pour plus d'info



Au programme :

1 - ordre et direction des divs

2 - remplissage des vides

3 - flexibilités et définitions des largeurs sans px/em/%, meme si ça reste utilisable pour affinage de design

4 - et j'ai pas encore tout lu



exemple:



Code CSS :
div.contenu {
display:flex;
flex-direction:row;
}
 
nav{
order:1;
flex:1;
}
 
.content {
order:2;
flex:3;
}
 
aside {
order:3;
flex:1
}


Code HTML :
 
<div class="contenu">
<nav>menu</nav>
<aside>lorem ipsum</aside>
<div class="content">lorem ipsum</div>
</div>




dans ce script, on ne voit ni float ni width, chaque élément devrait donc s'empiler verticalement dans cet ordre nav > aside > content, chacun remplissant son espace en largeur, en fonction de son contenu.

mais avec le display:flex et ses amis, j'en décide autrement.



le flex-direction:row indique que ses enfants seront alignés horizontalement et au passage auront la même hauteur, celle du contenu maximum. Pour les empiler verticalement, j'aurai renseigné flex-direction:column, ce que je peux faire pour le viewport mobile ;)



les flex:1, flex:3, indiquent l'espace qui est alloué à l'élément par rapport à l'espace disponible dans son parent qui lui, prendra toute la largeur de la fenetre du navigateur (dans ce cas), ici le content sera 3 fois plus grand que nav ou aside.



les order:1 , 2 et 3, j'explique ce que vous pensez déjà de ce à quoi ça va servir ou je vous laisse continuer tout seul, tellement c'est simplement magique et magiquement simple? par là .. ou par ici... voire, sur cette page...



donc bon, on aura du boulot pour la 4.1, c'est sur, et pour l'instant c'est un module en "candidate recommendation" (tu peux utiliser, ça marche pas trop mal, mais il se peut que la syntaxe soit modifiée dans les prochaines versions), mais vivement, la 4.2 ... et firefox 28 :D



joyeux noel à tous :drool Edité par babsolune Le 22/12/2013 à 18h27


Site web    
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie