| /** BBcode **/ | /* | ||
| * Surchargez ce fichier dans votre thème pour personnaliser le module | |||
| * https://www.phpboost.com/wiki/structure-d-un-theme#paragraph-le-repertoire-modules | |||
| */ | |||
| .bbcode { | .bbcode { | ||
| position: relative; | position: relative; | ||
| display: table; | display: table; | ||
| margin: 5px auto -5px auto; | margin: 0.309em auto -0.309em auto; | ||
| width: 99%; | width: 99%; | ||
| background-color: #EEEEEE; | border-width: 1px 1px 0; | ||
| border: 1px solid #BBBBBB; | border-style: solid; | ||
| } | } | ||
| .bbcode-containers { | .bbcode-containers { | ||
| display: table-cell; | display: table-cell; | ||
| font-size: 0; | font-size: 0; | ||
| } | } | ||
| .bbcode-container { | .bbcode-container { | ||
| display: inline-block; | display: inline-block; | ||
| margin: 2px 0 2px 0; | margin: 0; | ||
| padding: 0; | padding: 0.1618em; | ||
| border-right: 1px solid #CECECE; | border-width: 1px; | ||
| } | border-style: solid; | ||
| border-color: transparent; | |||
| @media (min-width: 769px) { | |||
| .bbcode-container { | |||
| position: relative; | |||
| } | |||
| } | } | ||
| .bbcode-container:after { | .bbcode-container:after { | ||
| position: absolute; | position: absolute; | ||
| top: 0; | |||
| right: -2px; | right: -2px; | ||
| height: 24px; | height: 100%; | ||
| width: 1px; | width: 1px; | ||
| content: ""; | content: ""; | ||
| background: #FFFFFF; | } | ||
| @media (min-width: 769px) { | |||
| .bbcode-container { position: relative; } | |||
| } | } | ||
| .bbcode-elements { | .bbcode-elements { | ||
| display: inline-block; | display: inline-block; | ||
| height: 24px; | font-size: 1.456rem; | ||
| } | } | ||
| @media (min-width: 769px) { | @media (min-width: 769px) { | ||
| .bbcode-elements { | .bbcode-elements { | ||
| position: relative; | position: relative; | ||
| } | } | ||
| } | } | ||
| /* Icones de la barre BBCode */ | |||
| .bbcode-elements > a { | .bbcode-elements > a { | ||
| display: inline-block; | display: inline-block; | ||
| height: 22px; | font-size: 1.456rem; | ||
| border: 1px solid transparent; | padding: 0.309em; | ||
| } | text-align: center; | ||
| vertical-align: 0; | |||
| .bbcode .bbcode-elements > a { | |||
| margin: 1px 2px; | |||
| padding: 2px 2px 0 2px; | |||
| width: 23px; | |||
| } | } | ||
| .bbcode-elements > a:hover { | .bbcode-elements > a:hover { | ||
| color: #222222; | |||
| text-decoration: none; | text-decoration: none; | ||
| } | } | ||
| .bbcode .bbcode-elements > a:hover { | |||
| background-image: linear-gradient(#F8F8F8, #F1F1F1); | |||
| border: 1px solid #C6C6C6; | |||
| box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1); | |||
| border-radius: 3px; | |||
| } | |||
| .bbcode-elements a, | |||
| .bbcode-block-container { | |||
| font-size: 1.3rem; | |||
| } | |||
| .bbcode-elements-more { | .bbcode-elements-more { | ||
| display: table-cell; | display: table-cell; | ||
| margin: auto; | margin: auto; | ||
| width: 20px; | width: 1.309em; | ||
| vertical-align: middle; | vertical-align: middle; | ||
| font-size: 1rem; | font-size: 1rem; | ||
| text-align: center; | text-align: center; | ||
| } | } | ||
| .bbcode .bbcode-elements-more a { | .bbcode-backspace {display: none;} | ||
| padding: 0; | |||
| width: 20px; | |||
| } | |||
| .bbcode-elements-more a { | |||
| margin: 3px 0; | |||
| padding: 0; | |||
| width: 18px; | |||
| height: 18px; | |||
| } | |||
| .bbcode-elements-more .fa { color: #AAAAAA; } | |||
| .bbcode-elements-more:hover .fa { color: #111111; } | |||
| .bbcode-hover, | |||
| .bbcode-elements a, | |||
| .bbcode-elements i { | |||
| cursor: pointer; | |||
| } | |||
| @media (max-width: 768px) { | @media (min-width: 769px) { | ||
| .bbcode-backspace { | .bbcode-backspace { | ||
| display: none; | display: block; | ||
| } | } | ||
| } | } | ||
| .bbcode-block-container { | .bbcode-block-container { | ||
| position: absolute; | position: absolute; | ||
| top: 26px; | top: 120%; | ||
| left: -4px; | left: 0; | ||
| bottom: 0; | bottom: 0; | ||
| margin: 0; | margin: 0; | ||
| padding: 0; | padding: 0; | ||
| z-index: 20; | z-index: 20; | ||
| text-align: center; | text-align: center; | ||
| } | } | ||
| .bbcode-block { | .bbcode-block { | ||
| margin: 0; | margin: 0; | ||
| background-color: #F3F3F3; | } | ||
| border: 1px solid #AAAAAA; | |||
| box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); | .bbcode-block .form-element{ | ||
| width: 100%; | |||
| -webkit-flex-direction: row; | |||
| -ms-flex-direction: row; | |||
| flex-direction: row; | |||
| -webkit-justify-content: space-between; | |||
| -ms-flex-pack: justify; | |||
| justify-content: space-between; | |||
| -webkit-align-content: space-between; | |||
| -ms-flex-line-pack: justify; | |||
| align-content: space-between; | |||
| } | } | ||
| .bbcode-block a { | .bbcode-block a { | ||
| cursor: pointer; | |||
| text-decoration: none; | text-decoration: none; | ||
| } | } | ||
| @media (max-width: 768px) { | @media (max-width: 768px) { | ||
| .bbcode-block-container { | .bbcode-block-container { | ||
| top: 0; | top: 0; | ||
| left: 0; | left: 0; | ||
| bottom: 0; | bottom: 0; | ||
| right: 0; | right: 0; | ||
| } | } | ||
| } | } | ||
| @media (min-width: 769px) { | @media (min-width: 769px) { | ||
| .bbcode-block-container:before, | |||
| .bbcode-block-container:after { | .bbcode-block-container:after { | ||
| position: absolute; | position: absolute; | ||
| content: " "; | content: " "; | ||
| border-style: solid; | border-style: solid; | ||
| border-color: transparent; | |||
| } | |||
| .bbcode-block-container:before { | |||
| top: -8px; | |||
| left: 8px; | |||
| border-width: 0 9px 9px 9px; | |||
| border-bottom-color: #AAAAAA; | |||
| } | } | ||
| .bbcode-block-container:after { | .bbcode-block-container:after { | ||
| left: 9px; | left: 5px; | ||
| top: -7px; | top: -7px; | ||
| border-width: 0 8px 8px 8px; | border-width: 0 8px 8px 8px; | ||
| border-bottom-color: rgba(250, 250, 250, 1); | } | ||
| } | |||
| } | } | ||
| .bbcode-block-smileys, | .bbcode-block-smileys, | ||
| .bbcode-block-fa { | .bbcode-block-fa { | ||
| max-height: 230px; | max-height: 230px; | ||
| padding: 4px 0px 2px 3px; | padding: 0.228em; | ||
| overflow-y: auto; | overflow-y: auto; | ||
| text-align: left; | text-align: center; | ||
| } | } | ||
| .bbcode-block-smileys li, | .bbcode-block-smileys li, | ||
| .bbcode-block-fa li { | .bbcode-block-fa li { | ||
| display: inline-block; | display: inline-block; | ||
| } | } | ||
| .bbcode-block-fa li { | .bbcode-block-fa li { | ||
| padding: 1px 2px; | padding: 0.1618em; | ||
| width: 20px; | width: 1.309em; | ||
| } | } | ||
| .bbcode-block-smileys li a, | .bbcode-block-smileys li a, | ||
| .bbcode-block-fa li a { | .bbcode-block-fa li a { | ||
| display: block; | display: block; | ||
| } | } | ||
| @media (max-width: 768px) { | @media (max-width: 768px) { | ||
| .bbcode-block-smileys li a { | .bbcode-block-smileys li a { | ||
| padding: 10px; | padding: 0.309em 0.618em; | ||
| } | } | ||
| .bbcode-block-smileys { | .bbcode-block-smileys { | ||
| max-height: 300px; | max-height: 300px; | ||
| } | } | ||
| .bbcode-block-fa li { | .bbcode-block-fa li { | ||
| padding: 7px; | padding: 0.456em; | ||
| width: 29px; | width: 29px; | ||
| } | } | ||
| .bbcode-block-fa { | .bbcode-block-fa { | ||
| max-height: 400px; | max-height: 400px; | ||
| } | } | ||
| } | } | ||
| .bbcode-block-container.color-picker table { | .bbcode-block-container.color-picker table { | ||
| width: auto; | width: auto; | ||
| } | } | ||
| @media (max-width: 768px) { | .bbcode-block-container.color-picker td a { | ||
| .bbcode-block-container.color-picker td a { | height: 32px; | ||
| height: 32px; | width: 32px; | ||
| width: 32px; | |||
| } | |||
| } | } | ||
| .bbcode-block-list li { | |||
| .bbcode-block-list { | display: block; | ||
| margin: 0; | |||
| padding: 3px 0; | |||
| overflow: visible; | |||
| } | } | ||
| .bbcode-block-list li, | |||
| .bbcode-block-list li a { | .bbcode-block-list li a { | ||
| display: block; | display: block; | ||
| padding: 2px 0 2px 4px; | padding: 0.228em; | ||
| cursor: pointer; | text-align: center; | ||
| text-align: left; | |||
| } | } | ||
| .bbcode-block-code { | .bbcode-block-code { | ||
| margin: 0; | |||
| padding: 0; | |||
| height: 300px; | height: 300px; | ||
| overflow-y: scroll; | overflow-y: scroll; | ||
| } | } | ||
| .bbcode-block-code > ul { | .bbcode-block-code > ul { | ||
| margin-left: 0; | margin-left: 0; | ||
| } | } | ||
| .bbcode-block-code li { | .bbcode-block-code li { | ||
| padding: 0 0 0 12px; | padding: 0.228em; | ||
| } | |||
| .bbcode-block-list li:hover { | |||
| background-color: rgba(0, 0, 0, 0.05); | |||
| } | } | ||
| .bbcode-block-list li.bbcode-code-title { | .bbcode-block-list li.bbcode-code-title { | ||
| margin: 3px 10px 1px 5px; | padding: 0.309em 0 0; | ||
| padding: 6px 0 1px 2px; | |||
| border-bottom: 1px solid #DFDFDF; | |||
| } | |||
| .bbcode-block-list li.bbcode-code-title:hover { | |||
| background: none; | |||
| cursor: auto; | |||
| } | |||
| .bbcode-block-list li.bbcode-code-title span { | |||
| color: #666666; | |||
| font-weight: bold; | font-weight: bold; | ||
| } | } | ||
| .bbcode-block .form-element { | #bbcode-expanded .form-element { | ||
| margin: 2px 7px; | margin: 0 !important; | ||
| padding: 0.309em 0; | |||
| } | } | ||
| @media (max-width: 768px) { | .bbcode-block .form-element label.smaller { | ||
| .bbcode-block .form-element { | font-size: 0.809em; | ||
| margin: 2px auto; | |||
| width: 150px; | |||
| } | |||
| } | |||
| .bbcode-block .form-element label { | |||
| padding-right: 0; | |||
| width: 70%; | width: 70%; | ||
| vertical-align: middle; | padding: 0; | ||
| color: #555555; | |||
| text-align: left; | |||
| } | } | ||
| .bbcode-block .form-element .form-field { | .bbcode-block .form-element .form-field { | ||
| width: 23%; | width: 23%; | ||
| } | } | ||
| .bbcode-block .form-element input { | .bbcode-block .form-element input { | ||
| padding: 2px 5px; | padding: 0 0.309em; | ||
| } | } | ||
| .bbcode-form-element-text { | .bbcode-form-element-text { | ||
| margin: 10px 5px 5px 5px; | padding: 0.309em; | ||
| padding: 5px 5px 0 5px; | |||
| border-top: 1px solid #BEBEBE; | |||
| text-align: center; | text-align: center; | ||
| } | } | ||
| .bbcode-block-fonts { | .bbcode-block-fonts { | ||
| height: 300px; | height: 300px; | ||
| overflow-y: scroll; | overflow-y: scroll; | ||
| } | } | ||
| @media (min-width: 769px){ | @media (min-width: 769px){ | ||
| .bbcode-block-fonts { width: 120px; } | .bbcode-block-fonts { width: 120px; } | ||
| .bbcode-block-title { width: 70px; } | .bbcode-block-title { width: 70px; } | ||
| .bbcode-block-ul { width: 150px; } | .bbcode-block-ul { width: 150px; } | ||
| .bbcode-block-block { width: 100px; } | .bbcode-block-block { width: 100px; } | ||
| .bbcode-block-message { width: 110px; } | .bbcode-block-message { width: 110px; } | ||
| .bbcode-block-size { width: 40px; } | .bbcode-block-size { width: 40px; } | ||
| .bbcode-block-hide { width: 90px; } | .bbcode-block-hide { width: 90px; } | ||
| .bbcode-block-table { width: 160px; } | .bbcode-block-table { width: 160px; } | ||
| .bbcode-block-code { width: 130px; } | .bbcode-block-code { width: 130px; } | ||
| .bbcode-block-smileys { width: 188px; } | .bbcode-block-smileys { width: 188px; } | ||
| .bbcode-block-fa { width: 272px; } | .bbcode-block-fa { width: 272px; } | ||
| .bbcode-block-aligns { width: 120px; } | .bbcode-block-aligns { width: 120px; } | ||
| .bbcode-block-positions { width: 120px; } | .bbcode-block-positions { width: 120px; } | ||
| } | } | ||
| .bbcode-forbidden, | .bbcode-forbidden, | ||
| .bbcode-forbidden i { | .bbcode-forbidden i { | ||
| opacity: 0.3 !important; | opacity: 0.3 !important; | ||
| cursor: not-allowed !important; | cursor: not-allowed !important; | ||
| } | } | ||
| /* Icones de la barre BBCode */ | .bbcode-icon-anchor:before { content: "\f13d"; } /* copy anchor */ | ||
| .bbcode a, | .bbcode-icon-bold:before { content: "\f032"; } /* copy bold */ | ||
| .bbcode .fa { | .bbcode-icon-italic:before { content: "\f033"; } /* copy italic */ | ||
| color: #555555; | .bbcode-icon-underline:before { content: "\f0cd"; } /* copy underline */ | ||
| text-align: center; | .bbcode-icon-strike:before { content: "\f0cc"; } /* copy strikethrough */ | ||
| vertical-align: 0; | .bbcode-icon-smileys:before { content: "\f118"; } /* copy smile */ | ||
| } | .bbcode-icon-title:before { content: "\f022"; } /* copy list-alt */ | ||
| .bbcode-icon-subtitle:before { content: "\f0c8"; } /* copy square, regular font */ | |||
| .bbcode-icon-style:before { content: "\f071"; } /* copy exclamation-triangle */ | |||
| .bbcode-icon-url:before { content: "\f0ac"; } /* copy globe */ | |||
| .bbcode-icon-image:before { content: "\f03e"; } /* copy image, regular font */ | |||
| .bbcode-icon-lightbox:before { content: "\f030"; } /* copy camera */ | |||
| .bbcode-icon-quote:before { content: "\f10d"; } /* copy quote-left */ | |||
| .bbcode-icon-hide:before { content: "\f070"; } /* copy eye-slash */ | |||
| .bbcode-icon-list:before { content: "\f03a"; } /* copy list */ | |||
| .bbcode-icon-color:before { content: "\f043"; } /* copy tint */ | |||
| .bbcode-icon-size:before { content: "\f034"; } /* copy text-height */ | |||
| .bbcode-icon-font:before { content: "\f031"; } /* copy font */ | |||
| .bbcode-icon-minus:before { content: "\f068"; } /* copy minus */ | |||
| .bbcode-icon-plus:before { content: "\f067"; } /* copy plus */ | |||
| .bbcode-icon-more:before { content: "\f0dc"; } /* copy sort */ | |||
| .bbcode-icon-left:before { content: "\f036"; } /* copy align-left */ | |||
| .bbcode-icon-center:before { content: "\f037"; } /* copy align-center */ | |||
| .bbcode-icon-right:before { content: "\f038"; } /* copy align-right */ | |||
| .bbcode-icon-justify:before { content: "\f039"; } /* copy align-justify */ | |||
| .bbcode-icon-float-left:before { content: "\f048"; } /* copy step-backward */ | |||
| .bbcode-icon-float-right:before { content: "\f051"; } /* copy step-forward */ | |||
| .bbcode-icon-sup:before { content: "\f12b"; } /* copy superscript */ | |||
| .bbcode-icon-sub:before { content: "\f12c"; } /* copy subscript */ | |||
| .bbcode-icon-indent:before { content: "\f03c"; } /* copy indent */ | |||
| .bbcode-icon-table:before { content: "\f0ce"; } /* copy table */ | |||
| .bbcode-icon-flash:before { content: "\f144"; } /* copy play-circle, regular font */ | |||
| .bbcode-icon-movie:before { content: "\f008"; } /* copy film */ | |||
| .bbcode-icon-youtube:before { content: "\f167"; } /* copy youtube, brands font */ | |||
| .bbcode-icon-sound:before { content: "\f001"; } /* copy music */ | |||
| .bbcode-icon-code:before { content: "\f121"; } /* copy code */ | |||
| .bbcode-icon-math:before { content: "\f136"; } /* copy maxcdn, brands font */ | |||
| .bbcode-icon-html:before { content: "\f13b"; } /* copy html5, brands font */ | |||
| .bbcode-icon-help:before { content: "\f059"; } /* copy question-circle */ | |||
| .bbcode-icon-upload:before { content: "\f382"; } /* copy cloud-upload-alt */ | |||
| .bbcode-icon-fa:before { content: "\f425"; } /* copy font-awesome-flag, brands font */ | |||
| .bbcode-icon-mail:before { content: "\f0e0"; } /* copy envelope */ | |||
| .bbcode-icon-feed:before { content: "\f09e"; } /* copy rss */ | |||
| .bbcode-icon-bgcolor:before { content: "\f1fc"; } /* copy paint-brush */ | |||
| .bbcode-icon-anchor:before { content: "\f13d"; } | .bbcode-icon-flash, | ||
| .bbcode-icon-bold:before { content: "\f032"; } | .bbcode-icon-image, | ||
| .bbcode-icon-italic:before { content: "\f033"; } | .bbcode-icon-title, | ||
| .bbcode-icon-underline:before { content: "\f0cd"; } | .bbcode-icon-smileys, | ||
| .bbcode-icon-strike:before { content: "\f0cc"; } | .bbcode-icon-subtitle { | ||
| .bbcode-icon-smileys:before { content: "\f118"; } | font-weight: 400; | ||
| .bbcode-icon-title:before { content: "\f022"; } | } | ||
| .bbcode-icon-subtitle:before { content: "\f096"; } | |||
| .bbcode-icon-style:before { content: "\f071"; } | |||
| .bbcode-icon-url:before { content: "\f0ac"; } | |||
| .bbcode-icon-image:before { content: "\f03e"; } | |||
| .bbcode-icon-lightbox:before { content: "\f030"; } | |||
| .bbcode-icon-quote:before { content: "\f10d"; } | |||
| .bbcode-icon-hide:before { content: "\f070"; } | |||
| .bbcode-icon-list:before { content: "\f03a"; } | |||
| .bbcode-icon-color:before { content: "\f043"; } | |||
| .bbcode-icon-size:before { content: "\f034"; } | |||
| .bbcode-icon-font:before { content: "\f031"; } | |||
| .bbcode-icon-minus:before { content: "\f068"; } | |||
| .bbcode-icon-plus:before { content: "\f067"; } | |||
| .bbcode-icon-more:before { content: "\f0dc"; } | |||
| .bbcode-icon-left:before { content: "\f036"; } | |||
| .bbcode-icon-center:before { content: "\f037"; } | |||
| .bbcode-icon-right:before { content: "\f038"; } | |||
| .bbcode-icon-justify:before { content: "\f039"; } | |||
| .bbcode-icon-float-left:before { content: "\f048"; } | |||
| .bbcode-icon-float-right:before { content: "\f051"; } | |||
| .bbcode-icon-sup:before { content: "\f12b"; } | |||
| .bbcode-icon-sub:before { content: "\f12c"; } | |||
| .bbcode-icon-indent:before { content: "\f03c"; } | |||
| .bbcode-icon-table:before { content: "\f0ce"; } | |||
| .bbcode-icon-flash:before { content: "\f01d"; } | |||
| .bbcode-icon-movie:before { content: "\f008"; } | |||
| .bbcode-icon-youtube:before { content: "\f167"; } | |||
| .bbcode-icon-sound:before { content: "\f001"; } | |||
| .bbcode-icon-code:before { content: "\f121"; } | |||
| .bbcode-icon-math:before { content: "\f136"; } | |||
| .bbcode-icon-html:before { content: "\f13b"; } | |||
| .bbcode-icon-help:before { content: "\f059"; } | |||
| .bbcode-icon-upload:before { content: "\f0ee"; } | |||
| .bbcode-icon-fa:before { content: "\f024"; } | |||
| .bbcode-icon-mail:before { content: "\f0e0"; } | |||
| .bbcode-icon-feed:before { content: "\f09e"; } | |||
| .bbcode-icon-bgcolor:before { content: "\f1fc"; } | |||
| /* Icones modifications size or color */ | /* Icones modifications size or color */ | ||
| .bbcode-icon-math:before { | .bbcode-icon-math:before { | ||
| font-size: 0.8em; | font-size: 0.8em; | ||
| } | } | ||
| .bbcode-icon-plus:before, | .bbcode-icon-plus:before, | ||
| .bbcode-icon-minus:before { | .bbcode-icon-minus:before { | ||
| font-size: 0.7em; | font-size: 0.7em; | ||
| } | } | ||
| .bbcode-icon-more:before { | .bbcode-icon-more:before { | ||
| font-size: 0.8em; | font-size: 0.8em; | ||
| } | } |