Accueil
Dernières images
Rechercher
S'enregistrer
Connexion
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forumAtelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction]
Page 1 sur 4 • 1, 2, 3, 4 
Vieille branche
Puf/Surnom : Kayl 
Messages : 1784Kayl
Mar 2 Juil 2019 - 20:03
Le p'tit atelier de Sun & Kayl
Ce que nous faisons
< >
Codage
Sun & Kayl. • Au niveau codage, nous pouvons réaliser toutes sortes de fiches (rp, liens, répertoire, présentation, évolution, pub, …) et de signatures codées, ainsi que différents templates de forum (tous je crois, d’ailleurs xD).
• Pour la petite histoire, Kayl a plus de 7 ans d’expérience, et code aujourd’hui également en milieu professionnel. Sun a environ 3 ans et demi d’expérience, et même si elle n’est pas aussi douée, elle se dépatouille plutôt bien. Nous avons déjà codé plusieurs designs complets de forum, et avons fait partie du Staff code d’Épicode.
• Nous comptons réaliser les commandes par inspiration, et donc vous ne saurez pas à l’avance qui prendra en charge votre commande. En réalité, il est très probable que nous réalisions la plupart des commandes ensemble, soit carrément à deux sur le code, soit via un processus de maquette par Kayl puis de code par Sun.
Quoi qu’il en soit, vous ne pouvez pas choisir votre codeur ici. (Si vous avez de la chance, c’est notre chat qui réalisera la commande en plus).
• Kayl aime beaucoup les muffins, alors même si on fait ça bénévolement, elle est pas contre un petit pourboire muffin (ou cookie) de temps à autre.
< >
Maquettes
Kayl. • Vous voulez coder vous-mêmes une petite fiche (grâce à mes tutos, évidemment) et vous ne savez pas trop quoi faire ? Je propose de faire des maquettes en tout genre, que vous ayez ou non une idée de base. Fiche Rp, de liens ou template, je devrais pouvoir faire des maquettes relativement correctes et précises pour qu’un codeur puisse le faire derrière.
• Je joins à la maquette les tailles, couleurs précises et polices utilisées (sur Google Fonts).
• N’hésitez pas à me dire s’il faut changer quelque chose, en général pour une maquette, je supprime le .psd lorsqu’elle est acceptée parce que mon ordi est blindé de merdes (enfin, c’est pas systématique, mais ça pourrait arriver).
< >
Dessin
Kayl. • Je dessine pour le loisir depuis euh un moment, mais ça fait assez peu de temps que j’ai eu envie de m’améliorer vraiment et de faire des trucs un peu plus évolués donc, pour toute commande de dessin, j’accepte de réaliser 1 personnage, a priori sans fond. Pour quelque chose de plus complexe, merci de me demander en PV avant si c’est possible ; un dessinateur fait payer 400 € pour un seul dessin, je le fais bénévolement et c’est du loisir, je n’y consacrerai pas des heures entières de ma vie.
• Pour le sujet du dessin (le personnage), je veux une description parfaite : couleurs précises (juste “yeux bleus” ne m’aide pas vraiment, il y a des millions de bleus), pelage (emplacement exact des taches/etc., couleurs précises également), couleur de la truffe, oreilles, moustaches, position du chat, absolument TOUT.
• Niveau règles, comme partout ailleurs, pas de plagiat, un petit bonjour, tout ça.
« ... »
Noms & Citations
Sun. • Si vous êtes ici depuis un petit temps, vous avez déjà dû remarquer que j’aime bien chercher des noms pour des personnages LGDC, et c’est pourquoi je me propose de chercher quelques idées de noms pour vos persos si vous n’avez aucune idée. Au niveau des citations (je pense citations surtout pour les signas), c’est un peu le même principe.
• Étant donné que j’aime beaucoup rédiger et que je suis à l’aise avec les mots, vous pouvez également commander des “rédactions” pour un contexte de forum, une annexe, des explications, … Des petites choses comme ça, quoi x)
Quelques règles
• Politesse exigée, bonjour, merci, s'il te plait, à ce que je sache, ça a jamais tué personne. Et pis ça fait plaisir, de ne pas arriver en mode gros sauvage "je veux ci, je veux ça". Bon voilà, du savoir-vivre, quoi, je pense que tout le monde est capable du minimum. Merci également de ne pas nous harceler de “vous en êtes où ?” si votre commande prend un peu plus de temps que prévu. Ça peut arriver, on a une vie et des imprévus comme tout le monde.
• Bien sûr et cela va de soi, pas de plagiat (fait de s’approprier tout ou partie de la création). Pas touche à notre copyright.
• Tout commande faisant mention d’une image implique de nous transmettre cette image. La chercher nous-mêmes prend énormément de temps (surtout quand il s’agit d’une commande graphique), avec, en prime, le risque qu’elle ne corresponde pas parfaitement à vos attentes.
• Au niveau des commandes de codage, pour les polices (typo, écriture…) merci d’utiliser le site de Google Fonts (clique ici) uniquement. Sinon, il nous est impossible de l’intégrer dans un code, ce qui serait dommage (pour vous hein)
Les formulaires
< >
Fiches et signatures
- Code:
<link href="https://www.aht.li/3390959/atelierdenous.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Oswald|Roboto&display=swap" rel="stylesheet"><div class="sunatelier_commande"><h2>Commande de codage</h2><div class="sunatelier_commande_descri formu"><span>< ></span><h3>Fiche</h3><p><strong>• Objet de la commande : </strong>Ici. Voulez-vous une fiche de rp, une fiche de liens, une signa, … ?
<strong>• Schéma ou maquette (facultatif) : </strong>Ici.
<strong>• Image(s), si vous en désirez : </strong>Ici.
<strong>• Couleurs, tons : </strong>Ici.
<strong>• Éléments à insérer : </strong>Ici. Pour une fiche rp, est-ce que vous voulez la place pour un feat ; pour une fiche de liens, les différentes sections que vous voulez y retrouver, etc.
<strong>• Effets : </strong>Ici. Toutes les petites fioritures que vous aimeriez y voir (ombres, arrondis, bordure spéciale, mais aussi slide, hover, etc.)
<strong>• Autre chose ? </strong>Ici.</p></div></div>
< >
Templates
- Code:
<link href="https://www.aht.li/3390959/atelierdenous.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Oswald|Roboto&display=swap" rel="stylesheet"><div class="sunatelier_commande"><h2>Commande de codage</h2><div class="sunatelier_commande_descri formu"><span>< ></span><h3>Template</h3><p><strong>• Objet de la commande : </strong>Ici. Quel template doit-on coder ?
<strong>• Maquette (obligatoire) : </strong>Ici. Si vous n’en avez pas, Kayl peut la réaliser, merci alors de faire une demande en commande graphique.
<strong>• Image(s), si vous en désirez : </strong>Ici.
<strong>• Couleurs, tons : </strong>Ici.
<strong>• Polices des textes : </strong>Ici.
<strong>• Éléments à insérer : </strong>Ici.
<strong>• Effets : </strong>Ici. Toutes les petites fioritures que vous aimeriez y voir (ombres, arrondis, bordure spéciale, mais aussi slide, hover, etc.)
<strong>• Version du forum et lien dudit forum : </strong>Ici.
<strong>• Autre chose ? </strong>Ici.</p></div></div>
« ... »
Maquette & Dessin
- Code:
<link href="https://www.aht.li/3390959/atelierdenous.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Oswald|Roboto&display=swap" rel="stylesheet"><div class="sunatelier_commande"><h2>Commande graphique</h2><div class="sunatelier_commande_descri formu"><span>< ></span><h3>Maquette ou Dessin</h3><p><strong>• Objet de la commande : </strong>Ici. Dessin, maquette de quoi exactement ?
<strong>• Description(s) précises : </strong>Ici.
<strong>• Image(s), si vous en désirez : </strong>Ici.
<strong>• Couleurs, tons : </strong>Ici.
<strong>• Éléments à insérer : </strong>Ici. Pour le dessin, si j’ajoute une hirondelle qui vole.
<strong>• Effets : </strong>Ici. Pour les maquettes, toutes les petites fioritures que vous aimeriez y voir (ombres, arrondis, mais aussi slide, hover, etc.)
<strong>• Autre chose ? </strong>Ici.</p></div></div>
« ... »
Noms & Citations
- Code:
<link href="https://www.aht.li/3390959/atelierdenous.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Oswald|Roboto&display=swap" rel="stylesheet"><div class="sunatelier_commande"><h2>Commande rédactionnelle</h2><div class="sunatelier_commande_descri formu"><span>« … »</span><h3>Nom / Citation / Rédaction</h3><p><strong>• Type de commande : </strong>Ici. Propositions de nom, citation, autre ?
<strong>• Sujet : </strong>Ici. Pour un nom ou une citation, description psychologique (& éventuellement physique) du personnage ; pour une rédaction, ce que je dois rédiger.
<strong>• Ce qui doit absolument s’y retrouver : </strong>Ici. Une partie du nom, une ambiance/un mot pour une citation, …
<strong>• Autre chose ? </strong>Ici. Si vous avez d’autres impératifs, ou des trucs à rajouter.</p></div></div>
Quelques exemples
Fiches récentes de Sun :
https://codepen.io/lenakin-sunny/full/vwPzgG
https://codepen.io/lenakin-sunny/full/YbgJbO
https://codepen.io/lenakin-sunny/full/QRoYxe
https://codepen.io/lenakin-sunny/full/NZrKBL
https://codepen.io/lenakin-sunny/full/MMmmeK
https://codepen.io/lenakin-sunny/full/zVEYyR
https://laguerredesclans-rpg.forumsactifs.com/t10621-venez-chercher-votre-recompense-bande-de-folles-aux-rp-s-e-e (déjà plus vieux)
Fiche/autres de Sun sur base de maquette by Kayl :
La fiche d’atelier que vous êtes en train de visiter
https://codepen.io/lenakin-sunny/full/mvEEyJ
https://codepen.io/lenakin-sunny/full/pXWxXM
https://codepen.io/lenakin-sunny/full/jjzwEZ
https://codepen.io/lenakin-sunny/full/NZyjLa
L’index du futur design d’automne de LGDC-RPG *meurt*
Fiches/autres de Sun sur base d’une maquette de quelqu’un d’autre :
https://codepen.io/lenakin-sunny/pen/PdbMmV
http://www.epicode-entraide.com/t14255-fiche-rp-258-sun
La PA là > http://eileanacheo.forumactif.com/
Les catés ici > http://sun-forum-test.forumactif.com/
Cette liste des membres http://sun-forum-test.forumactif.com/memberlist
La PA et le profil & message ici > http://half-god-rpg.forums-actifs.net/ (sachant que le reste est codé par Kayl)
Le Codepen de Kayl :
https://codepen.io/Kayl_dAmbrosio/
Son ancien atelier :
https://laguerredesclans-rpg.forumsactifs.com/t9701-kayl-atelier-codages-graphs-dessins-transpas
Sa galerie :
https://kaylgallery.tumblr.com/
Jeune aventurier
Puf/Surnom : Droon/ Lion Messages : 85Nuage de Fougère
Mer 3 Juil 2019 - 18:48
Salutations!
J'aimerais pouvoir faire une fiche pour Pavot Noir ^^
J'aimerais pouvoir faire une fiche pour Pavot Noir ^^
Commande de codage
< >
Fiche
• Objet de la commande : Fiche de RP
• Schéma ou maquette (facultatif) :
• Image(s), si vous en désirez : Alors, j'ai trouvé celles-ci:
http://3.bp.blogspot.com/-F-cD6mFCwhE/Un5HWVpgbkI/AAAAAAAAAGg/WIggA-v-JGY/w1200-h630-p-k-no-nu/black+poppy+2.jpg
https://cdn.gardenista.com/wp-content/uploads/2018/06/opium-poppy-oxford-9.jpg
Et si elles ne passent pas, juste des pousses de pavot ça ira x) :
https://www.ducros.fr/le-secret-des-epices/~/media/3c008f7c260941ef976f9aabb9e33118.ashx?h=309&w=549
https://i.servimg.com/u/f98/19/98/49/49/adormi10.jpg
• Couleurs, tons : Vert, dans des tons sombres.
• Éléments à insérer : Juste la place pour le titre
• Effets : Si l'effet ombre colle avec l'ensemble, pourquoi pas. Sinon non x) Ma police d'écriture est le Georgia.
• Autre chose ? Merci d'avance! :) N'hésitez pas à prendre votre temps ^^
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Jeu 4 Juil 2019 - 15:03
@Nuage de Fougère Voilà ta fiche !
Code :
Un titre, ici, sur deux lignes hein, attends je teste
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sit amet sem in odio dignissim elementum eget vitae dolor. Sed sed ante bibendum, pulvinar mi a, iaculis lacus. Suspendisse semper, mauris non bibendum eleifend, ligula mauris facilisis massa, sit amet tristique est nunc in nisl. Sed mauris sem, rhoncus in diam id, cursus laoreet ligula. Sed vehicula justo sit amet malesuada maximus. Sed sit amet velit sem. Curabitur a dictum magna.
Mauris euismod lorem quam, at posuere dui euismod in. Vivamus ut facilisis felis, sed blandit lectus. Vestibulum commodo in leo non imperdiet. Nam eu lacus nec dui tincidunt ultricies. In et mattis nisi. Ut et pulvinar purus. Sed porta blandit massa ut elementum. Morbi tempor mi eu tempor eleifend. Aliquam dictum lorem sed dolor varius pretium. Mauris laoreet sapien quis justo dapibus, id egestas velit venenatis.
Praesent aliquam ut nisl faucibus fringilla. Nunc quis porttitor mauris. Vestibulum sed posuere turpis. Phasellus auctor egestas ante eu rutrum. Quisque sollicitudin pharetra magna vitae laoreet. Ut ut est eu est imperdiet tempor sit amet sed enim. Nam tempor in erat eget pellentesque. Etiam nibh dui, pellentesque sit amet elit et, auctor efficitur enim. Fusce purus libero, maximus in pulvinar eu, consectetur at ipsum.
Vivamus augue sem, vulputate sit amet pulvinar vitae, congue quis nunc. Quisque molestie dignissim mattis. Duis auctor risus et laoreet facilisis. Integer tincidunt auctor mauris, et dignissim erat. Mauris vel urna faucibus, tristique felis a, ultricies est. Mauris hendrerit venenatis risus ut dictum. Maecenas nulla mi, dapibus vel risus ut, tincidunt pretium turpis. Vivamus venenatis iaculis sollicitudin. Integer rhoncus justo ut eros efficitur, in posuere odio imperdiet. Integer efficitur vulputate posuere. Nunc eu nibh non quam sagittis accumsan. Suspendisse sed augue nec lorem elementum interdum venenatis eget arcu.
Nulla venenatis, mauris ut efficitur imperdiet, lacus libero aliquam lacus, sed scelerisque velit mi non magna. Sed purus ligula, consequat id imperdiet sit amet, viverra non nunc. Cras elementum libero in dignissim tempor. Donec scelerisque bibendum justo quis finibus. Ut ultricies nulla ante, eget bibendum est efficitur eu. Vivamus sit amet enim nibh. Suspendisse in ultrices orci. Ut quis lectus dui. Cras dapibus ex et dapibus bibendum. Ut volutpat lobortis justo quis faucibus. Proin elementum tincidunt arcu, et auctor tellus volutpat volutpat. Cras a tellus vel purus cursus tincidunt pellentesque quis leo. Fusce sagittis nibh euismod, elementum tortor varius, maximus dolor.
Code :
- Code:
<link href="https://www.aht.li/3391750/pavot.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Oswald&display=swap" rel="stylesheet"><div class="pavotfiche"><img src="https://zupimages.net/up/19/27/zy22.jpg"/><span class="copykaylsun"></span><h1>TITRE</h1><p>TEXTE</p></div>
Jeune aventurier
Puf/Surnom : Droon/ Lion Messages : 85Nuage de Fougère
Jeu 4 Juil 2019 - 16:10
Elle est magnifique! :o J'adore 
Merci beaucop
Merci beaucop Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Jeu 4 Juil 2019 - 19:48
On est contentes que ça te plaise x)
Aily prend son envol pour atteindre la première place !
Puf/Surnom : Aily Messages : 178Le personnage
Sexe du perso: Femelle
Âge du perso: 45 lunes
Mentor / apprenti : Nuage d'Espoir
Ascendance de l'Aube
Ven 5 Juil 2019 - 22:00
Coucou, je viens commander ^^
Commande graphique
< >
Maquette ou Dessin
• Objet de la commande : Maquette Index
• Description(s) précises : J'aimerais une maquette de l'index : Navigation, PA, catégories, QEEL, Footer
• Image(s), si vous en désirez : Ici.
• Couleurs, tons : comme vous voulez (j'ai pas encore la bannière définitive :/)
• Éléments à insérer : I
Navigation : les boutons habituels Acceuil, etc.. (si c'est possible de mettre également l'avatar du membre)
PA : staffien (2 ou 3), news, contexte, prédéfinis, event, liens de navigation (contexte, règlement, etc... environ 6), partenaires et 2 top site peut être si tu as de la place
Catégories : description, img no new etc, titre forum, titre caté, dernier message, sous forum (à toi de voir si tu rajoute un endroit pour l'avatar du membre ou non ^^ )
QEEL : membre co, dernier membre co 24h, bienvenue au dernier membre, les différents groupes avec description (ou non à toi de voir)
Footer: les partenaires (50*50)
• Effets :
Navigation : /
PA : peut être un hover laissant apparaître les info du staffien, à toi de voir et/ou les évents
+ hover pour les infos des prédéfs
Catégories : /
QEEL : à toi de voir si tu mets quelque chose au niveau des groupes
Footer : /
• Autre chose ? Merci à vous, vous êtes géniales ^^ Prenez votre temps c'est pas pressé ^^
J'aimerais un style assez moderne (comme Half god par exemple, leur ancien design ou leur nouveau)
Jeune aventurier
Puf/Surnom : Ocyy Messages : 107Artémis
Sam 6 Juil 2019 - 19:21
Bonjouur vous deux 
Commande de codage
< >
Fiche
• Objet de la commande : fiche de rp s'il vous plaît
• Schéma ou maquette (facultatif) : 
• Image(s), si vous en désirez : Aloors
J'ai cherché et j'en ai trouvé plein mais je vous donne mes préférées ![Atelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction] 264746](/users/3211/16/22/04/smiles/264746.gif)
(c'est pour Aube Silencieuse)
https://unsplash.com/photos/7oorxYTKMxQ
https://unsplash.com/photos/rfipIDrHGAc
• Couleurs, tons : Plutôt comme sur les photos, genre rose/violet/orange/jaune, les couleurs de l'aube
• Éléments à insérer : Euh le titre, le feat et le texte
• Effets : J'ai pas vraiment d'idées mais je vois bien un truc épuré dans trop d'éléments.
• Autre chose ? Merci beaucoup à vous ma commande est pas très précise et je m'en excuse, dites moi si vous voulez plus d'infos !
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Dim 7 Juil 2019 - 11:23
Bonjour vous deux ! On prend vos deux commandes x)
Aily, Kayl précise qu'elle ne compte pas refaire la maquette et les codes par la suite (ça prend la blinde de temps, je pense que t'en as conscience![Atelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction] 3193767302](/users/3211/16/22/04/smiles/3193767302.gif)
), donc une carte blanche totale reste à tes risques et périls. Et si tu as la bann à un moment donné, on veut bien la voir pour accorder.
On ferme l'atelier, à l'exception des commandes textuelles, pour le moment.
Aily, Kayl précise qu'elle ne compte pas refaire la maquette et les codes par la suite (ça prend la blinde de temps, je pense que t'en as conscience
), donc une carte blanche totale reste à tes risques et périls. Et si tu as la bann à un moment donné, on veut bien la voir pour accorder.On ferme l'atelier, à l'exception des commandes textuelles, pour le moment.
Aily prend son envol pour atteindre la première place !
Puf/Surnom : Aily Messages : 178Le personnage
Sexe du perso: Femelle
Âge du perso: 45 lunes
Mentor / apprenti : Nuage d'Espoir
Ascendance de l'Aube
Dim 7 Juil 2019 - 12:53
Y a pas de soucis jai entièrement confiance en vous je sais que de toute façon les résultats seront géniaux ^^
Et puis jai quand même laissé deux trois points sur ce qu'il doit y avoir et le thème dit "moderne" donc après peu importe ce que vous faite je suis sur que je vais plus qu apprécier ^^
Et puis jai quand même laissé deux trois points sur ce qu'il doit y avoir et le thème dit "moderne" donc après peu importe ce que vous faite je suis sur que je vais plus qu apprécier ^^
Guerrier expérimenté
Puf/Surnom : Kayl ~ Messages : 239Veuve Noire
Mar 16 Juil 2019 - 14:04
> Pour Aily : https://zupimages.net/up/19/29/ipaz.png
Comme t'as déjà validé, on va commencer à coder en ajoutant des touches de verdâtre cheloues ('fin le vert de la bann xD) et on reviendra te demander peu à peu si tout convient of course **
(sinon ça arrive, on a enfin fini le déménagement tout ça, on reprend du travail tranquillou ** )
Comme t'as déjà validé, on va commencer à coder en ajoutant des touches de verdâtre cheloues ('fin le vert de la bann xD) et on reviendra te demander peu à peu si tout convient of course **
(sinon ça arrive, on a enfin fini le déménagement tout ça, on reprend du travail tranquillou ** )
Jeune aventurier
Puf/Surnom : SNOWY Messages : 128Le personnage
Sexe du perso: Femelle
Âge du perso: 51
Mentor / apprenti : Nuage du Tilleul
Irréalité d'Eucalyptus
Mar 16 Juil 2019 - 22:47
Hey ! J'aurai besoin d'une fiche pour Mask si ça ne vous dérange pas
Commande de codage
< >
Fiche
• Objet de la commande : Une fiche de rp s'il vous plait
• Schéma ou maquette (facultatif) : Je laisse carte blanche là dessus, disons que je n'ai pas d'idée xD
• Image(s), si vous en désirez : Quelques idées, fin je ne sais pas laquelle :) Sinon les deux ?
https://meganvlt.com/wp-content/uploads/2018/12/fond-ecran-gratuit-telephone-meganvlt.jpg
http://images.frandroid.com/wp-content/uploads/2017/09/xiaomi_mi_mix_2_fond_ecran_2.jpg
• Couleurs, tons : Des tons qui contrastent avec l'image choisie. Soient des tons clairs ou des tons sombres en fonction des photos. Fin, le contraire de la photo en fait x)
• Éléments à insérer : Feat, titre et texte je pense x)
• Effets : Peux être un texte caché... Ouais, je pense que ça pourrai être sympa
• Autre chose ? Je vous n'aime.
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Mer 17 Juil 2019 - 12:47
Coucou Snowy ! L'atelier est censé être fermé, mais on a accepte quand même ta commande, parce qu'elle nous inspire et qu'au moins tu l'as demandé gentiment *meurt*
Du coup on prend mais on finira d'abord les autres
Aily, si jamais, on a fini la PA et la barre de nav', ça avance **
-- Atelier FERMÉ pour le moment --
Du coup on prend mais on finira d'abord les autres
Aily, si jamais, on a fini la PA et la barre de nav', ça avance **
-- Atelier FERMÉ pour le moment --
Jeune recrue
Puf/Surnom : Snowy Messages : 65Le personnage
Sexe du perso: Mâle
Âge du perso: 77 lunes
Mentor / apprenti :
Masque du Corbeau
Mer 17 Juil 2019 - 13:26
Oups excusez moi xDDD
J'avais pas vu, pourtant j'avais cherché /PAN/
L'attente ne me dérange pas, ça m'apprendra à ne pas bien regarder xDD
J'avais pas vu, pourtant j'avais cherché /PAN/
L'attente ne me dérange pas, ça m'apprendra à ne pas bien regarder xDD
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Mer 17 Juil 2019 - 14:44
@Artémis @Aube Silencieuse Voici ta commande ! On espère que ça te plaît, et tu nous dis, si jamais x)
-- L'atelier est toujours fermé, puisque nous avons accepté la commande de Snowy. --
Feat des gens ici
Un joli titre ici, qui peut facilement faire deux lignes etc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sit amet sem in odio dignissim elementum eget vitae dolor. Sed sed ante bibendum, pulvinar mi a, iaculis lacus. Suspendisse semper, mauris non bibendum eleifend, ligula mauris facilisis massa, sit amet tristique est nunc in nisl. Sed mauris sem, rhoncus in diam id, cursus laoreet ligula. Sed vehicula justo sit amet malesuada maximus. Sed sit amet velit sem. Curabitur a dictum magna.
Mauris euismod lorem quam, at posuere dui euismod in. Vivamus ut facilisis felis, sed blandit lectus. Vestibulum commodo in leo non imperdiet. Nam eu lacus nec dui tincidunt ultricies. In et mattis nisi. Ut et pulvinar purus. Sed porta blandit massa ut elementum. Morbi tempor mi eu tempor eleifend. Aliquam dictum lorem sed dolor varius pretium. Mauris laoreet sapien quis justo dapibus, id egestas velit venenatis.
Praesent aliquam ut nisl faucibus fringilla. Nunc quis porttitor mauris. Vestibulum sed posuere turpis. Phasellus auctor egestas ante eu rutrum. Quisque sollicitudin pharetra magna vitae laoreet. Ut ut est eu est imperdiet tempor sit amet sed enim. Nam tempor in erat eget pellentesque. Etiam nibh dui, pellentesque sit amet elit et, auctor efficitur enim. Fusce purus libero, maximus in pulvinar eu, consectetur at ipsum.
Vivamus augue sem, vulputate sit amet pulvinar vitae, congue quis nunc. Quisque molestie dignissim mattis. Duis auctor risus et laoreet facilisis. Integer tincidunt auctor mauris, et dignissim erat. Mauris vel urna faucibus, tristique felis a, ultricies est. Mauris hendrerit venenatis risus ut dictum. Maecenas nulla mi, dapibus vel risus ut, tincidunt pretium turpis. Vivamus venenatis iaculis sollicitudin. Integer rhoncus justo ut eros efficitur, in posuere odio imperdiet. Integer efficitur vulputate posuere. Nunc eu nibh non quam sagittis accumsan. Suspendisse sed augue nec lorem elementum interdum venenatis eget arcu.
Nulla venenatis, mauris ut efficitur imperdiet, lacus libero aliquam lacus, sed scelerisque velit mi non magna. Sed purus ligula, consequat id imperdiet sit amet, viverra non nunc. Cras elementum libero in dignissim tempor. Donec scelerisque bibendum justo quis finibus. Ut ultricies nulla ante, eget bibendum est efficitur eu. Vivamus sit amet enim nibh. Suspendisse in ultrices orci. Ut quis lectus dui. Cras dapibus ex et dapibus bibendum. Ut volutpat lobortis justo quis faucibus. Proin elementum tincidunt arcu, et auctor tellus volutpat volutpat. Cras a tellus vel purus cursus tincidunt pellentesque quis leo. Fusce sagittis nibh euismod, elementum tortor varius, maximus dolor.
- Code:
<link href="https://www.aht.li/3395499/aubefiche.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Oswald|Roboto&display=swap" rel="stylesheet"><div class="aubefiche"><img src="https://www.zupimages.net/up/19/29/0u5m.jpg"/><h3>FEAT</h3><h1>TITRE</h1><span class="copykaylsun"></span><p>TEXTE</p></div>
-- L'atelier est toujours fermé, puisque nous avons accepté la commande de Snowy. --
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Sam 20 Juil 2019 - 12:00
@Mask Et voilà la tienne !
On espère que ça te convient x)
@Ascendance de l'Aube > On a fini, Kayl préfère te donner les codes par mp donc ils vont arriver, mais du coup si tu veux commander tes fiches, vazy xD
-- ATELIER OUVEEEEEEERT --
Avec Quelqu'un
Titre ici, qui peut s'avérer long si t'en as envie
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sit amet sem in odio dignissim elementum eget vitae dolor. Sed sed ante bibendum, pulvinar mi a, iaculis lacus. Suspendisse semper, mauris non bibendum eleifend, ligula mauris facilisis massa, sit amet tristique est nunc in nisl. Sed mauris sem, rhoncus in diam id, cursus laoreet ligula. Sed vehicula justo sit amet malesuada maximus. Sed sit amet velit sem. Curabitur a dictum magna.
Mauris euismod lorem quam, at posuere dui euismod in. Vivamus ut facilisis felis, sed blandit lectus. Vestibulum commodo in leo non imperdiet. Nam eu lacus nec dui tincidunt ultricies. In et mattis nisi. Ut et pulvinar purus. Sed porta blandit massa ut elementum. Morbi tempor mi eu tempor eleifend. Aliquam dictum lorem sed dolor varius pretium. Mauris laoreet sapien quis justo dapibus, id egestas velit venenatis.
Praesent aliquam ut nisl faucibus fringilla. Nunc quis porttitor mauris. Vestibulum sed posuere turpis. Phasellus auctor egestas ante eu rutrum. Quisque sollicitudin pharetra magna vitae laoreet. Ut ut est eu est imperdiet tempor sit amet sed enim. Nam tempor in erat eget pellentesque. Etiam nibh dui, pellentesque sit amet elit et, auctor efficitur enim. Fusce purus libero, maximus in pulvinar eu, consectetur at ipsum.
Vivamus augue sem, vulputate sit amet pulvinar vitae, congue quis nunc. Quisque molestie dignissim mattis. Duis auctor risus et laoreet facilisis. Integer tincidunt auctor mauris, et dignissim erat. Mauris vel urna faucibus, tristique felis a, ultricies est. Mauris hendrerit venenatis risus ut dictum. Maecenas nulla mi, dapibus vel risus ut, tincidunt pretium turpis. Vivamus venenatis iaculis sollicitudin. Integer rhoncus justo ut eros efficitur, in posuere odio imperdiet. Integer efficitur vulputate posuere. Nunc eu nibh non quam sagittis accumsan. Suspendisse sed augue nec lorem elementum interdum venenatis eget arcu.
- Code:
<link href="https://www.aht.li/3396758/MontSnowy.css" rel="stylesheet" type="text/css"><link href="https://fonts.googleapis.com/css?family=Allerta+Stencil|Roboto+Condensed&display=swap" rel="stylesheet"><div class="montsnowy"><div class="montsnowy_entete"><h3>FEAT ICI</h3><h1>TITRE ICI</h1></div><div class="montsnowy_img"><img src="https://images.frandroid.com/wp-content/uploads/2017/09/xiaomi_mi_mix_2_fond_ecran_2.jpg"/></div><span class="copykaylsun_montsnowy"></span><p>TEXTE ICI</p></div>
On espère que ça te convient x)
@Ascendance de l'Aube > On a fini, Kayl préfère te donner les codes par mp donc ils vont arriver, mais du coup si tu veux commander tes fiches, vazy xD
-- ATELIER OUVEEEEEEERT --
Jeune aventurier
Puf/Surnom : Ocy Messages : 100Ciel Déchiré
Sam 20 Juil 2019 - 14:43
J'adoooore merci ! C'est hyper épuré et beaucoup trop beau ![Atelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction] 1408736261](/users/3211/16/22/04/smiles/1408736261.gif)
merciiiiii
merciiiiii Jeune aventurier
Puf/Surnom : Kayl Messages : 107Ouragan Dévastateur
Dim 21 Juil 2019 - 12:35
DONC, la PA (Affichage > Généralités)
Ensuite omg trop de templates °°
> Index_body (Page d'Accueil)
> index_box (affichage des catés)
> overall_header (Haut de page)
> CSS
ET ENFIN
> Modules > Javascript, à cocher sur toutes les pages :
- Code:
<div class="paaurora">
<h1>
Bienvenue sur Nom du Forum !
</h1>
<div class="paaurora_bloctexte paaurora_contexte">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate nisi sit amet mauris lobortis, nec dignissim magna varius. Ut imperdiet ex a vestibulum vulputate. Integer rhoncus accumsan cursus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Morbi a dolor vitae sapien fringilla placerat. Etiam ultricies urna diam, non mattis lectus fringilla id. Pellentesque tincidunt augue vel elit porttitor, eu laoreet enim fermentum. Nulla imperdiet nulla velit, eu egestas erat finibus sed... <a href="#">Suite ?</a>
</p>
</div>
<div class="paaurora_contourstaff">
<div class="paaurora_casehover">
<div style="background-image: url(https://www.zupimages.net/up/17/11/tqtk.gif);">
<div>
Rang<br />Présence<br /><a href="#"><img src="https://www.zupimages.net/up/15/21/bbah.png" /></a> <a href="#"><img src="https://www.zupimages.net/up/15/21/vj3m.png" /></a>
</div>
</div><span>Nom</span>
</div>
<div class="paaurora_casehover">
<div style="background-image: url(https://www.zupimages.net/up/17/11/tqtk.gif);">
<div>
Rang<br />Présence<br /><a href="#"><img src="https://www.zupimages.net/up/15/21/bbah.png" /></a> <a href="#"><img src="https://www.zupimages.net/up/15/21/vj3m.png" /></a>
</div>
</div><span>Nom</span>
</div>
<div class="paaurora_casehover">
<div style="background-image: url(https://www.zupimages.net/up/17/11/tqtk.gif);">
<div>
Rang<br />Présence<br /><a href="#"><img src="https://www.zupimages.net/up/15/21/bbah.png" /></a> <a href="#"><img src="https://www.zupimages.net/up/15/21/vj3m.png" /></a>
</div>
</div><span>Nom</span>
</div>
</div>
<h2>
<a href="#">Besoin d'un Staffien ?</a>
</h2>
<div class="paaurora_contourliens">
<a href="#">Lien 1</a><a href="#">Lien 2</a><a href="#">Lien 3</a><a href="#">Lien 4</a><a href="#">Lien 5</a><a href="#">Lien 6</a><a href="#">Lien 7</a>
</div>
<div class="paaurora_contourpredef">
<div class="paaurora_casehover paaurora_predef">
<div style="background-image: url(https://zupimages.net/up/19/08/ktwe.png);">
<div>
Groupe<br />Âge<br />Info<br /><a href="#">Voir (clik !)</a>
</div>
</div><span>Nom du prédef</span>
</div>
<div class="paaurora_casehover paaurora_predef">
<div style="background-image: url(https://zupimages.net/up/19/08/ktwe.png);">
<div>
Groupe<br />Âge<br />Info<br /><a href="#">Voir (clik !)</a>
</div>
</div><span>Nom du prédef</span>
</div>
<div class="paaurora_casehover paaurora_predef">
<div style="background-image: url(https://zupimages.net/up/19/08/ktwe.png);">
<div>
Groupe<br />Âge<br />Info<br /><a href="#">Voir (clik !)</a>
</div>
</div><span>Nom du prédef</span>
</div>
</div>
<div class="paaurora_bloctexte paaurora_news">
<h3>
News
</h3>
<ul>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
<li>
New truc le xx/xx/xx
</li>
</ul>
</div>
<div class="paaurora_bloctexte paaurora_topsites">
<a href="#"><img src="https://www.pokepedia.fr/images/2/23/Miniature_001_XY.png" /></a><a href="#"><img src="https://www.zupimages.net/up/19/28/mvee.png" /></a><a href="#"><img src="https://www.pokepedia.fr/images/2/23/Miniature_001_XY.png" /></a><a href="#"><img src="https://www.zupimages.net/up/19/28/mvee.png" /></a>
<h3>
Vote !
</h3>
</div>
<div class="paaurora_bloctexte paaurora_event">
<h3>
Event en cours !
</h3>
<p>
Etiam ultricies urna diam, non mattis lectus fringilla id. Pellentesque tincidunt augue vel elit porttitor, eu laoreet enim fermentum. Nulla imperdiet nulla velit, eu egestas erat finibus sed... <a href="#">En savoir plus.</a>
</p>
</div>
<h2>
Nos amis
</h2>
<div class="paaurora_contourpartos">
<a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png" /></a>
</div>
</div>
Ensuite omg trop de templates °°
> Index_body (Page d'Accueil)
- Code:
{JAVASCRIPT}
<!-- BEGIN switch_user_login_form_header -->
<div class="panel">
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<input placeholder="{L_USERNAME}" class="inputbox fl_username" type="text" size="10" name="username" />
<input placeholder="{L_PASSWORD}" class="inputbox fl_password" type="password" size="10" name="password" />
<br />
<label>{L_AUTO_LOGIN}: <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_social_login -->
<div class="social_btn">
<!-- BEGIN fb_connect -->
<div class="fb-login-button"></div>
<!-- END fb_connect -->
<!-- BEGIN topicit_connect -->
<div class="ti-connect"></div>
<!-- END topicit_connect -->
</div>
<!-- END switch_social_login -->
</div>
</form>
</div>
<!-- END switch_user_login_form_header -->
<!-- BEGIN message_admin_index -->
<div class="panel introduction">
<!-- BEGIN message_admin_titre -->
<div class="h3">{message_admin_index.message_admin_titre.MES_TITRE}</div>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<div class="mes-txt">{message_admin_index.message_admin_txt.MES_TXT}</div>
<!-- END message_admin_txt -->
</div>
<!-- END message_admin_index -->
{CHATBOX_TOP}
{BOARD_INDEX}
<!-- BEGIN disable_viewonline -->
<!-- BEGIN switch_viewonline_link -->
<!-- END switch_viewonline_link -->
<div class="qeelaurora">
<h1>En ligne actuellement</h1>
<div class="qeelaurora_entete"><h2>Bienvenue, <span id="newuser">{NEWEST_USER}</span></h2></div>
<div class="qeelaurora_entete"><h2><span id="anniv">{L_WHOSBIRTHDAY_TODAY}</span></h2></div>
<div class="qeelaurora_bloctexte"><p id="loggedin">{LOGGED_IN_USER_LIST}</p></div>
<div class="qeelaurora_statscontainer"> <div class="qeelaurora_stats"><span>Membres en ligne</span><em id="online">{TOTAL_USERS_ONLINE}</em></div>
<div class="qeelaurora_stats"><span>Record Membres</span><em id="recorduser">{RECORD_USERS}</em></div>
<div class="qeelaurora_stats"><span>Total Membres</span><em id="totaluser">{TOTAL_USERS}</em></div>
<div class="qeelaurora_stats"><span>Total Messages</span><em id="totalpost">{TOTAL_POSTS}</em></div></div>
<div class="qeelaurora_bloctexte"><p>{L_CONNECTED_MEMBERS}</p></div>
<div class="qeelaurora_group"><div class="infogroup1"><a href="#">Physique</a><div><p><span style="color: #123456">Groupe Physique</span> : Ici la description du groupe en question.</p></div></div>
<div class="infogroup2"><a href="#">Psychique</a><div><p><span style="color: red">Groupe Psychique</span> : Ici la description du groupe en question.</p></div></div>
<div class="infogroup3"><a href="#">Technologique</a><div><p><span style="color: pink">Groupe Technologique</span> : Ici la description du groupe en question.</p></div></div>
<div class="infogroup4"><a href="#">Spéciaux</a><div><p><span style="color: green">Groupe des Spéciaux</span> : Ici la description du groupe en question.</p></div></div>
<div class="infogroup5"><a href="#">Dangereux</a><div><p><span style="color: brown">Groupe Dangereux</span> : Ici la description du groupe en question.</p></div></div>
<div class="infogroup6"><a href="#">Enseignants</a><div><p><span style="color: orange">Groupe des Enseignants</span> : Ici la description du groupe en question.</p></div></div>
</div>
</div>
<script type="text/javascript">
document.getElementById('newuser').innerHTML=document.getElementById('newuser').innerHTML.replace(/L'utilisateur enregistré le plus récent est/,"");
document.getElementById('anniv').innerHTML=document.getElementById('anniv').innerHTML.replace(/<br style="line-height:5px;">Aucun membre ne fête son anniversaire aujourd'hui/,"Aucun anniversaire aujourd'hui");
document.getElementById('anniv').innerHTML=document.getElementById('anniv').innerHTML.replace(/<br style="line-height:5px;">Membres fêtant leur anniversaire aujourd'hui : /,"Anniversaire de ");
document.getElementById('anniv').innerHTML=document.getElementById('anniv').innerHTML.replace(/<br>/," !");
document.getElementById('loggedin').innerHTML=document.getElementById('loggedin').innerHTML.replace(/<br>/,"");
document.getElementById('online').innerHTML=document.getElementById('online').innerHTML.replace(/Il y a en tout /,"");
document.getElementById('recorduser').innerHTML=document.getElementById('recorduser').innerHTML.replace(/Le record du nombre d'utilisateurs en ligne est de /,"");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/Nous avons /,"");
document.getElementById('totaluser').innerHTML=document.getElementById('totaluser').innerHTML.replace(/ membres enregistrés/,"");
document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/Nos membres ont posté un total de /,"");
document.getElementById('totalpost').innerHTML=document.getElementById('totalpost').innerHTML.replace(/ messages/,"");
</script>
<div class="qeelaurora">
<h1>Nos partenaires</h1>
<div class="qeelaurora_bloctexte qeelaurora_footer"><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a><a href="#"><img src="https://zupimages.net/up/19/29/0z0z.png"/></a></div>
</div>
<!-- BEGIN switch_viewonline_nolink -->
<!-- END switch_viewonline_nolink -->
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<!-- BEGIN switch_user_login_form_footer -->
<div class="panel">
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<div class="user_login_form center">
<input placeholder="{L_USERNAME}" class="inputbox fl_username" type="text" size="10" name="username" />
<input placeholder="{L_PASSWORD}" class="inputbox fl_password" type="password" size="10" name="password" />
<br />
<label>{L_AUTO_LOGIN}: <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label>
{S_HIDDEN_FIELDS}<input class="mainoption button1" type="submit" name="login" value="{L_LOGIN}" />
<!-- BEGIN switch_social_login -->
<div class="social_btn">
<!-- BEGIN fb_connect -->
<div class="fb-login-button"></div>
<!-- END fb_connect -->
<!-- BEGIN topicit_connect -->
<div class="ti-connect"></div>
<!-- END topicit_connect -->
</div>
<!-- END switch_social_login -->
</div>
</form>
</div>
<!-- END switch_user_login_form_footer -->
<!-- BEGIN switch_legend -->
<!-- END switch_legend -->
{AUTO_DST}
> index_box (affichage des catés)
- Code:
<ul class="linklist top">
<!-- BEGIN switch_user_logged_in -->
<li>
<a href="{U_SEARCH_NEW}"><i class="ion-ios-flame"></i>{L_SEARCH_NEW}</a>
</li>
<li>
<a href="{U_SEARCH_SELF}"><i class="ion-ios-box-outline"></i>{L_SEARCH_SELF}</a>
</li>
<!-- END switch_user_logged_in -->
<li>
<a href="{U_SEARCH_UNANSWERED}"><i class="ion-ios-chatbubble-outline"></i>{L_SEARCH_UNANSWERED}</a>
</li>
<!-- BEGIN switch_user_logged_in -->
<li class="rightside">
<a href="{U_MARK_READ}" accesskey="m"><i class="ion-android-checkmark-circle"></i>{L_MARK_FORUMS_READ}</a>
</li>
<!-- END switch_user_logged_in -->
</ul>
<!-- BEGIN catrow -->
<!-- BEGIN tablehead -->
<div class="cataurora_title">{catrow.tablehead.L_FORUM}</div>
<!-- END tablehead -->
<!-- BEGIN forumrow --><div class="cataurora">
<img src="{catrow.forumrow.FORUM_FOLDER_IMG}" class="cataurora_oldnewtruc"/>
<div class="cataurora_entete"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a>
<span id="lastposter"><!-- BEGIN switch_topic_title --><a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><!-- END switch_topic_title --> le {catrow.forumrow.USER_LAST_POST}</span></div>
<div class="cataurora_ava"><!-- BEGIN avatar -->{catrow.forumrow.avatar.LAST_POST_AVATAR}<!-- END avatar --></div>
<div class="cataurora_bloctexte"><p>{catrow.forumrow.FORUM_DESC}</p></div>
<div class="cataurora_stats"><span>Total Sujets</span><em>{catrow.forumrow.TOPICS}</em></div>
<div class="cataurora_stats"><span>Total Messages</span><em>{catrow.forumrow.POSTS}</em></div>
<div class="cataurora_ssfow" id="subforums">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div>
<script type="text/javascript">
jQuery('#subforums').html(jQuery('#subforums').html().replace(/, /g,' ')).removeAttr('id');
jQuery('#lastposter').html(jQuery('#lastposter').html().replace(/<br>/g,' ')).removeAttr('id');
</script>
<!-- END forumrow -->
<!-- BEGIN tablefoot -->
</div>
<!-- END tablefoot -->
<!-- END catrow -->
<!-- BEGIN switch_on_index -->
<!-- BEGIN switch_delete_cookies -->
<!-- END switch_delete_cookies -->
<!-- END switch_on_index -->
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
var btn_collapse = $('<div></div>', {
class: 'btn-collapse'
});
var btn_collapse_show = $('<i></i>', {
class: 'ion-android-add-circle hidden',
'data-tooltip': '{L_EXPEND_CAT}'
}).appendTo(btn_collapse);
var btn_collapse_hide = $('<i></i>', {
class: 'ion-android-remove-circle',
'data-tooltip': '{L_HIDE_CAT}'
}).appendTo(btn_collapse);
var collapsed = [];
if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
collapsed = readCookie('collapsed').split(',');
}
$(document).on('click', '.btn-collapse', function() {
$(this).children('.ion-android-add-circle').toggleClass('hidden');
$(this).children('.ion-android-remove-circle').toggleClass('hidden');
$(this).parents('.forabg').toggleClass('hidden');
if (readCookie('collapsed') != null && readCookie('collapsed') != '') {
collapsed = readCookie('collapsed').split(',');
}
if (!$(this).parents('.forabg').hasClass('hidden')) {
removeFromArray('' + $(this).parents('.forabg').data('cindex'), collapsed);
createCookie('collapsed', collapsed);
} else {
collapsed.push('' + $(this).parents('.forabg').data('cindex'));
createCookie('collapsed', collapsed);
}
});
$('.forabg').each(function(i) {
$(this).data('cindex', '' + i);
$(btn_collapse)
.clone()
.attr('id', 'forabg' + i)
.appendTo($(this).find('.header'));
if ($.inArray('' + i, collapsed) > -1) {
$(this).toggleClass('hidden');
$('#forabg' + i).children('.ion-android-add-circle').toggleClass('hidden');
$('#forabg' + i).children('.ion-android-remove-circle').toggleClass('hidden');
}
});
});
function removeFromArray(item, array) {
var i = array.indexOf(item);
if (i > -1) {
array = array.splice(i, 1);
}
}
function createCookie(name, value, days) {
var expires;
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
} else {
expires = "";
}
document.cookie = encodeURIComponent(name) + "=" + encodeURIComponent(value) + expires + "; path=/";
}
function readCookie(name) {
var nameEQ = encodeURIComponent(name) + "=";
var ca = document.cookie.split(';');
for (var i = 0; i < ca.length; i++) {
var c = ca[i];
while (c.charAt(0) === ' ') c = c.substring(1, c.length);
if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length, c.length));
}
return null;
}
//]]>
</script>
> overall_header (Haut de page)
- Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
<head>
<link href="https://fonts.googleapis.com/css?family=Oswald|Roboto&display=swap" rel="stylesheet">
<title>{SITENAME_TITLE}{PAGE_TITLE}</title>
<meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<!-- BEGIN switch_compat_meta -->
<meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />
<!-- END switch_compat_meta -->
<!-- BEGIN switch_canonical_url -->
<link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />
<!-- END switch_canonical_url -->
{META_FAVICO}
{META}
{META_FB_LIKE}
<meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
{T_HEAD_STYLESHEET}
{CSS}
<link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
<link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
<script src="{JQUERY_PATH}" type="text/javascript"></script>
<!-- BEGIN switch_recent_jquery -->
<script src="{JS_DIR}jquery1.9/jquery-migrate-1.4.1.js" type="text/javascript"></script>
<script src="{JQUERY_DIR}browser/v1.0/jquery.browser.min.js" type="text/javascript"></script>
<script src="{JQUERY_DIR}support/jquery.support.js" type="text/javascript"></script>
<!-- END switch_recent_jquery -->
<script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>
{RICH_SNIPPET_GOOGLE}
<!-- BEGIN switch_fb_login -->
<script src="https://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
<script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
<!-- END switch_fb_login -->
<!-- BEGIN switch_ticker -->
<link type="text/css" rel="stylesheet" href="{JQUERY_DIR}ticker/ticker.css" />
<script src="{JQUERY_DIR}ticker/ticker.js" type="text/javascript"></script>
<!-- END switch_ticker -->
<!-- BEGIN switch_ticker_new -->
<script src="{JQUERY_DIR}jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
/* Definir le sens de direction en fonction du panneau admin */
var tickerDirParam = "{switch_ticker.DIRECTION}";
var slid_vert = false;
var auto_dir = 'next';
var h_perso = parseInt({switch_ticker.HEIGHT});
switch( tickerDirParam )
{
case 'top' :
slid_vert = true;
break;
case 'left':
break;
case 'bottom':
slid_vert = true;
auto_dir = 'prev';
break;
case 'right':
auto_dir = 'prev';
break;
default:
slid_vert = true;
}
$(document).ready(function() {
$('#fa_ticker_content').css('display','block');
var width_max = $('ul#fa_ticker_content').width();
var width_item = Math.floor(width_max / {switch_ticker.SIZE});
if (width_max > 0)
{
$('ul#fa_ticker_content li').css('float','left').css('list-style','none').width(width_item).find('img').each(function () {
if ($(this).width() > width_item)
{
var ratio = $(this).width() / width_item;
var new_height = Math.round($(this).height() / ratio);
$(this).height(new_height).width(width_item);
}
});
if (slid_vert)
{
var height_max = h_perso;
$('ul#fa_ticker_content li').each( function () {
if ($(this).height() > height_max)
{
height_max = $(this).height();
}
} );
$('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
$('ul#fa_ticker_content li').height(height_max);
}
$('#fa_ticker_content').jcarousel({
vertical: slid_vert,
wrap: 'circular',
auto: {switch_ticker.STOP_TIME},
auto_direction: auto_dir,
scroll: 1,
size: {switch_ticker.SIZE},
height_max: height_max,
animation: {switch_ticker.SPEED}
});
}
else
{
$('ul#fa_ticker_content li:not(:first)').css('display','none');
$('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
}
});
//]]>
</script>
<!-- END switch_ticker_new -->
<script type="text/javascript">//<![CDATA[
$(document).ready(function(){
<!-- BEGIN switch_enable_pm_popup -->
pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
if(pm != null) { pm.focus(); }
<!-- END switch_enable_pm_popup -->
<!-- BEGIN switch_report_popup -->
report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
if(report != null) { report.focus(); }
<!-- END switch_report_popup -->
<!-- BEGIN switch_ticker -->
$(document).ready(function() {
Ticker.start({
height : {switch_ticker.HEIGHT},
spacing : {switch_ticker.SPACING},
speed : {switch_ticker.SPEED},
direction : '{switch_ticker.DIRECTION}',
pause : {switch_ticker.STOP_TIME}
});
});
<!-- END switch_ticker -->
});
<!-- BEGIN switch_login_popup -->
var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = true, logInBackgroundClass = false;
$(document).ready( function() {
$(window).resize(function() {
var windowWidth = document.documentElement.clientWidth;
var popupWidth = $("#login_popup").width();
var mypopup = $("#login_popup");
$("#login_popup").css({
"left": windowWidth/2 - popupWidth/2
});
});
});
<!-- END switch_login_popup -->
//]]>
</script>
{GREETING_POPUP}
<style type="text/css">
#page-footer, div.navbar, div.navbar ul.linklist {
display: block !important;
}
ul.linklist li.rightside, ul.linklist li.rightside a.copyright {
display: inline !important;
}
<!-- BEGIN switch_ticker_new -->
.jcarousel-skin-tango .jcarousel-item {
text-align:center;
width: 10px;
}
.jcarousel-skin-tango .jcarousel-item-horizontal {
margin-right: {switch_ticker.SPACING}px;
}
.jcarousel-skin-tango .jcarousel-item-vertical {
margin-bottom: {switch_ticker.SPACING}px;
}
<!-- END switch_ticker_new -->
</style>
{HOSTING_JS}
<!-- BEGIN google_analytics_code -->
<script type="text/javascript">
//<![CDATA[
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', '{G_ANALYTICS_ID}', 'auto');
<!-- BEGIN google_analytics_code_bis -->
ga('create', '{G_ANALYTICS_ID_BIS}', 'auto', 'bis');
<!-- END google_analytics_code_bis -->
ga('send', 'pageview');
<!-- BEGIN google_analytics_code_bis -->
ga('bis.send', 'pageview');
<!-- END google_analytics_code_bis -->
ga('set', 'anonymizeIp', true);
<!-- BEGIN google_analytics_code_bis -->
ga('bis.set', 'anonymizeIp', true);
<!-- END google_analytics_code_bis -->
//]]>
</script>
<!-- END google_analytics_code -->
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,500,700,700i&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese" rel="stylesheet" />
<link href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet" />
</head>
<body id="modernbb">
<!-- BEGIN hitskin_preview -->
<div id="hitskin_preview" style="display: block;">
<h1><img src="{hitskin_preview.PATH_IMG_FA}hitskin/hitskin_logo.png" alt="" /> <em>Hit</em>skin.com</h1>
<div class="content">
<p>
{hitskin_preview.L_THEME_SITE_PREVIEW}
<br />
<span>{hitskin_preview.U_INSTALL_THEME}<a href="https://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
</p>
</div>
</div>
<!-- END hitskin_preview -->
<!-- BEGIN switch_login_popup -->
<div id="login_popup" style="z-index: 10000 !important;">
<div class="h3">{SITENAME}</div>
<div id="login_popup_message">
{LOGIN_POPUP_MSG}
</div>
<div id="login_popup_buttons">
<form action="{S_LOGIN_ACTION}" method="get">
<input type="submit" class="button1" value="{L_LOGIN}" />
<input type="button" class="button1" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
<input id="login_popup_close" type="button" class="button2" value="{L_DONT_DISPLAY_AGAIN}" />
</form>
</div>
</div>
<!-- END switch_login_popup -->
<a id="top" name="top" accesskey="t"></a>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<div id="page-header">
<div class="">
<div id="headerbar-top">
<div class="nav_haut">Welcome, <span class="USERNAME"></span></div>
<div class="wrap">
<ul class="navbar navlinks{NAVBAR_BORDERLESS}">
<li>{GENERATED_NAV_BAR}</li>
</ul>
</div>
</div><div class="vava_outline"><div class="js-avatar"></div></div>
<a href="{U_INDEX}" id="logo"><img src="{LOGO}" alt="{U_INDEX}"/></a>
<!-- BEGIN switch_h1 -->
<!-- END switch_h1 -->
<!-- BEGIN switch_desc -->
<!-- END switch_desc -->
</div>
</div>
<!-- BEGIN switch_ticker_new -->
<div id="fa_ticker_blockD" style="margin-top:4px;">
<div class="module">
<div class="inner">
<div id="fa_ticker_container">
<ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display:none">
<!-- BEGIN ticker_row -->
<li>{switch_ticker.ticker_row.ELEMENT}</li>
<!-- END ticker_row -->
</ul>
</div>
</div>
</div>
</div>
<!-- END switch_ticker_new -->
</div>
<div class="conteneur_minwidth_IE">
<div class="conteneur_layout_IE">
<div class="conteneur_container_IE">
<div id="wrap">
<div id="page-body">
<!-- BEGIN switch_ticker -->
<div id="fa_ticker_block" style="margin-top:4px;">
<div class="module">
<div class="inner">
<div id="fa_ticker_container">
<div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
<div class="fa_ticker_content">
<!-- BEGIN ticker_row -->
<div>{switch_ticker.ticker_row.ELEMENT}</div>
<!-- END ticker_row -->
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END switch_ticker -->
<div id="{ID_CONTENT_CONTAINER}"{CLASS_CONTENT_CONTAINER}>
<div id="outer-wrapper">
<div id="wrapper">
<div id="{ID_LEFT}">
<!-- BEGIN giefmod_index1 -->
{giefmod_index1.MODVAR}
<!-- BEGIN saut -->
<div style="height:{SPACE_ROW}px"></div>
<!-- END saut -->
<!-- END giefmod_index1 -->
</div>
<div id="container">
<div id="content-main">
<div id="main">
<div id="main-content">
> CSS
- Code:
:root{/* Tu peux changer les couleurs, ça changera partout */
--police-titre: Oswald;
--police-text: Roboto;
--color0: #F0F0F0; /*Couleur du fond de page*/
--color1: #dee6e6; /*gris clair*/
--color2: #6f7f7f; /*gris foncé*/
--color3: #2F2F2F; /*quasi noir*/
--color4: #FFFFFF; /*blanc*/
--color5: #16979d; /*vert-bleu*/
}
/* ----- GENERALITES DU FORUM ----- */
a{
cursor: pointer;
text-decoration: none!important;
}
a#logo{
margin-top: 80px;
}
a#logo img {
width: 100%;
}
.content h2, .panel h2, .content h1, .panel h1,.h3, h3, .panel h3 {
border: none;
margin: 0;
padding: 0;
}
.panel.introduction {
background: none!important;
box-shadow: none!important;
}
/*BARRE DE NAVIGATION */
.nav_haut {
text-align: left;
margin-left: 170px;
color: var(--color3);
text-shadow: 1px 1px 0px var(--color4);
font: 100 30px var(--police-titre);
text-transform: uppercase;
letter-spacing: 1px;
}
.nav_haut span.USERNAME {
display: inline;
}
div#headerbar-top .wrap a.mainmenu img {
display: none;
}
div#headerbar-top .wrap a {
color: var(--color3);
text-transform: uppercase;
font: 100 16px var(--police-titre);
}
div#headerbar-top .wrap a:hover:after {
content: "";
display: block;
margin: 0 auto;
height: 2px;
width: 50%;
background: var(--color5);
box-shadow: none!important;
}
.navbar a:hover {
box-shadow: none!important;
}
div#headerbar-top, .is-sticky#headerbar-top {
background: var(--color0);
box-shadow: none;
height: auto;
position: fixed;
width: 100%;
z-index: 30!important;
padding: 0!important;
}
div#headerbar-top .wrap {
width: 100%;
background: var(--color4);
}
body#modernbb {
margin-top: 0!important;
}
.is-sticky#headerbar-top.w-toolbar {
top: 0;
}
ul.navbar.navlinks {
width: 100%;
text-align: right;
height: 38px;
}
.navbar li {
display: inline-block;
margin: 0;
}
.navbar {
text-align: center;
}
.vava_outline {
left: 30px;
top: 10px;
z-index: 999;
position: fixed;
width: 120px;
height: 120px;
background: var(--color0);
border-radius: 100%;
border: 3px solid var(--color4);
}
.js-avatar {
width: 114px;
height: 114px;
border-radius: 100%;
margin: 0 auto;
overflow: hidden;
position: relative;
}
.js-avatar img{
width:100%;
}
/* BARRE DE NOTIFS */
div#fa_toolbar {
background-color: transparent!important;
top: 0px;
padding: 5px;
width: 99%;
z-index: 1;
}
#fa_right #fa_notifications {
line-height: 30px;
display: block!important;
position: absolute;
top: 120px;
right: 0;
width: 160px;
padding: 3px;
text-align: center;
background: var(--color4);
border: 1px solid var(--color2);
border-radius: 0!important;
font-family: var(--police-titre);
font-size: 16px;
font-weight: 200;
color: var(--color3);
text-decoration: none!important;
text-transform: uppercase;
}
#fa_toolbar #fa_right.notification #notif_list {
top: 165px!important;
right: 0;
left: auto!important;
max-width: 400px;
min-width: 160px;
border: none;
border-radius: 3px;
}
#fa_menu:hover :visited, #fa_toolbar > #fa_right.notification > #fa_notifications {
background-color: var(--color1);
color: var(--color3);
text-shadow: 1px 1px 0 var(--color4);
}
#fa_toolbar #fa_right #notif_list li.see_all {
background-color: var(--color1);
border-radius: 0;
color: #fff;
font-size: 1.3rem;
padding: 12px 18px!important;
text-align: center;
border: 1px solid var(--color2);
}
#fa_toolbar #fa_right #notif_list li.see_all a {
color: var(--color3);
}
#fa_toolbar #fa_right #notif_list li.unread {
background-color: var(--color2);
font-weight: 400;
}
#fa_toolbar #fa_right #notif_list li a.delete {
float: none;
}
#fa_toolbar #fa_right #notif_list li .contentText {
overflow: visible!important;
width: 340px !important;
height: auto!important;
}
#fa_toolbar #fa_right #notif_list {
background-color: var(--color2);
box-shadow: none!important;
}
/* FIN BARRE DE NOTIFS */
/*------------------------------- Début Pa pour Aily ----------------------------------*/
.paaurora{
width: 900px;
margin: 80px auto 0;
box-sizing: border-box;
}
.paaurora *{
box-sizing: border-box;
margin: 0 auto;
text-decoration: none;
}
.paaurora > div{
float: left;
}
.paaurora h1{
width: 900px;
background: var(--color1);
border: 2px solid var(--color2);
margin-bottom: 12px;
text-align: center;
color: var(--color3);
text-shadow: 1px 1px 0px var(--color4);
font: 100 30px var(--police-titre);
text-transform: uppercase;
letter-spacing: 1px;
}
.paaurora_bloctexte{
background: var(--color4);
border: 1px solid var(--color2);
overflow: auto;
padding: 5px;
}
.paaurora p{
font: 13px var(--police-text);
text-align: justify;
color: var(--color3);
}
.paaurora_contexte{
width: 370px;
height: 170px;
}
.paaurora_contexte > p > a, .paaurora_event > p > a{
color: #16979d;
font-weight: bold;
padding-left: 5px;
}
.paaurora_contourstaff{
width: 310px;
height: 120px;
margin: 0px 10px;
display: flex;
justify-content: space-between;
}
.paaurora_casehover{
width: 98px;
height: 120px;
margin: 0;
background: var(--color4);
border: 1px solid var(--color3);
}
.paaurora_casehover > div{
width: 90px;
height: 85px;
margin-top: 2px;
position: relative;
background-size: cover;
}
.paaurora_casehover > div > div{
position: absolute;
width: 90px;
height: 86px;
background: var(--color0);
opacity: 0;
transition: all 0.7s;
padding-top: 12px;
text-align: center;
color: var(--color3);
font: 14px var(--police-text);
line-height: 20px;
content: "";
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotateY(90deg);
transform-origin: 50%;
transition: all 0.4s ease-in;
}
.paaurora_casehover:hover > div > div{
transform: translate(-50%, -50%) rotateY(0deg);
opacity: 1;
}
.paaurora_casehover > div > div a{
color: var(--color3);
}
.paaurora_casehover span{
display: block;
padding-top: 2px;
color: var(--color3);
text-align: center;
text-transform: uppercase;
font: 18px var(--police-titre);
}
.paaurora h2{
float: left;
width: 310px;
height: 40px;
margin: 10px 10px 0px;
background: var(--color2);
font: 200 22px var(--police-titre);
text-align: center;
color: var(--color4);
text-shadow: 1px 1px 0px var(--color3);
padding-top: 3px;
}
.paaurora h2 a{
text-decoration: none;
color: var(--color4)!important;
text-shadow: 1px 1px 0px var(--color3);
transition: all 0.6s linear;
}
.paaurora h2 a:hover {
color: var(--color1)!important;
}
.paaurora h3{
font: 18px var(--police-text);
color: var(--color3);
text-transform: uppercase;
}
.paaurora_contourliens{
margin-top: -120px;
margin-bottom: 10px;
width: 200px;
height: 230px;
}
.paaurora_contourliens a{
display: block;
text-align: center;
background: var(--color5);
color: white;
margin: 0 0 7px 0;
font: 200 18px var(--police-titre);
text-shadow: 1px 1px 0px var(--color3);
transition: all 0.8s;
}
.paaurora_contourliens a:hover{
background: var(--color1);
}
.paaurora_contourpredef{
width: 370px;
height: 130px;
margin-top: -60px;
display: flex;
justify-content: space-between;
}
.paaurora_predef{
width: 118px;
height: 130px;
}
.paaurora_predef > div, .paaurora_predef > div > div{
width: 110px;
height: 96px;
}
.paaurora_predef > div > div{
padding-top: 6px;
}
.paaurora_news{
width: 310px;
height: 130px;
margin: -60px 10px 0px;
}
.paaurora_news ul{
width: 100%;
height: 92px;
overflow: auto;
margin-top: 3px;
padding-inline-start: 20px!important;
}
.paaurora_news ul li{
font: 13px var(--police-text);
color: var(--color3);
}
.paaurora_topsites{
width: 200px;
height: 70px;
text-align: center;
}
.paaurora_event{
width: 370px;
height: 100px;
margin-top: 10px;
}
.paaurora_contourpartos{
width: 520px;
height: 50px;
margin: 10px 0px 0px 10px;
display: flex;
justify-content: space-between;
}
.paaurora_contourpartos a{
margin: 0 0;
}
.paaurora_contourpartos img {
filter: grayscale(100%);
transition: all 0.8s;
}
.paaurora_contourpartos img:hover {
filter: grayscale(0%);
}
/*------------------------------- Fin PA ----------------------------------*/
/* CATEGORIES */
.cataurora{
width: 900px;
margin: auto;
box-sizing: border-box;
}
.cataurora *{
box-sizing: border-box;
margin: 0 auto;
text-decoration: none;
}
.cataurora > div{
float: left;
}
.cataurora_title h2{
width: 900px;
background: var(--color1);
border: 2px solid var(--color2);
margin: 30px auto 0px;
text-align: center;
color: var(--color3);
text-shadow: 1px 1px 0px var(--color4);
font: 100 30px var(--police-titre);
text-transform: uppercase;
letter-spacing: 1px;
}
.cataurora_bloctexte{
width: 705px;
height: 120px;
margin: 0px 10px;
background: var(--color4);
border: 1px solid var(--color2);
overflow: auto;
padding: 5px;
}
.cataurora p{
font: 13px var(--police-text);
text-align: justify;
color: var(--color3);
}
img.cataurora_oldnewtruc{
float: left;
width: 100px;
height: 55px;
margin: 20px 10px 10px 0px;
}
.cataurora_entete{
width: 790px;
height: 55px;
background: var(--color2);
margin-bottom: 10px;
margin-top: 20px;
}
.cataurora_entete > a{
padding: 3px 15px;
font: 200 26px var(--police-titre);
color: var(--color4)!important;
text-shadow: 1px 1px 0px var(--color3);
text-transform: uppercase;
}
.cataurora_entete > span{
display: block;
margin-top: -2px;
padding-left: 40px;
text-transform: uppercase;
color: var(--color1);
font: 13px var(--police-text);
}
.cataurora_ava{
width: 100px;
height: 120px;
position: relative;
overflow: hidden;
}
.cataurora_ava img{
position: absolute;
top: -20%;
width: 100%;
}
.cataurora_stats{
width: 75px;
height: 55px;
background: var(--color2);
margin-bottom: 10px;
}
.cataurora_stats span{
display: block;
padding: 2px;
text-transform: uppercase;
color: var(--color1);
text-shadow: 1px 1px 0px var(--color3);
font: 13px var(--police-text);
text-align: center;
}
.cataurora_stats em{
display: block;
color: var(--color4);
font: 17px var(--police-text);
text-align: center;
}
.cataurora_ssfow{
width: 900px;
}
.cataurora_ssfow a{
display: inline-block;
background: var(--color2);
margin-right: 5px;
margin-bottom: 5px;
padding: 4px 8px;
color: var(--color4)!important;
font: 14px var(--police-text);
text-transform: uppercase;
}
/* FIN CATEGORIES */
/*---------- DÉBUT QEEL KAYL POUR AILY ----------*/
.qeelaurora{
width: 900px;
margin: auto;
box-sizing: border-box;
}
.qeelaurora *{
box-sizing: border-box;
margin: 0 auto;
text-decoration: none;
}
.qeelaurora > div{
float: left;
}
.qeelaurora h1{
float: left;
width: 900px;
background: var(--color1);
border: 2px solid var(--color2);
margin: 50px 0px 20px!important;
text-align: center;
color: var(--color3);
text-shadow: 1px 1px 0px var(--color4);
font: 100 30px var(--police-titre);
text-transform: uppercase;
letter-spacing: 1px;
}
.qeelaurora p{
font: 13px var(--police-text);
text-align: justify;
color: var(--color3);
}
.qeelaurora_entete{
width: 445px;
height: 55px;
background: var(--color2);
margin-bottom: 20px!important;
}
.qeelaurora_stats {
overflow: hidden;
}
.qeelaurora_entete:nth-child(odd){
margin-left: 10px;
}
.qeelaurora_stats em > strong {
font-weight: 400;
font-style: italic;
display: block;
}
.qeelaurora_entete > h2{
padding: 6px 1px;
font: 200 26px var(--police-titre);
color: var(--color4);
text-shadow: 1px 1px 0px var(--color3);
text-transform: uppercase;
text-align: center;
}
.qeelaurora_bloctexte{
width: 360px;
height: 120px;
background: var(--color4);
border: 1px solid var(--color2);
overflow: auto;
padding: 5px;
}
.qeelaurora_stats{
width: 75px;
height: 55px;
background: var(--color2);
margin-bottom: 10px!important;
}
.qeelaurora_stats span{
display: block;
padding: 2px;
text-transform: uppercase;
color: var(--color1);
text-shadow: 1px 1px 0px var(--color3);
font: 13px var(--police-text);
text-align: center;
}
.qeelaurora_stats em{
display: block;
color: var(--color4);
font: 17px var(--police-text);
text-align: center;
}
.qeelaurora_stats:nth-child(odd){
margin-right: 10px;
}
.qeelaurora_statscontainer{
width: 160px;
display: flex;
flex-wrap: wrap;
margin: 0px 10px!important;
}
.qeelaurora_group{
margin: 10px 0px 100px 5px!important;
width: 890px;
display: flex;
justify-content: space-between;
}
.qeelaurora_group a{
display: block;
color: var(--color4);
font: 14px var(--police-text);
text-transform: uppercase;
text-align: center;
}
.qeelaurora_group > div{
width: 130px;
margin: 0;
position: relative;
background: var(--color2);
border: 1px solid var(--color4);
outline: 5px solid var(--color2);
padding: 2px 6px;
}
.qeelaurora_group > div > div{
width: 900px;
height: 70px;
background: var(--color4);
border: 1px solid var(--color2);
overflow: auto;
padding: 5px;
opacity: 0;
transition: all 0.8s;
}
.infogroup1 > div{
position: absolute;
top: 35px;
left: -6px;
}
.infogroup2 > div{
position: absolute;
top: 35px;
left: -158px;
}
.infogroup3 > div{
position: absolute;
top: 35px;
left: -310px;
}
.infogroup4 > div{
position: absolute;
top: 35px;
left: -462px;
}
.infogroup5 > div{
position: absolute;
top: 35px;
left: -614px;
}
.infogroup6 > div{
position: absolute;
top: 35px;
left: -766px;
}
.infogroup1:hover > div, .infogroup2:hover > div, .infogroup3:hover > div, .infogroup4:hover > div, .infogroup5:hover > div, .infogroup6:hover > div{
opacity: 1;
}
.qeelaurora_footer{
width: 900px;
height: auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-bottom: 10px;
}
.qeelaurora_footer a{
margin: 5px 4px 0px;
}
.statistics {
display: none!important;
}
/*---------- FIN DU QEEL POUR AILY ----------*/
ET ENFIN
> Modules > Javascript, à cocher sur toutes les pages :
- Code:
$(function(){
$.each(_userdata, function(key, value){
$(".js-" + key).html(value);
})
});
Aily prend son envol pour atteindre la première place !
Puf/Surnom : Aily Messages : 178Le personnage
Sexe du perso: Femelle
Âge du perso: 45 lunes
Mentor / apprenti : Nuage d'Espoir
Ascendance de l'Aube
Mar 23 Juil 2019 - 22:20
Commande de codage
< >
Fiche
• Objet de la commande : Une fiche de pub s'il te plait
• Schéma ou maquette (facultatif) : https://zupimages.net/up/19/30/soxq.png
• Image(s), si vous en désirez : https://zupimages.net/up/19/30/jtl7.png (staff, après tu peux mettre ce que tu veux j'ai fais les images au hasard :/)
https://zupimages.net/up/19/30/u8mt.png (predef)
• Couleurs, tons :
bleu #16979d
gris #f0f0f0
blanc #ffffff
• Éléments à insérer :
Des liens pour le profil et mp du staff
Lien en cliquant sur le "Nom du forum"
Liens navigations
Lien en cliquant sur "fiche" pour les predef en hover (possible de mettre le mot fiche en italic ?)
• Effets : bordure en haut et en bas de la fiche en bleu
bordure éloignée (comme sur le schéma) pour les images staff et prédef
https://fonts.google.com/specimen/Dancing+Script (pour le "nom du forum" et "nos boutons"
• Autre chose ? Je vous nem, thank you
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Mer 24 Juil 2019 - 11:39
Bonjour Aily, on prend ta commande ** On kiffe tes bubulles sur ton schéma donc ça risque d'arriver vite *meurt*
EDIT du soir : Voilà, fini ! Donc tu l'as vue sur Codepen, mais je te la montre sur fow avec les variables > http://sun-forum-test.forumactif.com/t81-pour-aily
Et donc les codes :
Le html à poster sur les fows
Et le css à mettre dans une nouvelle page html (tu sais comment faire je crois, non ?)
-- ATELIER OUVEEEEEERT --
EDIT du soir : Voilà, fini ! Donc tu l'as vue sur Codepen, mais je te la montre sur fow avec les variables > http://sun-forum-test.forumactif.com/t81-pour-aily
Et donc les codes :
Le html à poster sur les fows
- Code:
<iframe src="LIENDELAPAGEHTML" width="100%" height="690" scrolling="no" frameborder="0" align="middle"></iframe>
Et le css à mettre dans une nouvelle page html (tu sais comment faire je crois, non ?)
- Code:
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Fiche de pub Aurora</title>
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript" src="http://tinyurl.com/var-fa"></script>
<style type="text/css">
.pubaurora{
width: 480px;
height: 685px;
margin: auto;
box-sizing: border-box;
background: #FFF;
border-top: 10px solid #16979d;
border-bottom: 10px solid #1AB0B8;
padding: 10px;
}
.pubaurora *{
box-sizing: border-box;
margin: 0;
}
.pubaurora h1{
float: left;
width: 460px;
margin-bottom: 25px;
padding: 0px 5px;
font: 38px Dancing Script;
text-align: center;
color: #16979d;
}
.pubaurora h1 a{
text-decoration: none;
color: #16979d;
}
.pubaurora h1:after{
content:'';
display: block;
width: 70px;
height: 2px;
background: #16979d;
margin: auto;
}
.pubaurora_contexte{
float: left;
display: inline-block;
width: 250px;
height: 160px;
background: #f0f0f0;
overflow: auto;
padding: 5px;
color: #16979d;
text-align: justify;
font: 12px Roboto;
}
.pubaurora_staff{
float: right;
width: 203px;
height: 74px;
margin-bottom: 10px;
}
.pubaurora_staffimg{
display: inline-block;
overflow: hidden;
width: 74px;
height: 74px;
padding: 2px;
border-radius: 100%;
background: #16979d;
text-align: center;
}
.pubaurora_staffimg img{
width: 70px;
height: 70px;
margin: auto;
border: 4px solid #FFF;
border-radius: 100%;
}
.pubaurora_staffdescri{
display: inline-block;
overflow: hidden;
width: 125px;
height: 72px;
padding: 5px 10px;
}
.pubaurora_staffdescri h3{
color: #16979d;
text-transform: uppercase;
font: 18px Roboto;
}
.pubaurora_staffdescri h4{
color: #16979d;
text-transform: uppercase;
font: 12px Roboto;
}
.pubaurora_staffdescri a{
display: inline-block;
background: #16979d;
margin-top: 5px;
min-width: 45px;
height: 20px;
padding: 3px 4px;
text-align: center;
text-decoration: none;
color: #FFF;
text-transform: uppercase;
font: 12px Roboto;
}
.pubaurora_staffdescri a:first-of-type{
margin-right: 10px;
}
.pubaurora_predefs{
float: left;
width: 460px;
height: 74px;
margin: 10px 0px;
display: flex;
justify-content: space-between;
}
.pubaurora_casepredef{
float: left;
width: 74px;
height: 74px;
margin: 0;
background: #16979d;
border-radius: 100%;
padding: 2px;
}
.pubaurora_casepredef > div{
width: 70px;
height: 70px;
border-radius: 100%;
border: 3px solid #FFF;
margin: auto;
position: relative;
background-size: cover;
}
.pubaurora_casepredef > div > div{
position: relative;
width: 68px;
height: 68px;
margin: -2px 0px 0px -2px;
border-radius: 100%;
background: rgba(247, 247, 247, 0.8);
opacity: 0;
transition: all 0.7s;
text-align: center;
color: #16979d;
font: 11px Roboto;
line-height: 13px;
display: table-cell;
vertical-align: middle;
}
.pubaurora_casepredef:hover > div > div{
opacity: 1;
}
.pubaurora_casepredef > div > div a{
text-decoration: none;
color: #16979d;
font-style: italic;
}
.pubaurora_stats{
float: left;
width: 200px;
height: 90px;
margin: 10px 10px 15px 0px;
}
.pubaurora_stats h2{
font: 14px Roboto;
color: #16979d;
text-transform: uppercase;
line-height: 22px;
}
.pubaurora_liens{
float: left;
width: 250px;
height: 90px;
margin-top: 10px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.pubaurora_liens a{
display: inline-block;
background: #16979d;
width: 120px;
height: 23px;
padding: 3px 4px;
text-align: center;
text-decoration: none;
color: #FFF;
text-transform: uppercase;
font: 14px Roboto;
transition: all 0.7s;
}
.pubaurora_liens a:hover{
background: #f0f0f0;
color: #16979d;
}
.pubaurora_boutons{
float: left;
width: 460px;
height: 90px;
text-align: center;
color: #16979d;
font: 14px Roboto;
}
.pubaurora_boutons a{
display: inline-block;
margin-right: 10px;
color: #16979d;
font: 12px Roboto;
text-decoration: none;
}
.pubaurora_boutons a, .pubaurora_boutons span {
position: relative;
vertical-align: middle;
}
.pubaurora > p{
float: left;
width: 460px;
margin: 30px auto 0;
text-align: center;
font: 8px Roboto;
color: #16979d;
}
.pubaurora > p a{
text-decoration: none;
color: #16979d;
}
</style>
<link href="https://fonts.googleapis.com/css?family=Dancing+Script|Roboto&display=swap" rel="stylesheet">
<div class="pubaurora">
<h1><a href="#">Aurora</a></h1>
<div class="pubaurora_contexte">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate nisi sit amet mauris lobortis, nec dignissim magna varius. Ut imperdiet ex a vestibulum vulputate. Integer rhoncus accumsan cursus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Morbi a dolor vitae sapien fringilla placerat. Etiam ultricies urna diam, non mattis lectus fringilla id. Pellentesque tincidunt augue vel elit porttitor, eu laoreet enim fermentum. Nulla imperdiet nulla velit, eu egestas erat finibus sed...</div>
<div class="pubaurora_staff">
<div class="pubaurora_staffimg"><img src="https://www.zupimages.net/up/19/30/jtl7.png"/></div>
<div class="pubaurora_staffdescri"><h3>Nom truc</h3><h4>Rang</h4><a href="#">Profil</a><a href="#">MP</a></div>
</div>
<div class="pubaurora_staff">
<div class="pubaurora_staffdescri"><h3>Nom truc</h3><h4>Rang</h4><a href="#">Profil</a><a href="#">MP</a></div>
<div class="pubaurora_staffimg"><img src="https://www.zupimages.net/up/19/30/jtl7.png"/></div>
</div>
<div class="pubaurora_predefs">
<div class="pubaurora_casepredef">
<div style="background-image: url(https://www.zupimages.net/up/19/30/u8mt.png);">
<div><b>AMBROISE<br />VAUGHEN</b><br />Don truc<br /><a href="#">Fiche</a></div>
</div>
</div>
<div class="pubaurora_casepredef">
<div style="background-image: url(https://www.zupimages.net/up/19/30/u8mt.png);">
<div><b>LILITH<br />VANTRUC</b><br />Don truc<br /><a href="#">Fiche</a></div>
</div>
</div>
<div class="pubaurora_casepredef">
<div style="background-image: url(https://www.zupimages.net/up/19/30/u8mt.png);">
<div><b>SIRIUS</b><br />Don truc<br /><a href="#">Fiche</a></div>
</div>
</div>
<div class="pubaurora_casepredef">
<div style="background-image: url(https://www.zupimages.net/up/19/30/u8mt.png);">
<div><b>NICOLAS</b><br />Don truc<br /><a href="#">Fiche</a></div>
</div>
</div>
<div class="pubaurora_casepredef">
<div style="background-image: url(https://www.zupimages.net/up/19/30/u8mt.png);">
<div><b>NOM</b><br />Don truc<br /><a href="#">Fiche</a></div>
</div>
</div>
<div class="pubaurora_casepredef">
<div style="background-image: url(https://www.zupimages.net/up/19/30/u8mt.png);">
<div><b>NOM</b><br />Don truc<br /><a href="#">Fiche</a></div>
</div>
</div>
</div>
<div class="pubaurora_stats">
<h2>>> <span class="FORUMCOUNTUSER"></span> membres</h2>
<h2>>> <span class="FORUMCOUNTOPIC"></span> messages</h2>
<h2>>> Forum rpg trucmuche</h2>
<h2>>> Forum ouvert le ??/??/??</h2>
</div>
<div class="pubaurora_liens">
<a href="#">Lien truc</a><a href="#">Lien truc</a><a href="#">Lien truc</a><a href="#">Lien truc</a><a href="#">Lien truc</a><a href="#">Lien truc</a>
</div>
<h1>Boutons</h1>
<div class="pubaurora_boutons">
<span>50*50 :</span> <a href="#"><img src="https://www.zupimages.net/up/19/25/gy91.png"/></a> <a href="https://www.zupimages.net/up/19/25/gy91.png">https://www.zupimages.net/up/19/25/gy91.png</a>
<br /><br /><span>88*31 :</span> <a href="#"><img src="https://www.zupimages.net/up/19/25/6fgt.png"/></a> <a href="https://www.zupimages.net/up/19/25/6fgt.png">https://www.zupimages.net/up/19/25/6fgt.png</a>
</div>
<p>(c) Sun & Kayl pour <a href="#">Aurora</a></p>
</div>
</body>
</html>
-- ATELIER OUVEEEEEERT --
Invité
Invité
Ven 2 Aoû 2019 - 10:47
BONJOUR BONSOIR MES AMIES
Commande de codage
< >
Fiche
• Objet de la commande : Une fiche de liens parce que voyez vous après 4 ans sur un forum il serai le temps de se bouger le cul ![Atelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction] 3200486043](/users/3211/16/22/04/smiles/3200486043.gif)
• Schéma ou maquette (facultatif) : °° J'aimerai bien en faire un mais je peux pas rip
• Image(s), si vous en désirez : Du coup, (vu que je sais pas insérer une image à la place d'une autre sans tout foutre en l'air, faudra que vous m'appreniez parce que si je vous donne une image à chaque fois pour tous mes perso ça va être chiant à rendre, genre ça fera un énorme message de codage Nan en fait j'vais vous donnez de toute façon il m'en faut une de chaque couleur.
Pour Araneus (tons violets/oranges) : https://s1.1zoom.me/big0/835/351860-admin.jpg
Pour Spectre de Lumière (noir/orange): https://images.alphacoders.com/531/531430.jpg
Pour Scarabée Sacré (bleu/noir) : https://jardinage.lemonde.fr/images/dossiers/2016-12/scarabee1-160039.jpg
Pour Poisson Rouge (jaune/orange/bleu même) : https://p3.storage.canalblog.com/34/33/751879/56212709.jpg
Pour Petit Champignon (marron/vert) : https://www.sciencesetavenir.fr/assets/img/2014/03/19/cover-r4x3w1000-57df45a85e783-champignons.jpg
Pour Petit Lycaon (jesaispaslol) : https://i.pinimg.com/originals/b3/b7/43/b3b743afc0b7436c7f2185a816c81527.jpg
• Couleurs, tons : Il m'en faudrait une dans les tons verts/marron, une dans les tons bleus/noirs, une dans les tons rouges, une dans les jaunes/oranges, une dans les violets/orange, une dans les noires et oranges s'il vous plaît
• Éléments à insérer : Tout en haut l'âge, le clan, le nom, le rang, une section caractère, une autre physique et en dessous les liens en deux collones
• Effets : haha je sais pas du tout °° Joker ? Déjà avec ce que je vous ai donné je vois pas comment ça pourra être beau, alors bonne chance hein Sinon je veux bien des ombres sur les contours des fiches globalement et c'est tout
• Autre chose ? Je vous aime bordel, et désolée pour cette commande à moitié incompréhensible 
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Ven 2 Aoû 2019 - 16:09
ON PREND
-- Atelier OUVERT --
-- Atelier OUVERT --
Vieille branche
Puf/Surnom : Sun, Sunny, Nakin, et tout le bazar Messages : 2410Étoile Rayonnante
Lun 5 Aoû 2019 - 18:37
@Spectre de Lumière > Voilà déjà ce qu'on a, on éditera pour Scar du coup x)
~ ~ ~ ~ ~
Le code :
@Araneus >
@Nuage de Champignon >
@Poisson Rouge >
Lycaon >
@Scarabée Sacré t'as vu les couleurs en pv **
Le code pour ajouter un lien, c'est le même pour tout le monde (à coller avant le dernier /div (entouré des <>) à la toute fin) :
Les images représentant chaque lien doivent avoir une taille de 75*130 pixels (si t'as besoin d'aide pour les redimensions tu peux revenir nous voir en pv discord *paf*)
Spectre de Lumière
35 lunesMâleClan de l'OmbreGuérisseur
Physique
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo. Maecenas sed molestie magna. Donec eget rutrum eros. Nulla sit amet tincidunt felis, cursus rutrum metus. Nullam quis dolor mattis, varius ex ut, rutrum tellus. Vestibulum auctor, dui id rhoncus placerat, felis urna sagittis ante, et feugiat dui mauris at odio. Duis et erat faucibus, tristique mauris tincidunt, pulvinar mauris. Suspendisse volutpat dapibus elementum. Pellentesque tempor consequat nulla eu maximus.
Caractère
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo. Maecenas sed molestie magna. Donec eget rutrum eros. Nulla sit amet tincidunt felis, cursus rutrum metus. Nullam quis dolor mattis, varius ex ut, rutrum tellus. Vestibulum auctor, dui id rhoncus placerat, felis urna sagittis ante, et feugiat dui mauris at odio. Duis et erat faucibus, tristique mauris tincidunt, pulvinar mauris. Suspendisse volutpat dapibus elementum. Pellentesque tempor consequat nulla eu maximus.
Je recherche
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo.
Truc
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo. Maecenas sed molestie magna. Donec eget rutrum eros. Nulla sit amet tincidunt felis, cursus rutrum metus. Nullam quis dolor mattis, varius ex ut, rutrum tellus. Vestibulum auctor, dui id rhoncus placerat, felis urna sagittis ante, et feugiat dui mauris at odio. Duis et erat faucibus, tristique mauris tincidunt, pulvinar mauris. Suspendisse volutpat dapibus elementum. Pellentesque tempor consequat nulla eu maximus.
Muche
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo. Maecenas sed molestie magna. Donec eget rutrum eros. Nulla sit amet tincidunt felis, cursus rutrum metus. Nullam quis dolor mattis, varius ex ut, rutrum tellus. Vestibulum auctor, dui id rhoncus placerat, felis urna sagittis ante, et feugiat dui mauris at odio. Duis et erat faucibus, tristique mauris tincidunt, pulvinar mauris. Suspendisse volutpat dapibus elementum. Pellentesque tempor consequat nulla eu maximus.
Bidule
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo. Maecenas sed molestie magna. Donec eget rutrum eros. Nulla sit amet tincidunt felis, cursus rutrum metus. Nullam quis dolor mattis, varius ex ut, rutrum tellus. Vestibulum auctor, dui id rhoncus placerat, felis urna sagittis ante, et feugiat dui mauris at odio. Duis et erat faucibus, tristique mauris tincidunt, pulvinar mauris. Suspendisse volutpat dapibus elementum. Pellentesque tempor consequat nulla eu maximus.
Chouette
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis libero vel erat ornare fringilla. Cras mattis, nisl sit amet sagittis pellentesque, nisl lacus fermentum lectus, placerat commodo leo nisl nec augue. Vestibulum congue tortor ac vulputate fringilla. Etiam scelerisque accumsan dui ut vulputate. Etiam quis dictum leo. Maecenas sed molestie magna. Donec eget rutrum eros. Nulla sit amet tincidunt felis, cursus rutrum metus. Nullam quis dolor mattis, varius ex ut, rutrum tellus. Vestibulum auctor, dui id rhoncus placerat, felis urna sagittis ante, et feugiat dui mauris at odio. Duis et erat faucibus, tristique mauris tincidunt, pulvinar mauris. Suspendisse volutpat dapibus elementum. Pellentesque tempor consequat nulla eu maximus.
Le code :
- Code:
<link href="https://www.aht.li/3400288/Liens_Aido_Spectry.css" rel="stylesheet" type="text/css"><div class="linkaido"><img src="https://www.zupimages.net/up/19/31/qbwm.png"/><h1>Spectre de Lumière</h1><div class="linkaido_infos"><span>35 lunes</span><span>Mâle</span><span>Clan de l'Ombre</span><span>Guérisseur</span></div><div class="linkaido_cadrebase"><h2>Physique</h2><p>ICI LE PHYSIQUE DE SPECTRY</p></div><div class="linkaido_cadrebase"><h2>Caractère</h2><p>ICI LE CARA DE SPECTRY</p></div><div class="linkaido_cadrebase linkaido_cadresearch"><h2>Je recherche</h2><p>ICI LE TEXTE DES LIENS RECHERCHÉS</p></div><span>~ ~ ~ ~ ~</span><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
</div>
@Araneus >
- Code:
<link href="https://www.aht.li/3400328/Liens_Aido_Araneus.css" rel="stylesheet" type="text/css"><div class="linkaido1"><img src="https://zupimages.net/up/19/31/xc89.png"/><h1>Araneus</h1><div class="linkaido_infos"><span>? lunes</span><span>Femelle</span><span>Escogriffe</span><span>Araignée</span></div><div class="linkaido_cadrebase"><h2>Physique</h2><p>ICI LE PHYSIQUE D'ARA</p></div><div class="linkaido_cadrebase"><h2>Caractère</h2><p>ICI LE CARA D'ARA</p></div><div class="linkaido_cadrebase linkaido_cadresearch"><h2>Je recherche</h2><p>ICI LE TEXTE DES LIENS RECHERCHÉS</p></div><span>~ ~ ~ ~ ~</span><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
</div>
@Nuage de Champignon >
- Code:
<link href="https://www.aht.li/3400332/Liens_Aido_Champi.css" rel="stylesheet" type="text/css"><div class="linkaido2"><img src="https://zupimages.net/up/19/31/1s7j.png"/><h1>Nuage de Champignon</h1><div class="linkaido_infos"><span>6 lunes</span><span>Mâle</span><span>Clan du Tonnerre</span><span>Apprenti</span></div><div class="linkaido_cadrebase"><h2>Physique</h2><p>ICI LE PHYSIQUE DE CHAMPIPI</p></div><div class="linkaido_cadrebase"><h2>Caractère</h2><p>ICI LE CARA DE CHAMPIPI</p></div><div class="linkaido_cadrebase linkaido_cadresearch"><h2>Je recherche</h2><p>ICI LE TEXTE DES LIENS RECHERCHÉS</p></div><span>~ ~ ~ ~ ~</span><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
</div>
@Poisson Rouge >
- Code:
<link href="https://www.aht.li/3400336/Liens_Aido_Poisson.css" rel="stylesheet" type="text/css"><div class="linkaido3"><img src="https://zupimages.net/up/19/31/4r7q.png"/><h1>Poisson Rouge</h1><div class="linkaido_infos"><span>? lunes</span><span>Mâle</span><span>Clan du Tonnerre</span><span>Guerrier</span></div><div class="linkaido_cadrebase"><h2>Physique</h2><p>ICI LE PHYSIQUE DU POISSON ROUGE</p></div><div class="linkaido_cadrebase"><h2>Caractère</h2><p>ICI LE CARA DU POISSON ROUGE</p></div><div class="linkaido_cadrebase linkaido_cadresearch"><h2>Je recherche</h2><p>ICI LE TEXTE DES LIENS RECHERCHÉS</p></div><span>~ ~ ~ ~ ~</span><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
</div>
Lycaon >
- Code:
<link href="https://www.aht.li/3400337/Liens_Aido_Lycaon.css" rel="stylesheet" type="text/css"><div class="linkaido4"><img src="https://zupimages.net/up/19/31/fccp.png"/><h1>Lycaon Truc</h1><div class="linkaido_infos"><span>? lunes</span><span>Mâle</span><span>Clan de Chose</span><span>Rang</span></div><div class="linkaido_cadrebase"><h2>Physique</h2><p>ICI LE PHYSIQUE DE LYCA</p></div><div class="linkaido_cadrebase"><h2>Caractère</h2><p>ICI LE CARA DE LYCA</p></div><div class="linkaido_cadrebase linkaido_cadresearch"><h2>Je recherche</h2><p>ICI LE TEXTE DES LIENS RECHERCHÉS</p></div><span>~ ~ ~ ~ ~</span><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
</div>
@Scarabée Sacré t'as vu les couleurs en pv **
- Code:
<link href="https://www.aht.li/3401764/Liens_Aido_Scar.css" rel="stylesheet" type="text/css"><div class="linkaido5"><img src="https://zupimages.net/up/19/32/rt87.png"/><h1>Scarabée Sacré</h1><div class="linkaido_infos"><span>39 lunes</span><span>Mâle</span><span>Clan de la Rivière</span><span>Guerrier</span></div><div class="linkaido_cadrebase"><h2>Physique</h2><p>ICI LE PHYSIQUE DE SCAR</p></div><div class="linkaido_cadrebase"><h2>Caractère</h2><p>ICI LE CARA DE SCAR</p></div><div class="linkaido_cadrebase linkaido_cadresearch"><h2>Je recherche</h2><p>ICI LE TEXTE DES LIENS RECHERCHÉS</p></div><span>~ ~ ~ ~ ~</span><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div><div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
</div>
Le code pour ajouter un lien, c'est le même pour tout le monde (à coller avant le dernier /div (entouré des <>) à la toute fin) :
- Code:
<div class="linkaido_cadrebase linkaido_cadrelien"><h2>NOM DU PERSO</h2><img src="URL_IMAGE_DU_LIEN"/><p>DESCRI DU LIEN ICI</p></div>
Les images représentant chaque lien doivent avoir une taille de 75*130 pixels (si t'as besoin d'aide pour les redimensions tu peux revenir nous voir en pv discord *paf*)
-- Atelier OUVERT --
Jeune recrue
Puf/Surnom : Kyn' Messages : 23Œil de Saphir
Mar 13 Aoû 2019 - 13:28
salut ^^ je vient vous demander un petit codage si vous avez le temps ^^
Commande de codage
< >
Fiche
• Objet de la commande : Une fiche d'évolution d'un perso c'est possible ? ![Atelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction] 293941153](/users/3211/16/22/04/smiles/293941153.gif)
please
• Schéma ou maquette (facultatif) : nope
• Image(s), si vous en désirez : eu...je sais pas trop ^^
celle la http://pre02.deviantart.net/fd56/th/pre/i/2011/089/6/a/sapphire_blue_by_gucken-d2k6pqz.jpg
ou peut être elle: https://i.servimg.com/u/f59/20/10/21/23/nature10.jpg
pour que ça reste dans les ton bleuté ^^
• Couleurs, tons : froid, bleuté, qui rappelle la couleur du saphir ^^
• Éléments à insérer : comme c'est une fiche d'évolution...il faudrait les différentes section Chaton, apprenti et guerrière...je vois pas d'autre chose ^^
• Effets : quelque chose de tous simple m'ira très bien ^^ un peu droit par contre, pas trop d'arrondit ^^
• Autre chose ? merci ^^ prenez votre temps surtout ^^
Jeune recrue
Puf/Surnom : Sun Messages : 44Nuage de Soleil
Mar 13 Aoû 2019 - 13:34
PARFAIT on prend ![Atelier de Sun & Kayl [codage, création de maquettes, dessin, rédaction] 3923495550](/users/3211/16/22/04/smiles/3923495550.png)
T'auras ça rapidement
T'auras ça rapidement
-- ATELIER OUVEEEERT --
Jeune recrue
Puf/Surnom : Kyn' Messages : 23Œil de Saphir
Mar 13 Aoû 2019 - 13:37
oh merci beaucoup ^^
c'était rapide ça XD
c'était rapide ça XD
Contenu sponsorisé
Page 1 sur 4 • 1, 2, 3, 4
|
|
|