+/* coding: utf-8 */
\r
@import url(pageMinichat.css);
@import url(pageAdmin.css);\r
@import url(pageProfileRegister.css);
@import url(pageAbout.css);
\r
-\r
* {\r
padding: 0px;\r
margin: 0px;\r
font-family: sans-serif;\r
font-size: 12px;
color: #EEEEEE;\r
- /*text-align: center;*/ /* uniquement pour IE */\r
background-color: #DFDFDF;\r
background-image: url(../../img/css2/fond.png)\r
}\r
margin-top: 40px;\r
}
+/***** Menu *****/
ul#menu {
- /*
- left: 300px;
- top: 2px;*/
padding-left: 300px;
- /*position: absolute;*/
height: 23px;
font-size: 11px;
background-color: #000000;
background-color: #818c27
}
+/***** Le menu pour le choix de la CSS *****/
#menuCss {
position: absolute;
z-index: 10;
font-size: 9px;
}
+/***** Le style du contenu des pages *****/
#page {
position: relative;
font-size: 12px;
background-color: #000000;
padding: 10px 10px 15px 10px;
}
-
#page > h1 {
margin-top: 10px;
margin-left: 0px;
font-size: 18px;
color : #a6b80e
}
-
#page > h2 {
margin-top: 10px;
margin-left: 10px;
font-size: 16px;
color : #899714;
}
-
#page > h3 {
margin-top: 10px;
margin-left: 20px;
color : #79841a;
background-color : #1e2201
}
-
#page > h4 {
margin-top: 10px;
margin-left: 25px;
font-size: 12px;
color : #646d1d
}
-
#page > p {
margin-top: 3px;
margin-left: 35px;
color : #e9e9e9
}
-
#page > ul {
margin-top: 3px;
margin-left: 45px;
color: #e9e9e9
}
-
#logo {
z-index: 10;
background-image: url(../../img/css2/logo_2.png);
left: 4px;
}\r
+/***** Le pied de page *****/
#footer {
text-align: right;
+ font-size: 9px
+}
+#footer a img{
+ border-style: none;
+ vertical-align: middle;
+ margin-right: 5px;
+}
+#footer span{
+ margin-right: 10px;
}\r
-#footer a img{\r
- border-style: none;\r
-}\r
-\r
+
+/***** La boite d'information (s'apparente à une MessageBox) *****/\r
div#info {
text-align: center;\r
width:100%;\r
border-bottom: 1px solid #aeaeae;\r
z-index: 20;\r
}
-
div#info div.fermer {
float:right;
cursor: pointer;
width: 16px;
background-image: url(../../img/fermer.gif)
}
-
div#info #icone {
float:left;
height:16px;
div#info #icone.exclamation {
background-image: url(../../img/exclamation.gif)
}
-
div#info .boutons {
padding: 1px;
}
-
div#info .boutons div {
cursor: pointer;
background-color: #770000;
padding: 3px 6px;
}
-\r
+/***** Le faux captcha *****/\r
.captcha {\r
display:none\r
}
+/***** Les formulaires *****/
form input,
form button,
form select {
border: #2d8800 1px solid;
color: #EEEEEE;
}
-
form input,
form select {
font-size: 12px;
}
-
form button {
font-size: 11px;
}
-\r
-a {\r
- text-decoration: none;\r
-}\r
-a:link {\r
+
+/***** Les liens *****/\r
+.lien, a {\r
+ text-decoration: none;
color: #7664ff;\r
+}
+.lien {
+ cursor: pointer;
}\r
-a:visited {\r
- color: #7664ff;\r
-}\r
-a:hover {\r
- color: #ffad0f;\r
+a:link, a:visited {\r
+ color: #7664ff;\r
}\r
-a:active {\r
+.lien:hover, .lien:active, a:hover, a:active {\r
color: #ffad0f;\r
}\r
\r
+/* coding: utf-8 */
+
#page.minichat {
padding-top: 5px;
padding-right: 0px;
vertical-align: middle;
}
+/***** La boite de sélection des smiles *****/
#smiles {
text-align: center;
border: 1px solid;
opacity: 0.5;
}
+/***** La boite permettant de slaper/kicker/bannir une personne *****/
#outilsBan {
border-width: 1px 1px 1px 1px;
border-color: #253f18;
margin-left: 1px
}
+/***** Le troll courant affiché en haut de la page *****/
#page.minichat #trollCourant {
border-top: 1px solid;
border-bottom: 1px solid;
margin-bottom: 8px;
padding : 1px 0px 1px 10px
}
-
#page.minichat #trollCourant .troll {
font-style: italic;
color: #FFFF88;
cursor: pointer;
}
-#page.minichat .titreSmiles:hover {
- background-color: #2d8800;
-}
-
+/***** Le formulaire pour poster un message *****/
#page.minichat form {
margin-bottom: 15px;
padding-left: 10px;
}
-
#page.minichat form p {
margin: 0px;
padding: 0px;
}
-
#page.minichat form .pseudo {
margin-right: 5px;
width: 12%
margin-right: 5px;
}
+/***** Les conversations *****/
/* voir pour l'astuce css "float left" des conversations : http://www.quirksmode.org/css/clearing.html */
#page.minichat #conversations {
overflow: hidden;
width: 100%
}
-
#page.minichat #conversations .conversation {
border-width: 0px;
border-style: solid;
float: left;
width: 100%;
}
-
#page.minichat #conversations div.message {
border-left-width: 5px;
border-left-style: solid;
padding-left: 4px;
cursor: pointer;
}
-
#page.minichat #conversations div.messageImpair {
background-color: #05002c;
}
-
#page.minichat #conversations div.messagePair {
background-color: #080047;
}
-
#page.minichat #conversations div.cache {
opacity: 0.3;
filter: alpha(opacity = 30);
zoom: 1
}
-
#page.minichat #conversations div.reponse {
border-color: #bd7a11
}
#page.minichat #conversations div.systeme {
background-color: #555555
}
+#page.minichat #conversations .titre {
+ text-align: center;
+ padding-right: 8px;
+ background-color: #4b4215
+}
+#page.minichat #conversations .titre .fermer {
+ float: right;
+ padding-right: 5px;
+ padding-left: 5px;
+ background-color: #7d1b1b;
+ cursor: pointer;
+}
+#page.minichat #conversations .titre .fermer:after {
+ content: "x"
+}
+#page.minichat #conversations .titre .fermer:hover {
+ background-color: #c95656
+}
+
+#page.minichat #conversations .titre .next,
+#page.minichat #conversations .titre .prev {
+ display: none;
+}
+
+#page.minichat #conversations .titre .lien {
+ float: right
+}
+#page.minichat #conversations .titre .lien:after {
+ content: "c"
+}
+#page.minichat #conversations .titre .lien,
+#page.minichat #conversations .titre .next,
+#page.minichat #conversations .titre .prev,
+#page.minichat #conversations .titre .numPage {
+ background-color: #42380b;
+ cursor: pointer;
+ padding-right: 5px;
+ padding-left: 5px;
+}
+#page.minichat #conversations .titre .lien:hover,
+#page.minichat #conversations .titre .next:hover,
+#page.minichat #conversations .titre .prev:hover,
+#page.minichat #conversations .titre .numPage:hover {
+ background-color: #7c6e2e
+}
+
+/***** Les messages *****/
#page.minichat div.message a {
font-weight: bold;
}
-
#page.minichat div.message .lienConv {
color: #db960f;
font-weight: bold;
cursor: pointer
}
-
#page.minichat div.message .lienConv:hover {
color: #f1c060
}
-
#page.minichat .date {
color: #fd913b;
margin-right: 3px;
margin-left: 3px;
}
-
-
#page.minichat div.message .pseudo:after {
content: ":"
}
-
#page.minichat div.message .pseudo,
#page.minichat form .pseudo {
margin-left: 4px;
font-weight: bold;
color: #76ff33;
}
-
#page.minichat div.message.ekMaster .pseudo {
color: #ffffff;
}
-
#page.minichat div.message .pseudo .login {
margin-left: 2px;
font-size: 8px;
color: #a7d88f;
}
-
#page.minichat div.systeme .pseudo {
color: #CCCCCC
}
-
-/* Ca marche pas :(
-#page.minichat div.message .pseudo {
- min-width: 50px;
- height:100px;
-}*/
-
#page.minichat #conversations .repondA {
color: #bd7a11;
margin-right: 3px;
}
-
#page.minichat #conversations .repondA:after {
content: ">"
}
-
-/*#page.minichat #conversations .contenu {
- display: inline;
-}*/
-
#page.minichat #conversations .extraire {
float: right;
padding-right: 2px;
padding-left: 2px;
background-color: #4f5519;
}
-
#page.minichat #conversations .extraire:after {
content: ">"
}
-
#page.minichat #conversations .extraire:hover {
background-color: #818c27
}
-#page.minichat #conversations .titre {
- text-align: center;
- padding-right: 8px;
- background-color: #4b4215
-}
-
-#page.minichat #conversations .titre .fermer {
- float: right;
- padding-right: 5px;
- padding-left: 5px;
- background-color: #7d1b1b;
- cursor: pointer;
-}
-#page.minichat #conversations .titre .fermer:after {
- content: "x"
-}
-#page.minichat #conversations .titre .fermer:hover {
- background-color: #c95656
-}
-
-#page.minichat #conversations .titre .next,
-#page.minichat #conversations .titre .prev {
- display: none;
-}
-
-#page.minichat #conversations .titre .lien {
- float: right
-}
-#page.minichat #conversations .titre .lien:after {
- content: "c"
-}
-
-#page.minichat #conversations .titre .lien,
-#page.minichat #conversations .titre .next,
-#page.minichat #conversations .titre .prev,
-#page.minichat #conversations .titre .numPage {
- background-color: #42380b;
- cursor: pointer;
- padding-right: 5px;
- padding-left: 5px;
-}
-
-#page.minichat #conversations .titre .lien:hover,
-#page.minichat #conversations .titre .next:hover,
-#page.minichat #conversations .titre .prev:hover,
-#page.minichat #conversations .titre .numPage:hover {
- background-color: #7c6e2e
-}
-
\r
=== v1.0 ===\r
* Rendre compatible IE 7 (pfff..)\r
-* Ajouter dans la FAQ et/ou dans la page d'enregistrement les conditions d'utilisation, genre "chacun est responsable de ses dires" https://linuxfr.org/bouchot/\r
* Corriger les bugs de niveau [1] et [2]\r
* Cleaner le code (erl, js, xhtml, css) et eventuellement profiler un peu (le refresh est lent sous opera)\r
=== v1.1 ===\r
1) copie des fichiers (+minimisation)
2) Execution d'un scripte erlang pour recharger tous les modules au sein du noeud
3) Executer euphorik_bd:update() pour mettre à jour la BD
+[ok] Ajouter dans la FAQ et/ou dans la page d'enregistrement les conditions d'utilisation, genre "chacun est responsable de ses dires" https://linuxfr.org/bouchot/
=== Bugs ===
1 : Critique
* solution 2 : mémoriser le skin courant dans un cookie\r
[2] Après l'ajout d'une image il n'est pas possible de naviger depuis celle ci vers les autres images en utilisant Next et Prev de lightbox après l'avoir affiché\r
[2] cliquer sur les smiles ne marche pas sous IE
-[2] Lors d'un logout il faut faire un full refresh (pour mettre à jour les messages auquel on répond par exemple)
[2] griser le login dans le profil pour montrer qu'on ne peut pas l'éditer
[3] Quand on revient en arrière dans firefox le message en rédaction est perdu
* Pas sous Opera, apparemment Firefox recharge toute la page (donc impossible qu'il puisse remettre le message)
* Jamais reproduit avec Opera
* Peut être un bug lié à jQuery
* Reproduit sur Firefox 2 et 3 !
+[ok] Lors d'un logout il faut faire un full refresh (pour mettre à jour les messages auquel on répond par exemple)
=== Idées ===\r
Une fois l'idée validée elle est déplacée dans une version à venir.\r