|
|
| (Une version intermédiaire par le même utilisateur non affichée) |
| Ligne 1 : |
Ligne 1 : |
|
| |
|
| /**********************************************************
| |
| * Style Dokit for Schneider - issu de style.css Dokit
| |
| *********************************************************/
| |
|
| |
| /******* global elements */
| |
|
| |
| .containerBodyWithoutSS.col-lg-12,
| |
| .footer-main.col-lg-12,
| |
| .contentContainer.col-lg-12 {
| |
| padding-left: 0;
| |
| padding-right: 0;
| |
| float: unset;
| |
| }
| |
|
| |
| .containerBodyWithoutSS .container {
| |
| max-width: 1600px;
| |
| width: 100%;
| |
| }
| |
|
| |
| .ns-0 .containerBodyWithoutSS .container {
| |
| max-width: 1170px;
| |
| width: 100%;
| |
| }
| |
|
| |
| .contentContainer {
| |
| overflow-y: hidden;
| |
| }
| |
|
| |
| /******* header */
| |
| #mw-navigation {
| |
| border:0 ;
| |
| }
| |
|
| |
| #mw-navigation .container {
| |
| width:100%;
| |
| }
| |
|
| |
| #p-logo {
| |
| padding: 0;
| |
| border: 0;
| |
| margin-left: 0;
| |
| }
| |
|
| |
| #p-logo img {
| |
| max-height: none;
| |
| }
| |
|
| |
| .navbar-userloggedin .glyphicon-user {
| |
| display: none !important;
| |
| }
| |
|
| |
| /******* Sidemenu - merged with my css (only part) */
| |
|
| |
| .SchneiderMenuChapter {
| |
| padding-left: 30px;
| |
| margin-top: 20px;
| |
| margin-bottom: 20px;
| |
| color: #000000;
| |
| font-family: 'Arial Rounded MT Std Bold',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
| .SchneiderMenuTitle {
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| font-size: 20px;
| |
| margin-top: 5px;
| |
| padding: 0 15px 10px 30px;
| |
| }
| |
|
| |
| .vertical-sidebar .MainCurrentChapter {
| |
| background-color: #f2f4f8;
| |
| }
| |
|
| |
| .vertical-sidebar .MainCurrentChapter > a {
| |
| font-family: 'Arial Rounded MT Std Bold',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
| .vertical-sidebar li a {
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
| .vertical-sidebar a:active {
| |
| color: #0087cd;
| |
| }
| |
|
| |
| .vertical-sidebar li .selflink {
| |
| font-family: 'Arial Rounded MT Std',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
|
| |
| /* commented ... ce max-width est appliqué sur toutes les pages, pas seulement celles avec un sidemenu
| |
| body .pushBodyLeft.HasSideSummary .container {
| |
| width: 100%;
| |
| max-width: 1170px;
| |
| }
| |
| */
| |
|
| |
|
| |
| /******* page toolbar - merged */
| |
|
| |
| .p-tb.navbar {
| |
| z-index: 0;
| |
| margin-top: 48px;
| |
| padding-left: 5px;
| |
| border: 1px solid #cbcbcb;
| |
| border-left: none;
| |
| border-right: none;
| |
| border-radius: 0;
| |
| }
| |
| .p-tb .navbar-nav > li > a, .p-tb .navbar-nav > li > a:hover {
| |
| padding: 5px 10px;
| |
| font-size: 12px;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| }
| |
| .p-tb .navbar-nav > li > a {
| |
| color: #9fa0a4;
| |
| }
| |
|
| |
|
| |
| /* commented as not useful or managed elsewhere ... also already managed by chameleon (class = .img-responsive etc ...)
| |
| .responsive-img img {
| |
| width: 100%;
| |
| height: 100%;
| |
| }
| |
|
| |
| .thumbinner {
| |
| max-width: 100%;
| |
| }
| |
| */
| |
|
| |
|
| |
| /*********************
| |
| * Style of Schneider Footer
| |
| *********************/
| |
|
| |
| .footer-main {
| |
| padding-bottom: 30px;
| |
| background-color: #444;
| |
| }
| |
|
| |
| .footer-main .container .row {
| |
| padding-top: 30px;
| |
| color: #fff;
| |
| }
| |
|
| |
| .schneider-logo img {
| |
| min-height: 40px;
| |
| }
| |
|
| |
| .footer-info {
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| /* font-size:12px; */
| |
| float: none;
| |
| width: 100%;
| |
| margin-top:48px;
| |
| margin-bottom: 0;
| |
| padding: 0 15px 10px 0;
| |
| color: #9fa0a4;
| |
| background: #fff;
| |
| }
| |
|
| |
| .footer-main li {
| |
| line-height: 1.7em;
| |
| }
| |
|
| |
| .footer-main .footer-info li {
| |
| width: 100%;
| |
| padding: 0 15px;
| |
| }
| |
|
| |
| .footer-main a, .footer-main a:visited, .footer-main a.new {
| |
| color: #9fa0a4; /* medium grey */
| |
| }
| |
|
| |
| /* Dokit version, kept temporarily as memory
| |
| .footer-main a:link,
| |
| .footer-main a:visited {
| |
| color: #aaa;
| |
| }
| |
| */
| |
|
| |
| .footer-main a:visited:hover,
| |
| .footer-main a:hover,
| |
| .footer-main a:active {
| |
| color: #ffffff;
| |
| text-decoration: none;
| |
| }
| |
|
| |
| #footer-icons {
| |
| margin-bottom: 30px;
| |
| }
| |
|
| |
| .footer-main h4 {
| |
| color: inherit;
| |
| font-size: 18px;
| |
| font-weight: normal;
| |
| }
| |
|
| |
| .footer-main p {
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| color: #9fa0a4; /* medium grey */
| |
| }
| |
|
| |
|
| |
| /* ========= Comment & share ===========*/
| |
| #share-prev-next {
| |
| margin-top: 48px;
| |
| padding: 0 2em;
| |
| /* to disable text selection - for mobile */
| |
| -webkit-user-select: none; /* Chrome all / Safari all */
| |
| -moz-user-select: none; /* Firefox all */
| |
| -ms-user-select: none; /* IE 10+ */
| |
| user-select: none; /* Likely future */
| |
|
| |
| }
| |
| .add-a-comment {
| |
| display: inline-block;
| |
| font-size: 16px;
| |
| margin-bottom: 15px;
| |
| }
| |
| .add-a-comment a {
| |
| color: #219bfd;
| |
| }
| |
| .add-a-comment a:before {
| |
| content:'\F1A7';
| |
| font-family:"se-icon";
| |
| font-size:24px;
| |
| line-height:20px;
| |
| vertical-align: text-top;
| |
| display: inline-block;
| |
| padding-right: 10px;
| |
| }
| |
| #share-prev-next a.a2a_dd {
| |
| color: inherit;
| |
| }
| |
| a.a2a_dd:before {
| |
| content:'\F135';
| |
| font-family:"se-icon";
| |
| font-size:24px;
| |
| line-height:20px;
| |
| vertical-align: text-top;
| |
| display: inline-block;
| |
| padding-right: 15px;
| |
| }
| |
| a.a2a_dd:after {
| |
| content:'\F159';
| |
| font-family:"se-icon";
| |
| font-size:24px;
| |
| line-height:20px;
| |
| vertical-align: text-top;
| |
| display: inline-block;
| |
| padding-left: 10px;
| |
| }
| |
| .comment-share {
| |
| width:100%;
| |
| text-align: left;
| |
| margin-bottom: 48px;
| |
| border-top: 1px solid #cbcbcb;
| |
| border-bottom: 1px solid #cbcbcb;
| |
| }
| |
| .comment-share .btn {
| |
| font-size: 16px;
| |
| margin: 15px 32px 15px 0;
| |
| }
| |
| .comment-share .se-icon {
| |
| font-size: 24px;
| |
| margin: -5px 8px 0;
| |
| top: 4px;
| |
| }
| |
| a:hover .se-icon {
| |
| text-decoration: none;
| |
| }
| |
|
| |
| /* ========= Previous Next ===========*/
| |
| .prev-next {
| |
| /* margin-bottom: 48px; */
| |
| }
| |
| /* ul.pager {padding-left:0!important;} a priori pas/plus utile */
| |
| .pager { margin: 0; }
| |
| li.previous a, li.next a {height:160px;width:160px;padding-top:100px;font-variant: small-caps;color:#999999;font-size:20px;letter-spacing: 1px;line-height:1;border-radius:0;border:0;}
| |
| li.previous a:link, li.previous a:visited {background-image: url("extensions/DokitSchneider/img/BUTTON_PREVIOUS_NORMAL.svg"); color:#9fa0a4;}
| |
| li.next a:link, li.next a:visited {background-image: url("extensions/DokitSchneider/img/BUTTON_NEXT_NORMAL.svg"); color:#9fa0a4;}
| |
| li.previous a:hover, li.previous a:active {background-image: url("extensions/DokitSchneider/img/BUTTON_PREVIOUS_SELECTED.svg");color:white;background-color:#3dcd58;}
| |
| li.next a:hover, li.next a:active {background-image: url("extensions/DokitSchneider/img/BUTTON_NEXT_SELECTED.svg");color:white;background-color:#3dcd58;}
| |
|
| |
|
| |
|
| |
| /*********************
| |
| * Tablet style
| |
| *********************/
| |
|
| |
| .navbar-default .navbar-toggle {
| |
| border:none;
| |
| padding: 5px 10px;
| |
| margin-right: 0px;
| |
| font-size: 1.4em;
| |
| margin-top: 6px;
| |
| margin-bottom: 6px;
| |
| }
| |
|
| |
| .navbar-default .navbar-toggle:hover,
| |
| .navbar-default .navbar-toggle:focus,
| |
| .navbar-default .navbar-toggle:active {
| |
| background-color: transparent;
| |
| }
| |
|
| |
| /* not useful, I think
| |
| .navbar-default .navbar-toggle .icon-bar {
| |
| width: 5px;
| |
| height: 5Px;
| |
| background-color: #fff;
| |
| border-radius: 5px;
| |
| }
| |
| */
| |
|
| |
| .navbar-default .navbar-collapse, .navbar-default .navbar-form {
| |
| border:none !important;
| |
| }
| |
|
| |
| /* == header - brought == */
| |
|
| |
| .subnavbar {
| |
| background-color: #3dcd58;
| |
| color: #fff;
| |
| }
| |
|
| |
| .subnavbar-label {
| |
| padding-top: 6px; /* modifié */
| |
| height: 32px;
| |
| padding-left: 15px;
| |
| }
| |
|
| |
| #mw-navigation-collapse {
| |
| float: right;
| |
| }
| |
|
| |
| @media (min-width: 1024px) {
| |
| input#searchInput {
| |
| width: 250px;
| |
| }
| |
| #mw-navigation-collapse .nav.navbar-nav {
| |
| display: none;
| |
| }
| |
| /* not useful ? already exists in bootstrap, just -16px, no visual difference (or better with -16px)
| |
| .navbar-right-aligned .navbar-tools:last-child {
| |
| margin-right: -15px !important;
| |
| }
| |
| */
| |
| }
| |
|
| |
| @media (min-width: 992px) {
| |
| .footer-main p {
| |
| padding-right: 60px;
| |
| }
| |
| }
| |
|
| |
| @media (min-width: 1024px) {
| |
| #mw-navigation-collapse .nav.navbar-nav {
| |
| display:block;
| |
| }
| |
| }
| |
|
| |
| /* added by me, reco Joost vs distance between sidemenu and content */
| |
| /* no more needed or not working, I think */
| |
| /*
| |
| @media only screen and (min-width: 1024px) and (max-width: 1830px) {
| |
| body .pushBodyLeft.HasSideSummary > .container {
| |
| padding-left: 44px;
| |
| padding-right: 44px;
| |
| }
| |
| }
| |
| */
| |
|
| |
| @media (min-width: 1440px) {
| |
| input#searchInput {
| |
| width: 400px; }
| |
| }
| |
|
| |
| @media (min-width: 1830px) {
| |
| .pushBodyLeft {
| |
| margin-left: 0px;
| |
| width: 100%;
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 1023px) {
| |
| .navbar-default .navbar-collapse .navbar-nav {
| |
| display: none;
| |
| }
| |
| }
| |
|
| |
|
| |
| /*********************
| |
| * Mobile style
| |
| *********************/
| |
| @media (max-width: 1023px) {
| |
|
| |
| #p-logo {
| |
| height: 50px !important;
| |
| margin-left: 10px;
| |
| }
| |
|
| |
| #p-logo img {
| |
| max-height: 50px;
| |
| }
| |
|
| |
| .toggle.hookButtonOpenTop, .toggle { /* à supprimer après modif css wikifa-side-summary */
| |
| color: initial !important;
| |
| }
| |
|
| |
| body .navbar-default .navbar-collapse .navbar-form {
| |
| box-shadow: none;
| |
| }
| |
|
| |
| .mw-body, #share-prev-next {
| |
| padding: 0px;
| |
| }
| |
|
| |
| }
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| /* =========================================================================*/
| |
| /* DEV - COMMON.CSS - Le CSS placé ici sera appliqué à tous les habillages. */
| |
|
| |
| /* avoid impacts of parser DIV added in latest MW version */
| |
| /* .mw-parser-output { display: inline; } */
| |
|
| |
|
| |
| /* Default Schneider Electric web font - to be moved to style.less*/
| |
| @font-face{
| |
| font-family:'Arial Rounded MT Std';
| |
| src:url("/webfonts/ArialRoundedMTStd.otf");
| |
| }
| |
| @font-face{
| |
| font-family:'Arial Rounded MT Std Light';
| |
| src:url("/webfonts/ArialRoundedMTStd-Light.otf");
| |
| }
| |
| @font-face{
| |
| font-family:'Arial Rounded MT Std Bold';
| |
| src:url("/webfonts/ArialRoundedMTStd-Bold.otf");
| |
| }
| |
| /* version Emmanuel
| |
| @font-face {
| |
| font-family: 'se-icon';
| |
| src: url('/webfonts/se-icon.eot?') format('embedded-opentype'),
| |
| url('/webfonts/se-icon.woff') format('woff'),
| |
| url('/webfonts/se-icon.woff2') format('woff2'),
| |
| url('/webfonts/se-icon.ttf') format('truetype'),
| |
| url('/webfonts/se-icon.svg') format('svg');
| |
| }
| |
| */
| |
|
| |
| /* SE-ICONS - css récupéré dans l'outil de sélection de se-icon */
| |
| @font-face {
| |
| font-family: "se-icon";
| |
| src: url("/webfonts/se-icon.eot");
| |
| src: url("/webfonts/se-icon.eot?#iefix") format("embedded-opentype"), url("/webfonts/se-icon.woff") format("woff"), url("/webfonts/se-icon.ttf") format("truetype"), url("/webfonts/se-icon.svg#se-icon") format("svg");
| |
| font-weight: normal;
| |
| font-style: normal; }
| |
|
| |
| @media screen and (-webkit-min-device-pixel-ratio: 0) {
| |
| @font-face {
| |
| font-family: "se-icon";
| |
| src: url("/webfonts/se-icon.svg#se-icon") format("svg"); } }
| |
|
| |
| [class*="se-icon"] {
| |
| /* use !important to prevent issues with browser extensions that change fonts */
| |
| font-family: "se-icon";
| |
| speak: none;
| |
| font-style: normal;
| |
| line-height: 1;
| |
| position: relative;
| |
| top: 1px;
| |
| display: inline-block;
| |
| font-size: 24px;
| |
| font-weight: normal;
| |
| font-variant: normal;
| |
| text-decoration: inherit;
| |
| font-stretch: normal;
| |
| text-transform: none;
| |
| font-size: inherit;
| |
| text-rendering: auto;
| |
| /* Better Font Rendering =========== */
| |
| font-smoothing: antialiased;
| |
| letter-spacing: normal;
| |
| word-wrap: normal;
| |
| white-space: nowrap;
| |
| direction: ltr;
| |
| /* Support for all WebKit browsers. */
| |
| -webkit-font-smoothing: antialiased;
| |
| /* Support for Firefox. */
| |
| -moz-osx-font-smoothing: grayscale;
| |
| /* Support for IE. */
| |
| -webkit-font-feature-settings: 'liga';
| |
| font-feature-settings: 'liga';
| |
| font-display: block; }
| |
|
| |
| .se-icon-action_share:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-arrow2_down:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-communication_bubbles3:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-action_download_stroke:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-open_book:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-solar_panel1:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-action_search_stroke:before {
| |
| content: ""; }
| |
|
| |
| .se-icon-action_search:before {
| |
| content: ""; }
| |
|
| |
| /* ======================================================= */
| |
|
| |
| body { font-family: 'Arial Rounded MT Std',Helvetica,Verdana,sans-serif; color:#434343;} /* when moving to style.less, replace fixed color value by variable */
| |
|
| |
|
| |
| /* ================= Links =====================
| |
| /* kept for memory, for now, while testing mixin added in style.less
| |
|
| |
| a, a:link, a:visited, a.new:link, a.new:visited, a.external:link, a.external:visited {
| |
| color: #0087cd;
| |
| }
| |
| a:hover, a:focus, a:visited:hover, a:visited:focus, a.new:hover, a.new:focus, a.external:hover, a.external:focus {
| |
| color: #219bfd;
| |
| }
| |
| a:active, a.new:active, a.external:active {
| |
| color: #b10043;
| |
| }
| |
| */
| |
|
| |
|
| |
| /* =========== Breadcrumbs =============*/
| |
| .sbl-breadcrumb-bootstrap, .sbl-breadcrumb-bootstrap a, .sbl-breadcrumb-slash-location { color: #9fa0a4; background-color: white; font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif; font-size: 12px; }
| |
| .sbl-breadcrumb-bootstrap a:hover { color: #219bfd; }
| |
|
| |
| #sbl-breadcrumbs {position:absolute;top:-8px;padding:0px;display:block;overflow:hidden;text-overflow: ellipsis;height:17px;}
| |
| #firstHeading {padding-top: 64px;padding-bottom:32px;margin: 0 0 .2em;}
| |
|
| |
| @media only screen and (max-width: 767px) {
| |
| #sbl-breadcrumbs {display: none;}
| |
| #firstHeading { padding-top: 20px; }
| |
| }
| |
|
| |
| /* ============ Content ==============*/
| |
| .mw-body {
| |
| /* padding: 0px; */
| |
| }
| |
| p {
| |
| margin: 0.6em 0;
| |
| }
| |
| pre {
| |
| margin: 10px 0;
| |
| }
| |
| .mw-body ol, .mw-body ul {
| |
| margin: 0.2em 0 0 1em;
| |
| padding-left: 0;
| |
| }
| |
| .mw-body ul {
| |
| list-style: outside disc url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%226%22%20height%3D%2214%22%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20cx%3D%223%22%20cy%3D%229%22%20r%3D%223%22%20fill%3D%22%23cbcbcb%22/%3E%3C/svg%3E");
| |
| list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAJCAYAAAARml2dAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAN1wAADdcBQiibeAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAABUSURBVAiZdY4xDsAgFELB2J0DdnbwQI5OHvDfgC62SY0yvhAetI1dWEq5JN0kKwDYbhEx8oT9a5JdEtLb/M2QNW0FAJLttkLbLUfEkIRVztPdo+MBm8UkW9Zxc20AAAAASUVORK5CYII=") \9;
| |
| }
| |
| .mw-body li {
| |
| margin-bottom: .1em;
| |
| padding-left: 0.5em;
| |
| }
| |
| .mw-body ul ul ul, .mw-body ol ol ul, .mw-body ul ol ul, .mw-body ol ul ul, .mw-body dl dl ul {
| |
| list-style: none;
| |
| }
| |
| .mw-body ul ul ul li:before, .mw-body ol ol ul li:before, .mw-body ul ol ul li:before, .mw-body ol ul ul li:before, .mw-body dl dl ul li:before {
| |
| content: '\2013';
| |
| position: absolute;
| |
| margin-left: -1.3em;
| |
| }
| |
| .mw-content-ltr dd, .mw-content-rtl .mw-content-ltr dd {
| |
| margin-left: 1em;
| |
| padding-left: 0.5em;
| |
| }
| |
|
| |
|
| |
|
| |
| /* ============ titles h1, h2 ... ==============*/
| |
| h1 { font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif; font-size: 32px;}
| |
| .firstHeading {border-bottom: 1px solid #cbcbcb;}
| |
| .firstHeading .titleicon {vertical-align: text-top; margin-right:0.4em;} /* First heading icons */
| |
| h1, h2, h3 { color:#000}
| |
| h4, h5 { color:#333333;}
| |
| h3, h4, h5 { font-family: 'Arial Rounded MT Std Bold',Helvetica,Verdana,sans-serif;}
| |
| h2 { font-family: 'Arial Rounded MT Std',Helvetica,Verdana,sans-serif; font-size: 24px; padding-bottom: 0.4em; border-bottom: 1px solid #cbcbcb; }
| |
| h3 { font-size: 18px}
| |
| h4 { font-size: 15px}
| |
| h5 { font-size: 14px}
| |
| h1,h2,h3,h4,h5 {margin-top: 1.6em; margin-bottom: 0.8em;}
| |
|
| |
|
| |
| /* ============ Sidemenu - transféré dans css de l'extension ==============*/
| |
|
| |
| /* ============ end of Sidemenu ========================================================================*/
| |
|
| |
|
| |
| /* ============ Table ==============*/
| |
| /* reduce top-bottom margins vs chameleon default, as I have table title before and sometimes table notes after */
| |
| table.wikitable {
| |
| margin: 8px 0;
| |
| box-sizing: content-box;
| |
| }
| |
| /* only for wikitables with table-title before */
| |
| .table-title~table.wikitable {
| |
| box-shadow: 3px 3px 3px -1px rgba(159,160,164,0.4);
| |
| font-size: 12px;
| |
| color: inherit;
| |
| border: none;
| |
| }
| |
|
| |
| .table-title~table.wikitable > tr > th, .table-title~table.wikitable > * > tr > th {background-color: #9ee6ab;color:black;text-align:left; border-color: #f9f9f9;padding: 0.4em 0.6em; vertical-align:top;}
| |
| table.wikitable > tr > td.table_title_level_1, table.wikitable > * > tr > td.table_title_level_1 {background-color: #cbcbcb!important; }
| |
| table.wikitable > tr > td.table_title_level_2, table.wikitable > * > tr > td.table_title_level_2 {background-color: #ededed!important; border-color: #9fa0a4!important; }
| |
| .table-title~table.wikitable > tr > td, .table-title~table.wikitable > * > tr > td {background-color: white; border-color: #9fa0a4; padding-left:0.6em; padding-right:0.6em; }
| |
|
| |
| /* adjust the "external" borders around the table, for headers, normal cells, and for sub-headers */
| |
| .table-title~table.wikitable > * > tr > th:first-child { border-left-color: #9ee6ab; }
| |
| .table-title~table.wikitable > * > tr > td:first-child, .table-title~table.wikitable > * > tr > td.table_title_level_1:first-child, .table-title~table.wikitable > * > tr > td.table_title_level_2:first-child { border-left-color: #9fa0a4; }
| |
| .table-title~table.wikitable > * > tr > th:last-child { border-right-color: #9fa0a4; }
| |
| .table-title~table.wikitable > * > tr > td:last-child, .table-title~table.wikitable > * > tr > td.table_title_level_1:last-child, .table-title~table.wikitable > * > tr > td.table_title_level_2:last-child { border-right-color: #9fa0a4; }
| |
| .table-title~table.wikitable > * > tr:first-child > th, .table-title~table.wikitable > * > tr:first-child > td {
| |
| border-top-color: #9ee6ab;
| |
| }
| |
|
| |
| /* table title - div before the table */
| |
| .table-title {margin-top: 32px; }
| |
| span.title-num {font-weight: bold; }
| |
| /* span.title-sep::before {content: "\00a0\002013\00a0"; } no more needed, added the dash in the html rather than css */
| |
|
| |
| /* specific case of table legends, created with template tb-legend */
| |
| .table-title.no-title {
| |
| margin: 0;
| |
| }
| |
| .table-title.no-title+table.wikitable {
| |
| box-shadow: none;
| |
| border-collapse: separate;
| |
| border-spacing: 0 5px;
| |
| background-color: #fff;
| |
| }
| |
| .table-title.no-title+table.wikitable td {
| |
| border: none;
| |
| }
| |
| .legend-white {
| |
| border: 1px solid #9fa0a4!important;
| |
| }
| |
|
| |
| /* table notes */
| |
| .tb-notes {font-size: 12px; margin-top: 0; margin-left: 5px; margin-bottom: 32px;}
| |
| .tb-txt-notes ul {
| |
| list-style: none;
| |
| margin-left: 1px;
| |
| margin-bottom: 8px;
| |
| padding-left: 8px;
| |
| border-left: 3px solid #9fe6ac;
| |
| }
| |
| .tb-ref-notes, .tb-txt-notes {
| |
| margin-top: 12px;
| |
| }
| |
| table.wikitable+p, table.wikitable+h3, table.wikitable+h4 {margin-top: 32px;}
| |
|
| |
| /* Enable custom list style types like lower-alpha (copied from wikipedia) */
| |
| div.reflist ol.references {
| |
| list-style-type: inherit; /* Enable custom list style types */
| |
| }
| |
| /* Format reference tooltips and table notes on mouseover - commented - styling done in ReferenceTooltip.css
| |
| .referencetooltip > li {
| |
| background: #def;
| |
| border: 1px solid #219bfd;
| |
| -webkit-box-shadow: 0 0 10px rgba(0,135,205,0.4);
| |
| -moz-box-shadow: 0 0 10px rgba(0,135,205,0.4);
| |
| box-shadow: 0 0 10px rgba(0,135,205,0.4);
| |
| }
| |
| ol.references li:target, .RTTarget {
| |
| background-color: #d7edff;
| |
| }
| |
| .referencetooltip > li + li {
| |
| border-top-color: #219bfd;
| |
| }
| |
| .referencetooltip > li + li::after {
| |
| border-top-color: #d7edff;
| |
| }
| |
| .referencetooltip.RTflipped > li + li {
| |
| border-bottom-color: #219bfd;
| |
| }
| |
| .referencetooltip.RTflipped > li + li::after {
| |
| border-bottom-color: #d7edff;
| |
| }
| |
| .RTflipped {
| |
| padding-top: 11px;
| |
| }
| |
| */
| |
|
| |
| /* table vertical align */
| |
| td {vertical-align: top;}
| |
|
| |
| /* no border for empty cells */
| |
| .ns-0 table {empty-cells: hide;}
| |
|
| |
| /* font-size for footnotes */
| |
| h2.footnotes-intro + .mw-references-wrap { font-size: 90%; }
| |
|
| |
| /* ==================== responsive tables ===================== */
| |
|
| |
| @media only screen and (max-width: 1024px) {
| |
|
| |
| /* modify look of table scrollbar, when table is too large for screen (mobile) and has its own horiz scrollbar */
| |
| table::-webkit-scrollbar { height: 5px; }
| |
| table::-webkit-scrollbar-thumb { background-color: #333333; }
| |
| table::-webkit-scrollbar-track { background-color: rgba(0,0,0,0.1); }
| |
|
| |
| /* ============== images in tables ================ */
| |
| .table-title~table.wikitable td a img {
| |
| max-width: 30vw;
| |
| height: auto;
| |
| }
| |
|
| |
| }
| |
|
| |
| /* for each "standardized" table width (class .cols-2 ... 5), apply responsive CSS if screen size below max width, and standard max-width table CSS if screen is larger */
| |
| /* WARNING : might not be OK as it does not take into account if navigation menu is visible or not ... */
| |
|
| |
| /* === .cols-2 === */
| |
| @media only screen and (max-width: 340px) {
| |
| .table-title.cols-2+table {
| |
| margin-right: auto;
| |
| border-collapse: collapse;
| |
| overflow: auto;
| |
| display: block;
| |
| width: fit-content;
| |
| max-width: calc(100% + 15px);
| |
| /* to disable text selection - for mobile - when scrolling left-right on a table */
| |
| -webkit-user-select: none; /* Chrome all / Safari all */
| |
| -moz-user-select: none; /* Firefox all */
| |
| -ms-user-select: none; /* IE 10+ */
| |
| user-select: none; /* Likely future */
| |
| }
| |
| }
| |
| @media only screen and (min-width: 341px) {
| |
| .table-title.cols-2 + table {
| |
| max-width: 340px;
| |
| }
| |
| }
| |
|
| |
| /* === .cols-3 === */
| |
| @media only screen and (max-width: 510px) {
| |
| .table-title.cols-3+table {
| |
| margin-right: auto;
| |
| border-collapse: collapse;
| |
| overflow: auto;
| |
| display: block;
| |
| width: fit-content;
| |
| max-width: calc(100% + 15px);
| |
| /* to disable text selection - for mobile - when scrolling left-right on a table */
| |
| -webkit-user-select: none; /* Chrome all / Safari all */
| |
| -moz-user-select: none; /* Firefox all */
| |
| -ms-user-select: none; /* IE 10+ */
| |
| user-select: none; /* Likely future */
| |
| }
| |
| }
| |
| @media only screen and (min-width: 511px) {
| |
| .table-title.cols-3+table {
| |
| max-width: 510px;
| |
| }
| |
| }
| |
|
| |
| /* === .cols-4 === */
| |
| @media only screen and (max-width: 680px) {
| |
| .table-title.cols-4+table {
| |
| margin-right: auto;
| |
| border-collapse: collapse;
| |
| overflow: auto;
| |
| display: block;
| |
| width: fit-content;
| |
| max-width: calc(100% + 15px);
| |
| /* to disable text selection - for mobile - when scrolling left-right on a table */
| |
| -webkit-user-select: none; /* Chrome all / Safari all */
| |
| -moz-user-select: none; /* Firefox all */
| |
| -ms-user-select: none; /* IE 10+ */
| |
| user-select: none; /* Likely future */
| |
| }
| |
| }
| |
| @media only screen and (min-width: 681px) {
| |
| .table-title.cols-4+table {
| |
| max-width: 680px;
| |
| }
| |
| }
| |
|
| |
| /* === .cols-5 === */
| |
| @media only screen and (max-width: 850px) {
| |
| .table-title.cols-5+table {
| |
| margin-right: auto;
| |
| border-collapse: collapse;
| |
| overflow: auto;
| |
| display: block;
| |
| width: fit-content;
| |
| max-width: calc(100% + 15px);
| |
| /* to disable text selection - for mobile - when scrolling left-right on a table */
| |
| -webkit-user-select: none; /* Chrome all / Safari all */
| |
| -moz-user-select: none; /* Firefox all */
| |
| -ms-user-select: none; /* IE 10+ */
| |
| user-select: none; /* Likely future */
| |
| }
| |
| }
| |
| @media only screen and (min-width: 851px) {
| |
| .table-title.cols-5+table {
| |
| max-width: 850px;
| |
| }
| |
| }
| |
|
| |
|
| |
| /* highlights */
| |
| .hl-box {
| |
| margin-top: 32px;
| |
| margin-bottom: 32px;
| |
| background: #F7F7F7;
| |
| border-left: 3px solid #3DCD58;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| font-size: 15px;
| |
| width: 100%;
| |
| border-radius: 0;
| |
| padding: 16px;
| |
| }
| |
|
| |
| /* local specific contents */
| |
|
| |
| .local-specific-section {
| |
| /* margin-left: -15px; */
| |
| /* padding: 3px 0px 3px 10px; */
| |
| /* border-left:5px solid #c96fff; */
| |
| margin-left: -15px;
| |
| margin-right: -15px;
| |
| padding: 3px 15px;
| |
| background-color: #f2edfe;
| |
| }
| |
| .local-specific-text {
| |
| background-color: #f2edfe;
| |
| padding: 2px 3px;
| |
| }
| |
|
| |
| .local-specific {
| |
| background-color: #f2edfe!important;
| |
| }
| |
|
| |
| /* test ajout icône dans la marge
| |
| .local-specific-text:before, .local-specific-section:before {
| |
| content: "\F1E2";
| |
| font-family: "se-icon";
| |
| font-size: 20px;
| |
| position: absolute;
| |
| left: -25px;
| |
| margin-top: -5px;
| |
| color: rgba(165, 111, 255, 1);
| |
| }
| |
| */
| |
|
| |
| /* ============== page TOC (generated by mediawiki) ================ */
| |
| #toc {
| |
| display: table;
| |
| padding: 16px;
| |
| background-color: #f7f7f7;
| |
| border-radius: 0;
| |
| margin-top: 32px;
| |
| margin-bottom: 32px;
| |
| }
| |
| #toc h2 {
| |
| display: inline;
| |
| font-size: 20px;
| |
| border: none;
| |
| color: #333333;
| |
| }
| |
| /* span.toctext, #toc li a { */
| |
| #toc ul {
| |
| margin-left:0;
| |
| margin-top:15px;
| |
| }
| |
| #toc li {
| |
| padding-left:0;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
| #toc .tocnumber { display: none; }
| |
|
| |
| /* ============== images with titles ('figures') ================ */
| |
| .img_anchor {
| |
| margin-top: 32px;
| |
| margin-bottom: 32px;
| |
| }
| |
| .thumbinner {
| |
| background-color: white;
| |
| border: none;
| |
| padding: 0px;
| |
| box-sizing: content-box;
| |
| border-radius: 0;
| |
| }
| |
|
| |
| .thumbinner { max-width:100%; }
| |
|
| |
| .thumbcaption {
| |
| border: none;
| |
| background-color: #ededed;
| |
| color: #434343;
| |
| padding: 0px;
| |
| }
| |
|
| |
| .thumbcaption p {margin:0;}
| |
|
| |
| .thumbinner > img, .thumbinner a > img {
| |
| border: 1px solid #ededed;
| |
| border-bottom: none;
| |
| background-color: white;
| |
| max-width: calc(100% - 2px);
| |
| }
| |
|
| |
| .figure-title {
| |
| padding: 10px;
| |
| }
| |
|
| |
| .figure-notes {
| |
| font-size: 12px;
| |
| border: 1px solid #ededed;
| |
| border-top: none;
| |
| padding: 10px 18px;
| |
| background-color: white;
| |
| }
| |
|
| |
| /*=================== new gallery ===============*/
| |
|
| |
| .EIG-gallery {
| |
| margin-left: -4px;
| |
| margin-top: 30px;
| |
| }
| |
|
| |
| .gallery-title { padding: 0 0 5px 6px; }
| |
|
| |
| .EIG-gallery ul.gallery {
| |
| margin: 2px;
| |
| padding: 2px;
| |
| display: block;
| |
| }
| |
|
| |
| .EIG-gallery li.gallerybox {
| |
| margin-bottom: 10px;
| |
| padding-left: 0;
| |
| max-width: 100%;
| |
| }
| |
|
| |
| .EIG-gallery li.gallerybox > div {
| |
| max-width: 100%;
| |
| }
| |
|
| |
| .EIG-gallery li.gallerybox div.thumb {
| |
| border: 1px solid #ededed;
| |
| background-color: white;
| |
| max-width: calc(100% - 5px);
| |
| }
| |
|
| |
| .EIG-gallery li.gallerybox div.thumb img {
| |
| max-width: calc(100% - 10px);
| |
| }
| |
|
| |
| .EIG-gallery li.gallerybox div.gallerytext {
| |
| font-size: 12px;
| |
| padding: 0;
| |
| word-wrap: break-word;
| |
| background-color: #ededed;
| |
| margin: -2px 3px 0 2px;
| |
| /* min-height: 55px; */
| |
| }
| |
|
| |
| .EIG-gallery div.gallerytext p { margin: 5px 0 5px; padding: 5px 10px;}
| |
|
| |
| /* ============ math formulas ==============*/
| |
| .mwe-math-element { margin: 0 7px; }
| |
|
| |
|
| |
| /* Video embedded as a float right */
| |
| .video-float-right {
| |
| float:right;
| |
| margin-left:20px;
| |
| margin-bottom:20px;
| |
| padding:0;
| |
| }
| |
|
| |
| /* Video embedded as a float left */
| |
| .video-float-left {
| |
| float:left;
| |
| margin-right:20px;
| |
| margin-bottom:20px;
| |
| padding:0;
| |
| }
| |
|
| |
| .clearfix {clear: both;}
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
|
| |
| /* ================ CSS specific to Home Page (HP) - merged between Dokit css and my css =========================================================================== */
| |
|
| |
| .eig-main-page .contentHeader {
| |
| display: none;
| |
| }
| |
|
| |
| .eig-main-page #content {
| |
| margin-top: 0;
| |
| }
| |
|
| |
| .eig-main-page .containerBodyWithoutSS > .container {
| |
| max-width: none;
| |
| }
| |
|
| |
| .eig-main-page .mw-body {
| |
| padding: 0;
| |
| }
| |
|
| |
| .eig-main-page div.patrollink {
| |
| max-width: 1170px;
| |
| margin: auto;
| |
| margin-top: 20px;
| |
| }
| |
|
| |
|
| |
| /******************************
| |
| * HP - Carousel - Merged
| |
| *****************************/
| |
|
| |
| .hp-slider {
| |
| margin-top:-1px;
| |
| }
| |
|
| |
| .hp-slider ol.carousel-indicators {
| |
| width: 100%;
| |
| left: auto;
| |
| margin: auto;
| |
| text-align: center;
| |
| bottom: 5px;
| |
| padding-left: 0;
| |
| }
| |
|
| |
| /* commented, seems unneeded
| |
| .hp-slider .carousel {
| |
| border: none;
| |
| }
| |
| */
| |
|
| |
| .hp-slider .carousel-caption {
| |
| float: left;
| |
| text-align: left;
| |
| padding: 24px;
| |
| max-width: 520px;
| |
| background-color: rgba(0, 0, 0, 0.5);
| |
| top: 10%;
| |
| left:25%; /* modifié pour carousel sur toute la largeur de la page */
| |
| right:15%;
| |
| bottom: auto;
| |
| }
| |
|
| |
| .hp-slider .carousel-caption h4 {
| |
| font-family:'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| font-size: 2em;
| |
| color:inherit;
| |
| margin-top: 0;
| |
| margin-bottom: 15px;
| |
| }
| |
|
| |
| .hp-slider p.text {
| |
| font-size: 1.05em;
| |
| margin-bottom: 1em;
| |
| line-height: 1.5em;
| |
| }
| |
|
| |
| .carousel-caption p {
| |
| margin: 0;
| |
| }
| |
|
| |
| .hp-slider .carousel-indicators li {
| |
| width: 14px;
| |
| height: 14px;
| |
| background-color: #e6e6e6;
| |
| -webkit-transition: opacity 200ms cubic-bezier(0.19,1,0.22,1);
| |
| transition: opacity 200ms cubic-bezier(0.19,1,0.22,1);
| |
| margin:0 1px;
| |
| border: 0px;
| |
| }
| |
|
| |
| .hp-slider .carousel-indicators li.active {
| |
| background-color: #3dcd58;
| |
| }
| |
|
| |
| .hp-slider .carousel-inner {
| |
| max-height: 300px;
| |
| }
| |
|
| |
| .hp-slider .carousel-inner + p {
| |
| margin: 0px;
| |
| }
| |
|
| |
| @media (min-width: 1921px) {
| |
| .hp-slider {
| |
| max-width:1170px;
| |
| margin-left:auto;
| |
| margin-right:auto;
| |
| text-align:center;
| |
| }
| |
| }
| |
|
| |
| /*****************************************
| |
| * HP - Blog Post - Merged
| |
| ****************************************/
| |
|
| |
| .hp-blogpost {
| |
| padding-top: 5px;
| |
| padding-bottom: 13px;
| |
| border-bottom: 1px solid #cbcbcb;
| |
| }
| |
|
| |
| .hp-blogpost .btn {
| |
| float: left;
| |
| font-size: 16px;
| |
| max-width: 230px;
| |
| margin-top: 10px;
| |
| padding: 5px 12px 5px 38px;
| |
| background-image: url("extensions/DokitSchneider/img/ICON_BLOG_ALPHA75_24.png");
| |
| background-position: 6px 4px;
| |
| background-size: 24px;
| |
| background-repeat: no-repeat;
| |
| }
| |
|
| |
| .hp-blogpost .btn-info:hover, .hp-blogpost .btn-info a:hover, .hp-blogpost .btn-info a.new:visited:hover, .hp-blogpost .btn-info a:visited:hover {
| |
| background-color: #0087cd;
| |
| border-color: #0087cd;
| |
| }
| |
|
| |
| .hp-blogpost dl {
| |
| float: left;
| |
| width: calc(100% - 245px); /* should be ok for other languages - tested in FR */
| |
| margin-left: 15px;
| |
| margin-bottom: 0;
| |
| margin-top: -2px;
| |
|
| |
| }
| |
|
| |
| .mw-body .hp-blogpost .plainlinks a {
| |
| text-overflow: ellipsis;
| |
| overflow: hidden;
| |
| width: 100%;
| |
| white-space: nowrap;
| |
| float: left;
| |
| vertical-align: baseline;
| |
| color: #3dcd58;
| |
| font-size: 15px;
| |
| }
| |
|
| |
| .blog-author {
| |
| float: left;
| |
| margin: 0px 15px;
| |
| color:#505559; /* Joost reco */
| |
| font-size: 15px;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
|
| |
| /*********************
| |
| * HP - Intro
| |
| *********************/
| |
| .intro-section h1 { /* Joost reco */
| |
| font-size: 32px;
| |
| color: #000;
| |
| margin-bottom: 20px;
| |
| }
| |
| .intro-section .intro-description, .chapter-section .subtitle { /* Joost reco */
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| font-size: 18px;
| |
| color: #333333;
| |
| }
| |
| .intro-section {
| |
| margin-top: 44px; /* in total, vertical space (below blog border) OK vs reco Joost - replace by 24px if no blog border */
| |
| }
| |
| .intro-description a {
| |
| display: inline-block; /* ensure that the link "Read more ..." is never broken between 2 lines */
| |
| }
| |
|
| |
|
| |
| /*********************
| |
| * HP - Table of Contents - css reviewed/merged according to my version of TOC (internal links, not external links as in Dokit version)
| |
| *********************/
| |
|
| |
| .chapter-section {
| |
| margin-top: 20px;
| |
| }
| |
|
| |
| .chapter-section h3, .book-section h3, .highlight-section-block h3, .help-section h3 { /* copied from isee-eig - chameleon.css */
| |
| text-align: left;
| |
| font-family: "Arial Rounded MT Std",Helvetica,Verdana,sans-serif;
| |
| font-size: 24px;
| |
| }
| |
|
| |
| .chapter-section h3 {
| |
| font-size: 28px;
| |
| color: #3dcd58;
| |
| }
| |
|
| |
| .chapter-section .subtitle {
| |
| text-align: left;
| |
| margin: 20px 0;
| |
| font-size: 18px; /* responsive size to check .... */
| |
| color: #333333;
| |
| }
| |
|
| |
| .hp-chapter {
| |
| box-shadow: 0px 0px 5px rgba(0,0,0,0.2);
| |
| float: left;
| |
| width: 100%;
| |
| margin-bottom: 2em;
| |
| border-left: 5px solid #3dcd58;
| |
| }
| |
|
| |
| .hp-chapter:hover {
| |
| box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
| |
| }
| |
| .hp-chapter:hover h4 span {
| |
| color: #219bfd;
| |
| text-decoration: underline;
| |
| }
| |
| .hp-chapter > a {
| |
| float:left;
| |
| width:96px;
| |
| height: 91px;
| |
| padding-top: 15px;
| |
| }
| |
| .hp-chapter-img {margin: auto; display:block; }
| |
|
| |
| .hp-chapter h4 {
| |
| margin:0;
| |
| padding: 0 15px 0 0;
| |
| float: left;
| |
| line-height: 21px;
| |
| width: calc(100% - 96px);
| |
| font-family:'Arial Rounded MT Std',Helvetica,Verdana,sans-serif;
| |
| font-size: 16px;
| |
| }
| |
|
| |
| .hp-chapter-letter {font-weight: bold;}
| |
| .mw-body .hp-chapter h4 a {
| |
| color:#333333;
| |
| padding: 15px 0 13px;
| |
| display:block;
| |
| }
| |
| .mw-body .hp-chapter h4 a:hover, .mw-body .hp-chapter h4 a:focus {color:#219bfd;} /* color as per Joost reco */
| |
|
| |
| /* added in case a chapter title would take more than 3 lines, to hide the text overflow */
| |
| /* to be tested again when migrating German wiki, as titles are normally quite long */
| |
| .mw-body .hp-chapter h4 a > span {
| |
| height: 63px;
| |
| display: block;
| |
| display: -webkit-box;
| |
| overflow: hidden;
| |
| text-overflow: ellipsis;
| |
| -webkit-line-clamp: 3;
| |
| -webkit-box-orient: vertical;
| |
| }
| |
|
| |
|
| |
| /*********************
| |
| * Book section block - Merged
| |
| *********************/
| |
|
| |
| .book-section {
| |
| background-image: url('extensions/DokitSchneider/img/hp-book-bg.png');
| |
| background-repeat: repeat-x;
| |
| background-position: bottom;
| |
| margin-top: 10px;
| |
| padding: 0 30px 10px 30px;
| |
| }
| |
|
| |
| .book-section h3 {
| |
| margin-top: 20px;
| |
| margin-bottom: 20px;
| |
| color: #333333;
| |
| padding-top: 120px;
| |
| }
| |
|
| |
| .book-section-text {
| |
| padding: 0 15px;
| |
| }
| |
|
| |
| .book-section .subtitle {
| |
| margin: 0 0 20px;
| |
| font-size: 15px;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| color:#333333;
| |
| }
| |
|
| |
| .book-section-img {
| |
| text-align: center;
| |
| }
| |
|
| |
|
| |
| /*************************
| |
| * Highlight section block (no merging here as it did not exist as such in Dokit css - was "help-section-left" in Dokit homepage)
| |
| *************************/
| |
| .highlight-section {
| |
| margin-top: 64px;
| |
| }
| |
|
| |
| .highlight-section p {
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
| .highlight-section-block {
| |
| padding: 0 30px;
| |
| max-width: 585px;
| |
| }
| |
|
| |
| .highlight-section-block .subtitle {
| |
| text-align: left;
| |
| font-size: 16px;
| |
| color: #3dcd58;
| |
| margin: 0 0 10px;
| |
| }
| |
|
| |
| .highlight-section-block:nth-child(odd) {
| |
| border-right: 1px solid #cbcbcb;
| |
| }
| |
|
| |
| .highlight-section-block h3 {
| |
| margin: 0 0 25px;
| |
| color: #333333;
| |
| }
| |
|
| |
| .highlight-section-block img {
| |
| box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
| |
| }
| |
|
| |
| .highlight-section-block a {
| |
| font-family: "Arial Rounded Mt Std",Helvetica,Verdana,sans-serif;
| |
| /* color: #219bfd; a priori pas utile */
| |
| }
| |
|
| |
| .highlight-link {margin-top: 15px;}
| |
|
| |
| /*******************************
| |
| * Help section block - Merged
| |
| *******************************/
| |
|
| |
| .help-section { margin-top: 64px;}
| |
|
| |
| .help-section .row { background-color: #f7f7f7; }
| |
|
| |
| .help-section h3 { margin-top: 0; color:#fff; }
| |
| .help-section-text {
| |
| color: #fff;
| |
| background-color: #626469;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| padding: 30px;
| |
| }
| |
|
| |
| .help-section-action {
| |
| text-align: center;
| |
| padding: 30px 15px 20px;
| |
| }
| |
|
| |
| .help-section-action a, .help-section-action a.new {
| |
| color: #333333;
| |
| }
| |
|
| |
| .help-section-action a:hover, .help-section-action a.new:hover {
| |
| color: #219bfd;
| |
| }
| |
|
| |
| .help-section-action h4 {
| |
| font-size: 16px;
| |
| margin-top: 15px;
| |
| color: inherit;
| |
| }
| |
| .help-section-action p {
| |
| margin:0;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| }
| |
|
| |
| /*******************************
| |
| * Other languages section
| |
| *******************************/
| |
| .lang-section {
| |
| padding: 0 30px;
| |
| margin-top: 64px;
| |
| }
| |
|
| |
| .lang-section.container h3 {
| |
| font-size: 24px;
| |
| font-family: 'Arial Rounded MT Std',Helvetica,Verdana,sans-serif;
| |
| margin-top: 0;
| |
| }
| |
|
| |
| .hp-lang {
| |
| padding: 15px;
| |
| background-color: #f7f7f7;
| |
| }
| |
|
| |
| .hp-lang:hover, .hp-lang:hover h4 {
| |
| background-color: #e6e6e6; /* Super Light Grey */
| |
| }
| |
|
| |
| .hp-lang h4 {
| |
| padding: 15px;
| |
| background-color: inherit;
| |
| color: #333333;
| |
| margin: 0;
| |
| text-align: center;
| |
| font-family: 'Arial Rounded MT Std',Helvetica,Verdana,sans-serif;
| |
| font-size: 20px;
| |
| }
| |
|
| |
| .lang-section .subtitle {
| |
| font-size: 15px;
| |
| font-family: 'Arial Rounded MT Std Light',Helvetica,Verdana,sans-serif;
| |
| color: #333333;
| |
| }
| |
|
| |
| .lang-section.container h3:before {
| |
| content: "\F1E2";
| |
| font-family: "se-icon";
| |
| font-size: 32px;
| |
| vertical-align: sub;
| |
| padding-right: 10px;
| |
| margin-left: -4px;
| |
| color: #9fa0a4;
| |
| }
| |
|
| |
| .lang-section .row > div {
| |
| margin-top: 10px;
| |
| }
| |
|
| |
| .hp-lang a:hover {
| |
| text-decoration: none;
| |
| }
| |
|
| |
| @media (max-width: 767px) {
| |
| .lang-section {
| |
| padding: 0;
| |
| }
| |
| }
| |
|
| |
|
| |
| /*********************
| |
| * Tablet style - from Dokit - only HomePage parts - to be merged with mine
| |
| *********************/
| |
|
| |
| /* commented for now - check if useful to do something, like smaller icon size + larger space for title + smaller font, possibly
| |
| also keep in mind that I re-used class .hp-chapter-img but it is different than in Dokit version of chapter TOC
| |
| so ALL css related to .hp-chapter-img MUST BE REVIEWED
| |
|
| |
| @media (max-width: 1200px) {
| |
| .hp-chapter-img {
| |
| width: 87px;
| |
| padding: 15px 10px !important;
| |
| height: 90px;
| |
| }
| |
|
| |
| .hp-chapter h4 {
| |
| width: calc(100% - 88px);
| |
| font-size: 16px;
| |
| padding-top: 23px;
| |
| max-height: 75px;
| |
| overflow: hidden;
| |
| }
| |
| }
| |
|
| |
| */
| |
|
| |
| /*********************
| |
| * Mobile style - merged
| |
| *********************/
| |
|
| |
| @media (max-width: 991px) {
| |
|
| |
| .book-section {
| |
| background-repeat: repeat;
| |
| padding-top: 25px;
| |
| }
| |
|
| |
| .book-section h3 {
| |
| padding-top: 15px;
| |
| }
| |
|
| |
| .book-section-img img {
| |
| max-width: 100%;
| |
| height: auto;
| |
| }
| |
|
| |
| .hp-slider p.text {
| |
| display: none;
| |
| }
| |
|
| |
| }
| |
|
| |
| @media (max-width: 767px) {
| |
|
| |
| .intro-section {
| |
| margin-top: 24px;
| |
| }
| |
| .intro-section h1 {
| |
| font-size: 28px;
| |
| }
| |
|
| |
| .chapter-section h3 {
| |
| font-size: 24px;
| |
| }
| |
|
| |
| .intro-section .intro-description, .chapter-section .subtitle {
| |
| font-size: 16px;
| |
| }
| |
|
| |
| .book-section {
| |
| margin-top: 50px;
| |
| }
| |
| .book-section h3 {
| |
| padding-top: 0px;
| |
| }
| |
|
| |
| .book-section-text {
| |
| padding: 0;
| |
| }
| |
|
| |
| .book-section-img {
| |
| margin-top: 30px;
| |
| padding-left: 50px;
| |
| }
| |
|
| |
| .highlight-section-block {
| |
| padding: 24px 15px;
| |
| }
| |
| .highlight-section-block:nth-child(odd) {
| |
| border-right: none;
| |
| border-bottom: 1px solid #cbcbcb;
| |
| }
| |
|
| |
| }
| |
|
| |
| @media (max-width: 768px) {
| |
|
| |
| .hp-slider, .hp-blogpost {
| |
| display: none;
| |
| }
| |
|
| |
| .p-tb.navbar { display:none; }
| |
|
| |
| }
| |
|
| |
|
| |
| @media (max-width: 360px) {
| |
|
| |
| .hp-chapter > a {
| |
| width:80px;
| |
| height: 75px;
| |
| padding-top: 18px;
| |
| }
| |
|
| |
| .hp-chapter img:not([class=icon_new]) {
| |
| width: 65%;
| |
| height: auto;
| |
| }
| |
|
| |
|
| |
| .hp-chapter h4 {
| |
| width: calc(100% - 80px);
| |
| font-size: 14px;
| |
| }
| |
|
| |
| .book-section-img {
| |
| padding-left: 0;
| |
| }
| |
|
| |
| li.previous a, li.next a {
| |
| height: 132px;
| |
| width: 132px;
| |
| padding-top: 80px;
| |
| font-size: 16px;
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 319px) {
| |
|
| |
| .hp-chapter h4 {
| |
| font-size: 12px;
| |
| }
| |
|
| |
| }
| |
|
| |
|
| |
| /*****************************************************************************************
| |
| * ajustements UI mediawiki vs chameleon qui impose "box-sizing = border-box" par défaut
| |
| ****************************************************************************************/
| |
|
| |
| .wikiEditor-ui {
| |
| box-sizing: content-box;
| |
| }
| |
|
| |
| /*****************************************************************************************
| |
| * ajustements look&feel pages spéciales
| |
| ****************************************************************************************/
| |
| .ns--1 #firstHeading {
| |
| padding-top: 20px;
| |
| }
| |
| /* make "new" links appear in red in special namespace */
| |
| body.ns--1 a.new {
| |
| color: #b10043;
| |
| }
| |
|
| |
|
| |
| .action-edit #share-prev-next {
| |
| display: none;
| |
| }
| |
|
| |
| /* ============ CSS for chapter TOC pages ==============*/
| |
| #chapter-toc { padding: 0 15px 15px; background-color: #f9f9f9; }
| |
| #chapter-toc h2 { margin-top: 0; }
| |
|
| |
| #chapter-toc > ul { list-style: none; padding: 0; margin-left:0; }
| |
| #chapter-toc > ul > li { font-size: 18px; padding: 0.8em 0 0; font-family:'Arial Rounded MT Std Bold',Helvetica,Verdana,sans-serif;}
| |
| #chapter-toc a {color: #333333;}
| |
|
| |
| #chapter-toc > ul ul { padding: 0.2em 0 0.2em 0.3em; }
| |
| #chapter-toc > ul ul li { font-size: 14px; }
| |
| #chapter-toc ul ul a { color: #626469; font-family:'Arial Rounded MT Std',Helvetica,Verdana,sans-serif;}
| |
|
| |
| #chapter-toc a:hover { color: #219bfd; }
| |
|
| |
| /* commented for now - test other chapter toc intro format
| |
| body.Chapter-TOC h1.firstHeading, body.Chapter-TOC #sbl-breadcrumbs { display:none; }
| |
| */
| |
|
| |
| .chapter-toc-title {
| |
| margin: 48px 0 16px;
| |
| }
| |
|
| |
| .chapter-toc-chapter {
| |
| color: #3dcd58;
| |
| }
| |
|
| |
| .chapter-banner-img {
| |
| max-width: 100%;
| |
| height: auto;
| |
| }
| |
| .chapter-banner + .hl-box {
| |
| margin-top: 0;
| |
| border:none;
| |
| }
| |
|
| |
| /* TOC toggle (show-hide) in page tocs */
| |
| .toctoggle {
| |
| float: right;
| |
| padding-left: 10px;
| |
| }
| |
|
| |
| /* Hide Share and Prev-Next when editing a page */
| |
| .action-edit #share-prev-next, .ve-active #share-prev-next {
| |
| display: none;
| |
| }
| |
|
| |
| /* Tables "squares" to show functions and options */
| |
| .tb-squares {
| |
| font-size: 15px;
| |
| line-height: 17px;
| |
| }
| |
|
| |
| /* figure number format, in texts like "see Fig. xxx" */
| |
| .FigRef {
| |
| font-weight: bold;
| |
| }
| |
|
| |
| /* Hide category links in namespace 0 */
| |
| .ns-0 #catlinks {
| |
| display: none;
| |
| }
| |
|
| |
|
| |
|
| |
| /*===========================================================================*/
| |
| /* Adjustments to UI elements that are not OK vs skin Chameleon and MW 1.31 */
| |
|
| |
| /* Correction of bug in Chameleon skin */
| |
| @media (min-width: 1024px) {
| |
| .skin-chameleon .navbar-tools > li, .skin-chameleon .navbar-tools li.open {
| |
| float: none;
| |
| }
| |
| }
| |
|
| |
| .mw-echo-ui-crossWikiUnreadFilterWidget-subtitle {
| |
| display: block!important;
| |
| }
| |
|
| |
| /* pb in advanced search options format, because chameleon uses .mw-body ul, which takes precedence over .search-types ul */
| |
| .mw-body .search-types ul {
| |
| margin: 0;
| |
| padding: 0;
| |
| list-style: none;
| |
| }
| |
|
| |
| /* position of notifications when watching / unwatching pages */
| |
| .mw-notification-area { position: fixed; top: 100px; }
| |
|
| |
| /* add "video" capsule at the end of a page title */
| |
| /* in pages including a video, and in search results */
| |
| .vd0 #firstHeading:after, .mw-search-results a[title*=Eig-pages-with-video]+a:after {
| |
| content: "video";
| |
| display: inline-block;
| |
| font-family: Arial;
| |
| font-size: 9px;
| |
| color: #fff;
| |
| background-color: #9fa0a4;
| |
| padding: 2px 4px;
| |
| border-radius: 3px;
| |
| position: relative;
| |
| top: -17px;
| |
| left: 4px;
| |
| }
| |
| .mw-search-results a[title*=Eig-pages-with-video]+a:after {
| |
| top: -7px;
| |
| }
| |
| /* hide the VIDEO TitleIcon (replaced by capsule after page title) */
| |
| #firstHeading img[src*=media_player], .mw-search-results a[title*=Eig-pages-with-video] { display: none; }
| |
|
| |
| /* Search results - adjust look&feel */
| |
| .mw-body .mw-search-results { max-width: 50em; padding: 0; margin:0;}
| |
| .searchresult { max-width: 40em; }
| |
| .searchalttitle { display:none; }
| |
| .mw-search-results .titleicon { margin-right:0.3em;}
| |
|
| |
| /* Create account form - adjust for captcha size */
| |
| div#userloginForm form, div#userlogin form#userlogin2 {min-width: 302px;}
| |
|
| |
| /* editorial pages */
| |
| .mw-parser-output .helpContents-section {
| |
| position: relative;
| |
| margin: 1em 0;
| |
| padding-left: 65px;
| |
| padding-right: 30px;
| |
| }
| |
|
| |
| .mw-parser-output .helpContents-icon {
| |
| position: absolute;
| |
| left: 0;
| |
| line-height: 1;
| |
| }
| |
|
| |
| .mw-parser-output .helpContents-section h2 {
| |
| font-size: 21px;
| |
| padding: 0;
| |
| margin-top: 0.5em;
| |
| margin-bottom: 0.25em;
| |
| line-height: 1.5;
| |
| }
| |
|
| |
| /* related guides blocks - chapter landing pages */
| |
| .related-guide {
| |
| padding: 20px 0;
| |
| }
| |
| .related-guide+.related-guide {
| |
| border-top: 1px solid #e6e6e6;
| |
| }
| |
| h2+.related-guide {
| |
| margin-top: -10px;
| |
| }
| |
| .related-guide-image {
| |
| display: table-cell;
| |
| width: 140px;
| |
| }
| |
| .related-guide-image:hover {
| |
| box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
| |
| }
| |
| .related-guide-details {
| |
| display: table-cell;
| |
| vertical-align: top;
| |
| padding-left: 15px;
| |
| }
| |
| .related-guide-title {font-family: Arial Rounded MT Std Bold; font-size: 16px; margin-bottom: 0.6em; }
| |
| @media (max-width: 360px) {
| |
| .related-guide-details {
| |
| display: block;
| |
| padding: 16px 0 0;
| |
| }
| |
| }
| |
|
| |
| /* CSS to add "new" icon on homepage chapters */
| |
| .hp-chapter { position: relative; }
| |
| img.icon_new {
| |
| position: absolute;
| |
| left: 3px;
| |
| top: 3px;
| |
| }
| |
|
| |
| /* margin not needed for formulas inside tables, the padding in table cell is enough */
| |
| td > .mwe-math-element, th > .mwe-math-element {
| |
| margin: 0;
| |
| }
| |
