Coin arrondi dans le calendrier (calendar + Widget)
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Coin arrondi dans le calendrier (calendar + Widget)
Détails techniques
Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Plusieurs utilisateurs
Lien du forum : http://toadius-dmh.forumactif.be/calendar
Description du problème
Bonjour,Je souhaiterai faire des coins arrondis pour chaque jour avec une couleur différente que le fond du forum. Avez-vous un code CSS, je voudrais que ça ressemble à un truc dans ce style, c'est un exemple, imaginez les dates dessus ^^
Ma deuxième question, comment puis-je mettre le calendrier Widget comme le format de widget de mon portail ?
Merci.
Bonne journée.
Dernière édition par Archimus le Ven 20 Nov 2015 - 14:10, édité 1 fois
Re: Coin arrondi dans le calendrier (calendar + Widget)
Je me permets de UP
Re: Coin arrondi dans la calendier (calendar + widget)
Bonjour,
collez ce code dans la Feuille de style :
Bonne journée !
collez ce code dans la Feuille de style :
- Code:
#calendar .center {
-moz-border-radius: 40px;
-webkit-border-radius: 40px;
border-radius: 40px;}
Bonne journée !
Feuilla'- Membre habitué
- Messages : 1389
Inscrit(e) le : 26/07/2015
Re: Coin arrondi dans le calendrier (calendar + Widget)
Bonjour,
Votre code ne fonctionne pas. Je parle bien du calendrier : http://toadius-dmh.forumactif.be/calendar
Bonne journée.
Votre code ne fonctionne pas. Je parle bien du calendrier : http://toadius-dmh.forumactif.be/calendar
Bonne journée.
Re: Coin arrondi dans la calendier (calendar + widget)
Re,
en remplaçant la première partie du code, comme ceci :
Bonne soirée !
en remplaçant la première partie du code, comme ceci :
- Code:
.genmed {
-moz-border-radius: 40px;
-webkit-border-radius: 40px;
border-radius: 40px;}
Bonne soirée !
Feuilla'- Membre habitué
- Messages : 1389
Inscrit(e) le : 26/07/2015
Re: Coin arrondi dans le calendrier (calendar + Widget)
Bonjour,
J'ai modifié le .genmed par .genme, avez-vous d'autres codes que je peux appliquer sur le css pour structurer le tableau ?
J'ai modifié le .genmed par .genme, avez-vous d'autres codes que je peux appliquer sur le css pour structurer le tableau ?
Re: Coin arrondi dans la calendier (calendar + widget)
Re-Bonjour,
Bonne journée !
il y a ce code pour les jours de la semaine :Archimus a écrit:avez-vous d'autres codes que je peux appliquer sur le css pour structurer le tableau ?
- Code:
th {
-moz-border-radius: 40px;
-webkit-border-radius: 40px;
border-radius: 40px;}
Bonne journée !
Feuilla'- Membre habitué
- Messages : 1389
Inscrit(e) le : 26/07/2015
Re: Coin arrondi dans le calendrier (calendar + Widget)
Bonjour,
Comment faire pour rétrécir les colonnes du tableau ?
Bonne journée.
Comment faire pour rétrécir les colonnes du tableau ?
Bonne journée.
Re: Coin arrondi dans la calendier (calendar + widget)
Re,
ceci sans garantie
Le "10" à changer si besoin par un autre nombre/chiffre.
Bonne soirée !
ceci sans garantie
- Code:
th {width:10px;}
Le "10" à changer si besoin par un autre nombre/chiffre.
Bonne soirée !
Feuilla'- Membre habitué
- Messages : 1389
Inscrit(e) le : 26/07/2015
Re: Coin arrondi dans le calendrier (calendar + Widget)
bonjour a vous , le calendar en phpbb2 a les mêmes identifiant que l'ensemble du forum , le mieux serait de modifier la class .forumline en id="calendar_forum" class="forumline" dans le Template
ensuite vous pouvez transformé a votre guise , le décors en agissent sur l'id calendar_forum.
ex>>
ensuite vous pouvez transformé a votre guise , le décors en agissent sur l'id calendar_forum.
ex>>
- Code:
<table id="calendar_forum" class="forumline" bla bla bla >
Invité- Invité
Re: Coin arrondi dans le calendrier (calendar + Widget)
Bonjour,
J'appliquerai vos conseils cet après-midi. J'ai essayé, mais le résultat est une catastrophe. Si vous pouviez m'aider à paramétrer correctement mon HTML, je vous en serai reconnaissant.
Je me suis perdu en route entre toutes ces annotations. Qu'est-ce que je dois réellement modifié pour avoir un résultat comme décrit au-dessus.
Bonne journée.
- Code:
<!-- BEGIN _calendar_box -->
<table align="center" cellpadding="0" cellspacing="1" border="0" width="100%" class="forumline">
<tr>
<td align="center" class="catHead" colspan="{_calendar_box.SPAN_ALL}" width="100%">
<form name="_calendar" method="post" action="{_calendar_box.S_ACTION}">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td> </td>
<td class="gensmall">
<!-- BEGIN switch_not_anonymous -->
<b><a href="{_calendar_box.U_PREC}" class="gen" rel="nofollow">«</a></b>
<!-- END switch_not_anonymous -->
</td>
<td width="100%" align="center">{_calendar_box.S_MONTH}{_calendar_box.S_YEAR} {_calendar_box.S_FORUM_LIST} <input type="submit" value="{_calendar_box.L_GO}" class="liteoption" /></td>
<td class="gensmall">
<!-- BEGIN switch_not_anonymous -->
<b><a href="{_calendar_box.U_NEXT}" class="gen" rel="nofollow">»</a></b>
<!-- END switch_not_anonymous -->
</td>
<td> </td>
</tr>
</table>
</form>
</td>
</tr>
<tr>
<!-- BEGIN _cell -->
<th width="{_calendar_box.switch_full_month._cell.WIDTH}%" nowrap="nowrap">{_calendar_box._cell.L_DAY}</th>
<!-- END _cell -->
</tr>
<!-- BEGIN _row -->
<tr>
<!-- BEGIN _cell -->
<!-- BEGIN switch_filled_no -->
<td class="row3" colspan="{_calendar_box._row._cell.SPAN}" width="{_calendar_box._row._cell.WIDTH}%"> </td>
<!-- END switch_filled_no -->
<!-- BEGIN switch_filled -->
<td class="row1" valign="top" colspan="{_calendar_box._row._cell.SPAN}" width="{_calendar_box._row._cell.WIDTH}%">
<table cellspacing="0" cellpadding="0" width="100%" height="94" valign="top">
<tr>
<td class="row2" align="center" height="4" nowrap="nowrap">
<span class="genmed">{_calendar_box._row._cell.U_DATE}</span>
<!-- BEGIN switch_add_event_day -->
<a href="{_calendar_box._row._cell.switch_filled.switch_add_event_day.U_CREATE_EVENT}"><img src="http://2img.net/i/fa/subsilver/icon_mini_calendar.gif" border="0" alt="{L_ADD_EVENT}" title="{L_ADD_EVENT}" /></a>
<!-- END switch_add_event_day -->
</td>
</tr>
<tr valign="top">
<td class="row1" nowrap="nowrap">
<table cellspacing="0" cellpadding="0" width="100%" valign="top">
<!-- BEGIN _event -->
<!-- BEGIN switch_event -->
<tr>
<td class="row1" nowrap="nowrap" align="left"><span class="genmed">{_calendar_box._row._cell.switch_filled._event.switch_event.EVENT_TYPE}<a rel="nofollow" href="{_calendar_box._row._cell.switch_filled._event.switch_event.U_EVENT}" {_calendar_box._row._cell.switch_filled._event.switch_event.OVERVIEW_MESSAGE} class="{_calendar_box._row._cell.switch_filled._event.switch_event.EVENT_CLASS}" style="font-style:normal;font-weight:normal;">{_calendar_box._row._cell.switch_filled._event.switch_event.EVENT_TITLE}</a></span></td>
<!-- BEGIN _more -->
<td class="row1" align="right"><span class="genmed"><a href="#" onClick="hdr_toggle('calendar_display_extend_{_calendar_box._row._cell.switch_filled.EVENT_DATE}','calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}', '{DOWN_ARROW}', '{UP_ARROW}'); return false;" class="gensmall">...<img src="{_calendar_box._row._cell.switch_filled.TOGGLE_ICON}" id="calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}" hspace="2" border="0" /></a></span></td>
<!-- END _more -->
<!-- BEGIN _more_no -->
<td></td>
<!-- END _more_no -->
</tr>
<!-- END switch_event -->
<!-- BEGIN switch_event_no -->
<tr>
<td class="row1"><span class="genmed"> </span></td>
<!-- BEGIN _more -->
<td class="row1" align="right"><span class="genmed"><a href="#" onClick="hdr_toggle('calendar_display_extend_{_calendar_box._row._cell.switch_filled.EVENT_DATE}','calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}', '{DOWN_ARROW}', '{UP_ARROW}'); return false;" class="gensmall">...<img src="{_calendar_box._row._cell.switch_filled.TOGGLE_ICON}" id="calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}" hspace="2" border="0" /></a></span></td>
<!-- END _more -->
<!-- BEGIN _more_no -->
<td></td>
<!-- END _more_no -->
</tr>
<!-- END switch_event_no -->
<!-- BEGIN _more_header -->
<tbody id="calendar_display_extend_{_calendar_box._row._cell.switch_filled.EVENT_DATE}" style="display:{_calendar_box._row._cell.switch_filled.TOGGLE_STATUS}">
<!-- END _more_header -->
<!-- BEGIN _more_footer -->
</tbody>
<!-- END _more_footer -->
<!-- END _event -->
</table>
</td>
</tr>
</table>
</td>
<!-- END switch_filled -->
<!-- END _cell -->
</tr>
<!-- END _row -->
<tr>
<td class="catbottom" align="center" colspan="{_calendar_box.SPAN_ALL}" width="100%">
<!-- BEGIN switch_add_event -->
<form action="{S_CREATE_EVENT}" method="post"><input type="submit" value="{L_ADD_EVENT}" /></form>
<!-- END switch_add_event -->
</td>
</tr>
</table>
<!-- END _calendar_box -->
Je me suis perdu en route entre toutes ces annotations. Qu'est-ce que je dois réellement modifié pour avoir un résultat comme décrit au-dessus.
Bonne journée.
Re: Coin arrondi dans le calendrier (calendar + Widget)
bonsoir ,remplacé le contenu de votre Template calendar_boxpar celui ci >
insérer ensuite dans votre css ceci >
il vous restera a changé les couleurs , les valeurs ,ect a votre convenance
- Code:
<!-- BEGIN _calendar_box -->
<!--fond couleur-->
<table align="center" cellpadding="0" cellspacing="1" border="0" width="100%" id="calendar_forum" class="forumline">
<tr>
<td align="center" class="catHead" colspan="{_calendar_box.SPAN_ALL}" width="100%">
<form name="_calendar" method="post" action="{_calendar_box.S_ACTION}">
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td> </td>
<td class="gensmall">
<!-- BEGIN switch_not_anonymous -->
<b><a href="{_calendar_box.U_PREC}" class="gen" rel="nofollow">«</a></b>
<!-- END switch_not_anonymous -->
</td>
<td width="100%" align="center">{_calendar_box.S_MONTH}{_calendar_box.S_YEAR} {_calendar_box.S_FORUM_LIST} <input type="submit" value="{_calendar_box.L_GO}" class="liteoption" /></td>
<td class="gensmall">
<!-- BEGIN switch_not_anonymous -->
<b><a href="{_calendar_box.U_NEXT}" class="gen" rel="nofollow">»</a></b>
<!-- END switch_not_anonymous -->
</td>
<td> </td>
</tr>
</table>
</form>
</td>
</tr>
<tr>
<!-- BEGIN _cell -->
<th class="th_1" width="{_calendar_box.switch_full_month._cell.WIDTH}%" nowrap="nowrap">{_calendar_box._cell.L_DAY}</th_1>
<!-- END _cell -->
</tr>
<!-- BEGIN _row -->
<tr>
<!-- BEGIN _cell -->
<!-- BEGIN switch_filled_no -->
<td class="row3_3" colspan="{_calendar_box._row._cell.SPAN}" width="{_calendar_box._row._cell.WIDTH}%"> </td>
<!-- END switch_filled_no -->
<!-- BEGIN switch_filled -->
<td class="row1_1" valign="top" colspan="{_calendar_box._row._cell.SPAN}" width="{_calendar_box._row._cell.WIDTH}%">
<table cellspacing="0" cellpadding="0" width="100%" height="94" valign="top">
<tr>
<td class="row2_2" align="center" height="4" nowrap="nowrap">
<span class="genmed">{_calendar_box._row._cell.U_DATE}</span>
<!-- BEGIN switch_add_event_day -->
<a href="{_calendar_box._row._cell.switch_filled.switch_add_event_day.U_CREATE_EVENT}"><img src="http://2img.net/i/fa/subsilver/icon_mini_calendar.gif" border="0" alt="{L_ADD_EVENT}" title="{L_ADD_EVENT}" /></a>
<!-- END switch_add_event_day -->
</td>
</tr>
<tr valign="top">
<td class="row1_1" nowrap="nowrap">
<table cellspacing="0" cellpadding="0" width="100%" valign="top">
<!-- BEGIN _event -->
<!-- BEGIN switch_event -->
<tr>
<td class="row1_1" nowrap="nowrap" align="left"><span class="genmed">{_calendar_box._row._cell.switch_filled._event.switch_event.EVENT_TYPE}<a rel="nofollow" href="{_calendar_box._row._cell.switch_filled._event.switch_event.U_EVENT}" {_calendar_box._row._cell.switch_filled._event.switch_event.OVERVIEW_MESSAGE} class="{_calendar_box._row._cell.switch_filled._event.switch_event.EVENT_CLASS}" style="font-style:normal;font-weight:normal;">{_calendar_box._row._cell.switch_filled._event.switch_event.EVENT_TITLE}</a></span></td>
<!-- BEGIN _more -->
<td class="row1_1" align="right"><span class="genmed"><a href="#" onClick="hdr_toggle('calendar_display_extend_{_calendar_box._row._cell.switch_filled.EVENT_DATE}','calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}', '{DOWN_ARROW}', '{UP_ARROW}'); return false;" class="gensmall">...<img src="{_calendar_box._row._cell.switch_filled.TOGGLE_ICON}" id="calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}" hspace="2" border="0" /></a></span></td>
<!-- END _more -->
<!-- BEGIN _more_no -->
<td></td>
<!-- END _more_no -->
</tr>
<!-- END switch_event -->
<!-- BEGIN switch_event_no -->
<tr>
<td class="row1_1"><span class="genmed"> </span></td>
<!-- BEGIN _more -->
<td class="row1_1" align="right"><span class="genmed"><a href="#" onClick="hdr_toggle('calendar_display_extend_{_calendar_box._row._cell.switch_filled.EVENT_DATE}','calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}', '{DOWN_ARROW}', '{UP_ARROW}'); return false;" class="gensmall">...<img src="{_calendar_box._row._cell.switch_filled.TOGGLE_ICON}" id="calendar_open_close_{_calendar_box._row._cell.switch_filled.EVENT_DATE}" hspace="2" border="0" /></a></span></td>
<!-- END _more -->
<!-- BEGIN _more_no -->
<td></td>
<!-- END _more_no -->
</tr>
<!-- END switch_event_no -->
<!-- BEGIN _more_header -->
<tbody id="calendar_display_extend_{_calendar_box._row._cell.switch_filled.EVENT_DATE}" style="display:{_calendar_box._row._cell.switch_filled.TOGGLE_STATUS}">
<!-- END _more_header -->
<!-- BEGIN _more_footer -->
</tbody>
<!-- END _more_footer -->
<!-- END _event -->
</table>
</td>
</tr>
</table>
</td>
<!-- END switch_filled -->
<!-- END _cell -->
</tr>
<!-- END _row -->
<tr>
<td class="catbottom" align="center" colspan="{_calendar_box.SPAN_ALL}" width="100%">
<!-- BEGIN switch_add_event -->
<form action="{S_CREATE_EVENT}" method="post"><input type="submit" value="{L_ADD_EVENT}" /></form>
<!-- END switch_add_event -->
</td>
</tr>
</table>
<!-- END _calendar_box -->
insérer ensuite dans votre css ceci >
- Code:
#calendar_forum{/**agi sur la couleur de fond **/
background:blue;
border-radius:25px;
border:1px solid white;
}
td.row2_2{/**agi sur la date **/
background-color: blue;
border-radius: 5px 5px 5px 5px;
border:1px solid white;
}
td.row1_1, td.row3_3 {/**agi sur les cases **/
background-color: #495cff;
border-radius: 10px 10px 10px 10px;
}
th.th_1{/**agi sur les jours de la semaine**/
background:#495cff;
background-image: url(http://2img.net/i/fa/empty.gif);
color: #fff;
font-size: 13px;
font-weight: 700;
height: 25px;
padding: 2px 3px;
border-radius:5px;
border:1px solid white;
width:0%;
}
il vous restera a changé les couleurs , les valeurs ,ect a votre convenance
Invité- Invité
Re: Coin arrondi dans le calendrier (calendar + Widget)
Bonjour,
Un grand merci pour ce code personnalisé Il fonctionne totalement de A et Z et j'ai ajouté ma touche personnel et personnalisé certains paramètres sur le CSS
Voici un petit rendu pour celui qui le souhaiterait : lien
Ce sujet est résolu Merci de ta patience R-max.
Bonne journée.
Un grand merci pour ce code personnalisé Il fonctionne totalement de A et Z et j'ai ajouté ma touche personnel et personnalisé certains paramètres sur le CSS
Voici un petit rendu pour celui qui le souhaiterait : lien
Ce sujet est résolu Merci de ta patience R-max.
Bonne journée.
Sujets similaires
» Mettre une image dans le calendrier sur le widget
» Case non colorée dans le widget du calendrier.
» Case non colorée dans le widget du calendrier.
» Couleur d'un évènement dans le calendrier widget
» coin arrondi
» Case non colorée dans le widget du calendrier.
» Case non colorée dans le widget du calendrier.
» Couleur d'un évènement dans le calendrier widget
» coin arrondi
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum