npm - @cerema/cadriciel - Versions diffs - 1.4.26 → 1.4.29 - Mend

@cerema/cadriciel 1.4.26 → 1.4.29

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1360) hide show

package/aqtion/docker/config/keycloak/themes/cerema/email/html/email-verification.ftl DELETED Viewed

@@ -1,4 +0,0 @@
-<#import "template.ftl" as layout>
-<@layout.emailLayout>
-${kcSanitize(msg("emailVerificationBodyHtml",link, linkExpiration, realmName, linkExpirationFormatter(linkExpiration),user.getFirstName()))?no_esc}
-</@layout.emailLayout>

package/aqtion/docker/config/keycloak/themes/cerema/email/html/template.ftl DELETED Viewed

@@ -1,7 +0,0 @@
-<#macro emailLayout>
-<html>
-<body>
-    <#nested>
-</body>
-</html>
-</#macro>

package/aqtion/docker/config/keycloak/themes/cerema/email/messages/messages_en.properties DELETED Viewed

@@ -1,9 +0,0 @@
-emailVerificationSubject=Verify email
-emailVerificationBody=Hello {4}.You received this email because you registered on "{2}" and we thank you for your interest.\
-  You succeeded in the first step of registration. If this was you, click the link below to verify your email \
-  address,then you''ll have to finalised your registration.\n\n{0}\n\nThis link will expire within {3} (after that, just clik on "Forgot password ?" to get a fresh link).\n\nIf you didn''t create this\
-  \ account, just ignore this message.
-emailVerificationBodyHtml=<p>Hello {4}</p><p>You received this email because you registered on "{2}" and we thank you for your interest</p>\
-  <p>You succeeded in the first step of registration. If this was you, click the link below to verify your email \
-  address.</p><p>Then, you''ll have to finalised your registration.</p> <p><a href="{0}">{0}</a></p><p>This link will expire within {3} (after that, just clik on "Forgot password ?" to get a fresh link).\
-  </p><p>If you didn''t create this account, just ignore this message.</p>

package/aqtion/docker/config/keycloak/themes/cerema/email/messages/messages_fr.properties DELETED Viewed

@@ -1,9 +0,0 @@
-emailVerificationBody=Bonjour {4}.Vous avez re\u00e7u cet email car vous souhaitez vous inscrire sur "{2}" et nous\
-  \ vous remercions pour votre int\u00e9r\u00eat. Vous avez r\u00e9alis\u00e9 la premi\u00e8re \u00e9tape, si vous \u00eates\
-  \ bien \u00e0 l''origine de cette demande, veuillez cliquer sur le lien ci-dessous.\n\n{0}\n\nCe lien expire dans {3} (si\
-  \ vous avez d\u00e9pass\u00e9 ce d\u00e9lai, cliquer sur "mot de passe oubli\u00e9" pour obtenir un nouveau lien).\n\nSinon, veuillez ignorer ce message.
-emailVerificationBodyHtml=<p>Bonjour {4}</p><p>Vous avez re\u00e7u cet email car vous souhaitez vous inscrire sur "{2}" et nous\
-  \ vous remercions pour votre int\u00e9r\u00eat.</p><p>Vous avez r\u00e9alis\u00e9 la premi\u00e8re \u00e9tape, si vous \u00eates\
-  \ bien \u00e0 l''origine de cette demande, veuillez cliquer sur le lien ci-dessous.</p><p>Ensuite, il faudra finaliser votre\
-  \ inscription.</p> <p><a href="{0}">{0}</a></p><p>Ce lien expire dans {3} (si vous avez d\u00e9pass\u00e9 ce d\u00e9lai, cliquer sur "mot de\
-  \ passe oubli\u00e9" pour obtenir un nouveau lien).</p><p>Sinon, veuillez ignorer ce message.</p>

package/aqtion/docker/config/keycloak/themes/cerema/email/theme.properties DELETED Viewed

	@@ -1 +0,0 @@
1	- parent=base

package/aqtion/docker/config/keycloak/themes/cerema/login/login-oauth-grant.ftl DELETED Viewed

@@ -1,57 +0,0 @@
-<#import "template.ftl" as layout>
-<@layout.registrationLayout bodyClass="oauth"; section>
-    <#if section = "form-header">
-        <h1 class="${properties.orionLogonFormTitleClass}">
-        <#if client.name?has_content>
-            ${msg("oauthGrantTitle",advancedMsg(client.name))}
-        <#else>
-            ${msg("oauthGrantTitle",client.clientId)}
-        </#if>
-       </h1>
-    <#elseif section = "form">
-        <div id="oauth">
-            <#if client.name?has_content>
-                ${msg("oauthGrantRequest",advancedMsg(client.name))}
-            <#else>
-                ${msg("oauthGrantRequest",client.clientId)}
-            </#if>
-            <ul>
-                <#if oauth.clientScopesRequested??>
-                    <#list oauth.clientScopesRequested as clientScope>
-                        <li style="list-style-type:square; margin-left: 20px;">
-                            <span>${advancedMsg(clientScope.consentScreenText)}</span>
-                        </li>
-                    </#list>
-                </#if>
-            </ul>
-            <form action="${url.oauthAction}" method="POST">
-                <input type="hidden" name="code" value="${oauth.code}">
-                <div class="${properties.kcFormGroupClass!}">
-                    <div id="form-options">
-                        <div class="${properties.orionOauthFormOptionsWrapperClass!}">
-                            ${msg("grantAccessConfirmation")}
-                        </div>
-                    </div>
-                    <div id="form-buttons" class="flex-c-m">
-                        <div class="orion-oauth-form-btn-container">
-                            <button class="${properties.orionFormBtnClass}" name="accept" id="login" type="submit"
-                                    value="${msg("doYes")}">
-                                ${msg("doYes")}
-                            </button>
-                        </div>
-                        <div class="orion-oauth-form-btn-container">
-                            <button class="${properties.orionFormBtnClass}" name="cancel" id="cancel" type="submit"
-                                    value="${msg("doNo")}">
-                                ${msg("doNo")}
-                            </button>
-                        </div>
-                    </div>
-                </div>
-            </form>
-            <div class="clearfix"></div>
-        </div>
-    </#if>
-</@layout.registrationLayout>

package/aqtion/docker/config/keycloak/themes/cerema/login/login-reset-password.ftl DELETED Viewed

@@ -1,32 +0,0 @@
-<#import "template.ftl" as layout>
-<@layout.registrationLayout displayInfo=true; section>
-    <#if section = "form-header">
-        <h1 class="${properties.orionLogonFormTitleClass}">
-        ${msg("emailForgotTitle")}
-      </h1>
-        <span class="${properties.orionLogonFormNoAccountClass}">
-            <a href="${url.loginUrl}">${kcSanitize(msg("backToLogin"))?no_esc}</a>
-        </span>
-    <#elseif section = "form">
-        <form id="orion-reset-password-form" action="${url.loginAction}" method="post">
-            <div id="emailInput" class="${properties.orionDefaultWrapInputClass}">
-                <span class="fa fa-envelope-o input-icon"></span>
-                <input type="text" tabindex="1" id="username" aria-describedby="label-username" class="${properties.orionDefaultInputClass}"
-                       name="username" autocomplete="off" autofocus/>
-                <span class="focus-input100"></span>
-                <span class="label-input100" id="label-username"><#if !realm.loginWithEmailAllowed>${msg("username")}<#elseif !realm.registrationEmailAsUsername>${msg("usernameOrEmail")}<#else>${msg("email")}</#if></span>
-            </div>
-            <div class="${properties.orionContainerFormBtnClass}">
-                <button type="submit" class="${properties.orionFormBtnClass}" name="submit" id="orion-submoit"
-                        type="submit" value="${msg("doSubmit")}">
-                    ${msg("doSubmit")}
-                </button>
-            </div>
-        </form>
-    <#elseif section = "info" >
-        ${msg("emailInstruction")}
-    </#if>
-</@layout.registrationLayout>

package/aqtion/docker/config/keycloak/themes/cerema/login/login.ftl DELETED Viewed

@@ -1,87 +0,0 @@
-<#import "template.ftl" as layout>
-<@layout.registrationLayout displayInfo=social.displayInfo displayWide=(realm.password && social.providers??); section>
-    <#if section = "form-header">
-        <h1 class="${properties.orionLogonFormTitleClass}">
-		    ${msg("doLogin")}
-		</h1>
-    <#elseif section = "form">
-        <#if realm.password>
-            <form id="login-form" onsubmit="login.disabled = true; return true;" action="${url.loginAction}"
-                  method="post">
-                <div id="usernameInput" class="${properties.orionEmailWrapInputClass}">
-                    <span class="fa fa-user-o input-icon"></span>
-                    <#if usernameEditDisabled??>
-                        <input tabindex="1" id="username" class="${properties.orionEmailInputClass}" type="text"
-                               name="username" value="${(login.username!'')}" disabled>
-                    <#else>
-                        <input tabindex="1" id="username" class="${properties.orionEmailInputClass}" type="text"
-                               name="username" aria-describedby="label-username" value="${(login.username!'')}" autofocus autocomplete="off">
-                    </#if>
-                    <span class="focus-input100"></span>
-                    <span class="label-input100" id="label-username">
-                        <#if !realm.loginWithEmailAllowed>${msg("username")}<#elseif !realm.registrationEmailAsUsername>${msg("usernameOrEmail")}<#else>${msg("email")}</#if>
-                    </span>
-                </div>
-                <div id="passwordInput" class="${properties.orionPasswordWrapInputClass}">
-                    <span class="fa fa-key input-icon"></span>
-                    <input tabindex="2" id="password"  aria-describedby="label-password" class="${properties.orionPasswordInputClass}" type="password"
-                           name="password" autocomplete="off">
-                    <span class="focus-input100"></span>
-                    <span class="label-input100" id="label-password">${msg("password")}</span>
-                </div>
-                <div id="form-options" class="${properties.orionLoginFormOptionsClass}">
-                    <#if realm.rememberMe && !usernameEditDisabled??>
-                        <div class="contact100-form-checkbox">
-                            <#if login.rememberMe??>
-                                <input tabindex="3" id="rememblerMe" class="input-checkbox100" type="checkbox"
-                                       name="rememberMe" checked>
-                            <#else>
-                                <input tabindex="3" id="rememblerMe" class="input-checkbox100" type="checkbox"
-                                       name="rememberMe">
-                            </#if>
-                            <label class="label-checkbox100" for="rememblerMe">
-                                ${msg("rememberMe")}
-                            </label>
-                        </div>
-                    <#else>
-                        <div></div>
-                    </#if>
-                    <#if realm.resetPasswordAllowed>
-                        <div>
-                            <a tabindex="5" href="${url.loginResetCredentialsUrl}">${msg("doForgotPassword")}</a>
-                        </div>
-                    </#if>
-                </div>
-                <div class="${properties.orionContainerFormBtnClass}">
-                    <button type="submit" class="${properties.orionFormBtnClass}" name="login" id="orion-login"
-                            type="submit" value="${msg("doLogin")}">
-                        ${msg("doLogIn")}
-                    </button>
-                </div>
-            </form>
-        </#if>
-        <#if realm.password && realm.registrationAllowed && !usernameEditDisabled??>
-            <div class="${properties.orionLogonFormNoAccountClass}">
-                <p>
-                    ${msg("noAccount")}
-                    <a tabindex="1" href="${url.registrationUrl}">${msg("goRegister")}</a>
-                </p>
-            </div>
-        </#if>
-    <#elseif section = "info" >
-        ${msg("loginInfoLine1")}<a href="https://www.cerema.fr" target="_blank"
-                                   rel="noopener noreferer">&nbsp;Cerema.</a></br>
-        ${msg("loginInfoLine2")}<a href="https://www.cerema.fr/mentions-legales" target="_blank"
-                                   rel="noopener noreferer">&nbsp;${msg("loginInfoMentionsLegales")}</a>
-    </#if>
-</@layout.registrationLayout>

package/aqtion/docker/config/keycloak/themes/cerema/login/messages/messages_fr.properties DELETED Viewed

@@ -1,29 +0,0 @@
-# SAML authentication
-saml.post-form.title=Redirection
-saml.post-form.message=Redirection en cours merci de patienter.
-saml.post-form.js-disabled=JavaScript est d\u00e9sactiv\u00e9. Il est fortement recommand\u00e9 de l''activer. Cliquez sur le bouton dessous pour continuer.
-profileScopeConsentText=Votre profil (Nom et Pr\u00e9nom)
-emailScopeConsentText=Votre adresse email
-logoCerema=Cerema, climat et territoires de demain
-doLogin=Connexion \u00e0 votre compte
-registerTitle=Cr\u00e9ez votre compte Orion Bouchon
-oauthGrantTitle=Accorder des acc\u00e8s \u00e0 {0}
-oauthGrantRequest=L''application {0} souhaite acc\u00e9der aux informations suivantes:
-grantAccessConfirmation=Souhaitez-vous autoriser ces acc\u00e8s ?
-organization=Organisme
-loginInfoLine1=Portail d''authentification edit\u00e9 et op\u00e9r\u00e9 par le
-loginInfoLine2=Consultez l''ensemble des
-loginInfoMentionsLegales=mentions l\u00e9gales
-slide1SubTitle=Facilitez vos d\u00e9veloppements
-slide1Text=Orion Bouchon vous permet de pr\u00e9parer l''int\u00e9gration de votre application avec Orion, le syst\u00e8me d''authentification centralis\u00e9e du Cerema
-slide2SubTitle=Une \u00c9quipe \u00e0 votre service
-slide2Text=Pour toute question concernant Orion (Prod, Recette ou Bouchon), vous pouvez contacter l''\u00c9quipe Orion par mail : ppnm.s3i.dsi.sg.cerema@cerema.fr
-lienFranceConnect=Qu''est-ce-que FranceConnect ?
-lienAgentConnect=Qu''est-ce-que AgentConnect ?
-titreAgentConnect=Utiliser AgentConnect
-texteAgentConnect=AgentConnect permet aux agents de l''\u00c9tat de se connecter avec leur compte professionnel.
-titreFranceConnect=Utiliser FranceConnect
-texteFranceConnect=FranceConnect est la solution propos\u00c9e par l''\u00c9tat aux particuliers pour simplifier la connexion \u00e0 vos services en ligne.
-titreNoAccount=Cr\u00e9er un compte Orion Bouchon
-noAccount=Vous \u00eates un nouvel utilisateur ?
-goRegister=Cr\u00e9ez votre compte

package/aqtion/docker/config/keycloak/themes/cerema/login/register.ftl DELETED Viewed

@@ -1,169 +0,0 @@
-<#import "template.ftl" as layout>
-<@layout.registrationLayout; section>
-    <#if section = "form-header">
-        <h1 class="${properties.orionLogonFormTitleClass}">
-                    ${msg("registerTitle")}
-        </h1>
-        <span class="${properties.orionLogonFormNoAccountClass}">
-            <a href="${url.loginUrl}">${kcSanitize(msg("backToLogin"))?no_esc}</a>
-        </span>
-    <#elseif section = "form">
-        <form id="register-form" action="${url.registrationAction}" method="post">
-            <div id="firstNameInput" class="${properties.orionDefaultWrapInputClass}">
-                <span class="fa fa-user input-icon"></span>
-                <input type="text" tabindex="1" id="firstName" aria-describedby="label-firstName" class="${properties.orionDefaultInputClass}"
-                       name="firstName" autocomplete="off" value="${(register.formData.firstName!'')}">
-                <span class="focus-input100"></span>
-                <span class="label-input100" id="label-firstName">${msg("firstName")}</span>
-            </div>
-            <div id="lastNameInput" class="${properties.orionDefaultWrapInputClass}">
-                <span class="fa fa-user input-icon"></span>
-                <input type="text" tabindex="2" id="lastName" aria-describedby="label-lastName" class="${properties.orionDefaultInputClass}"
-                       name="lastName" autocomplete="off" value="${(register.formData.lastName!'')}">
-                <span class="focus-input100"></span>
-                <span class="label-input100" id="label-lastName">${msg("lastName")}</span>
-            </div>
-            <div id="organizationInput" class="${properties.orionDefaultWrapInputClass}">
-                <span class="fa fa-industry input-icon"></span>
-                <input type="text" tabindex="3" id="organization" aria-describedby="label-organization" class="${properties.orionDefaultInputClass}"
-                       name="user.attributes.organization" autocomplete="off"
-                       value="${(register.formData.organization!'')}">
-                <span class="focus-input100"></span>
-                <span class="label-input100" id="label-organization">${msg("organization")}</span>
-            </div>
-            <div id="emailInput" class="${properties.orionDefaultWrapInputClass}">
-                <span class="fa fa-envelope-o input-icon"></span>
-                <input type="text" tabindex="4" id="email" aria-describedby="label-email" class="${properties.orionDefaultInputClass}" name="email"
-                       autocomplete="off" value="${(register.formData.email!'')}">
-                <span class="focus-input100"></span>
-                <span class="label-input100" id="label-email">${msg("email")}</span>
-            </div>
-            <#if !realm.registrationEmailAsUsername>
-                <div id="userNameInput" class="${properties.orionDefaultWrapInputClass}">
-                    <span class="fa fa-user input-icon"></span>
-                    <input type="text" tabindex="5" id="username" aria-describedby="label-username" class="${properties.orionDefaultInputClass}"
-                           name="username" autocomplete="username" value="${(register.formData.username!'')}">
-                    <span class="focus-input100"></span>
-                    <span class="label-input100" id="label-username">${msg("username")}</span>
-                </div>
-            </#if>
-            <#if passwordRequired>
-                <div id="passwordInput" class="${properties.orionPasswordWrapInputClass}">
-                    <span class="fa fa-unlock input-icon"></span>
-                    <input type="password" tabindex="6" id="password" aria-describedby="label-password" class="${properties.orionPasswordInputClass}"
-                           name="password" autocomplete="new-password">
-                    <span class="focus-input100"></span>
-                    <span class="label-input100" id="label-password">${msg("password")}</span>
-                </div>
-                <div id="passwordConfirm" class="${properties.orionPasswordWrapInputClass}">
-                    <span class="fa fa-check input-icon"></span>
-                    <input type="password" tabindex="7" id="password-confirm" aria-describedby="label-confirmpwd"
-                           class="${properties.orionPasswordInputClass}" name="password-confirm">
-                    <span class="focus-input100"></span>
-                    <span class="label-input100" id="label-confirmpwd">${msg("passwordConfirm")}</span>
-                </div>
-            </#if>
-            <#if recaptchaRequired??>
-                <div class="form-group">
-                    <div class="${properties.kcInputWrapperClass!}">
-                        <div class="g-recaptcha" data-size="compact" data-sitekey="${recaptchaSiteKey}"></div>
-                    </div>
-                </div>
-            </#if>
-            <div class="${properties.orionContainerFormBtnClass}">
-                <button type="submit" class="${properties.orionFormBtnClass}" name="register" id="orion-register"
-                        type="submit" value="${msg("doRegister")}">
-                    ${msg("doRegister")}
-                </button>
-            </div>
-        </form>
-        <#if realm.password && social.providers??>
-            <div class="orion-separator ">
-                <span>OU</span>
-            </div>
-            <#list social.providers as p>
-                <#if p.alias = "cerema">
-                    <div class="orion-container-form-btn">
-                        <button type="button" class="orion-form-cerema-btn" onclick="location.href='${p.loginUrl}'"
-                                id="zocial-${p.alias}">
-                            <img src="${url.resourcesPath}/images/white_logo.png"/>
-                            Connexion des agents du Cerema
-                        </button>
-                    </div>
-                </#if>
-            </#list>
-            <#list social.providers as p>
-                <#if (p.alias = "AgentConnectRie"|| p.alias = "AgentConnectIntegrationRie")>
-                    <div class="orion-form-identitypartner-item" id="boutonAgentConnectRie">
-                        <h2 class="${properties.orionLogonFormTitleClass}">${msg("titreAgentConnect")}</h2>
-                        <p class="orion-identitypartner-explication">${msg("texteAgentConnect")}</p>
-                        <a href="${p.loginUrl}" id="zocial-${p.alias}">
-                            <input class="bouton-ac" alt="S'identifier avec AgentConnect"/>
-                        </a>
-                        <a href="https://agentconnect.gouv.fr/" class="orion-partner-description-link"
-                           target="_blank" rel="noopener noreferer">
-                            ${msg("lienAgentConnect")}
-                        </a>
-                    </div>
-                </#if>
-                <#if (p.alias = "AgentConnect"|| p.alias = "AgentConnectIntegration")>
-                    <div class="orion-form-identitypartner-item" id="boutonAgentConnectInternet">
-                        <h2 class="${properties.orionLogonFormTitleClass}">${msg("titreAgentConnect")}</h2>
-                        <p class="orion-identitypartner-explication">${msg("texteAgentConnect")}</p>
-                        <a href="${p.loginUrl}" id="zocial-${p.alias}">
-                            <input class="bouton-ac" alt="S'identifier avec AgentConnect"/>
-                        </a>
-                        <a href="https://agentconnect.gouv.fr/" class="orion-partner-description-link"
-                           target="_blank" rel="noopener noreferer">
-                            ${msg("lienAgentConnect")}
-                        </a>
-                    </div>
-                </#if>
-            </#list>
-            <script>
-                if (window.location.href.includes("cerema.e2.rie.gouv.fr")){
-                    document.getElementById("boutonAgentConnectInternet").classList.add("cached");
-                }else{
-                    document.getElementById("boutonAgentConnectRie").classList.add("cached");
-                }
-            </script>
-            <#list social.providers as p>
-                <#if (p.alias = "FranceConnect"|| p.alias = "FranceConnectIntegration")>
-                    <div class="orion-separator ">
-                        <span>OU</span>
-                    </div>
-                    <div class="orion-form-identitypartner-item">
-                        <h2 class="${properties.orionLogonFormTitleClass}">${msg("titreFranceConnect")}</h2>
-                        <p class="orion-identitypartner-explication">${msg("texteFranceConnect")}</p>
-                        <a href="${p.loginUrl}" id="zocial-${p.alias}">
-                            <input class="bouton-fc" alt="S'identifier avec FranceConnect"/>
-                        </a>
-                        <a href="https://franceconnect.gouv.fr/" class="orion-partner-description-link"
-                           target="_blank" rel="noopener noreferer">
-                            ${msg("lienFranceConnect")}
-                        </a>
-                    </div>
-                </#if>
-            </#list>
-        </#if>
-    </#if>
-</@layout.registrationLayout>

package/aqtion/docker/config/keycloak/themes/cerema/login/resources/css/bamboo.css DELETED Viewed

@@ -1,238 +0,0 @@
-.bamboo {
-    position: relative;
-    z-index: 0;
-    overflow: hidden;
-    font-size: 16px;
-}
-.bamboo > .slides {
-    position: relative;
-    z-index: 0;
-    margin: 0;
-    padding: 0;
-    list-style: none;
-}
-.bamboo > .slides > .slide {
-    z-index: 0;
-    overflow: hidden;
-    box-sizing: border-box;
-}
-.bamboo > .bamboo-dots {
-    position: absolute;
-    z-index: 5;
-    bottom: 5%;
-    left: 50%;
-    margin: 0px;
-    padding: 0px;
-    list-style: none;
-    transform: translateX(-50%);
-}
-.bamboo > .bamboo-dots > * {
-    float: left;
-    width: 10px;
-    height: 10px;
-    margin: 2px 6px;
-    transition: 0.4s ease;
-    vertical-align: middle;
-    border-radius: 50%;
-    background: rgba(255, 255, 255, 0.8);
-    cursor: pointer;
-}
-.bamboo > .bamboo-dots > *:hover {
-    background: rgba(255, 0, 0, 0.6);
-}
-.bamboo > .bamboo-dots > *.focus {
-    background: rgba(255, 0, 0, 0.6);
-}
-.bamboo > .bamboo-prev {
-    position: absolute;
-    z-index: 5;
-    top: 48%;
-    left: 0;
-    width: 20px;
-    height: 30px;
-    transform: translateY(-50%);
-    opacity: 0.9;
-    background-color: rgba(0, 0, 0, .4);
-    background-repeat: no-repeat;
-    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYBAMAAAA46dFkAAAAIVBMVEUAAAD////////////////////////////////////////PIev5AAAACnRSTlMAENBgILDw38AwqDDuigAAACpJREFUCNdjAAOhFDDFqLUEwl1lAOEuJpvLEAXkQmm4OEwd5QIrIQISJQCMdBRInmiflAAAAABJRU5ErkJggg==');
-    background-position: 50% 48%;
-    background-size: 6px;
-}
-.bamboo > .bamboo-next {
-    position: absolute;
-    z-index: 5;
-    top: 48%;
-    right: 0;
-    width: 20px;
-    height: 30px;
-    transform: translateY(-50%);
-    opacity: 0.9;
-    background-color: rgba(0, 0, 0, .4);
-    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAYBAMAAAA46dFkAAAAIVBMVEUAAAD////////////////////////////////////////PIev5AAAACnRSTlMAENBgILDw38AwqDDuigAAAClJREFUCNdjcG9kAINZiwTANPMqRYiAFTUElsJomDhMHdlcL6gdbhAuAPqSFKIdy8kGAAAAAElFTkSuQmCC');
-    background-repeat: no-repeat;
-    background-position: 50% 48%;
-    background-size: 6px;
-}
-.bamboo.roll {
-}
-.bamboo.roll > .slides {
-    position: relative;
-    height: 100%;
-    transition: 0.2s ease;
-}
-.bamboo.roll > .slides > * {
-    float: left;
-    overflow: hidden;
-}
-.bamboo.roll-horizontal > .slides {
-    font-size: 0px;
-    white-space: nowrap;
-}
-.bamboo.roll-horizontal > .slides > * {
-    display: inline-block;
-    float: none;
-    font-size: 12px;
-}
-.bamboo.fade {
-}
-.bamboo.fade > .slides > * {
-    position: absolute;
-    top: 0;
-    left: 0;
-    transition: opacity 0.6s;
-}
-.bamboo.into {
-}
-.bamboo.into > .slides {
-    position: relative;
-    z-index: 0;
-}
-.bamboo.into > .slides > * {
-    position: absolute;
-    top: 0;
-    left: 0;
-    transition: transform 0.4s linear;
-}
-.bamboo.into > .bamboo-dots {
-    top: 50%;
-    right: 10px;
-    bottom: auto;
-    left: auto;
-    width: 15px;
-    transform: translateY(-50%);
-}
-.bamboo.into > .bamboo-dots > * {
-    margin: 5px 0;
-}
-.bamboo.into > .bamboo-prev {
-    top: 2px;
-    left: 50%;
-    transform: rotate(-90deg);
-    background-color: rgba(0, 0, 0, 0);
-    background-size: 12px;
-    /* filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.1)); */
-}
-.bamboo.into > .bamboo-next {
-    top: auto;
-    bottom: 2px;
-    left: 50%;
-    transform: rotate(-90deg);
-    background-color: rgba(0, 0, 0, 0);
-    background-size: 12px;
-    /* filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.1)); */
-}
-.bamboo.blinds {
-}
-.bamboo.blinds > .slides > * {
-    position: absolute;
-    top: 0;
-    left: 0;
-}
-.bamboo.blinds > .tempSlide {
-    position: relative;
-    z-index: 2;
-}
-.bamboo.blinds > .tempSlide > div {
-    position: absolute;
-    top: 0;
-    left: 0;
-    float: left;
-    overflow: hidden;
-    transition: 0.4s ease-out;
-    list-style: none;
-}
-.bamboo.blinds > .tempSlide > div > * {
-    position: absolute;
-    top: 0px;
-    left: 0px;
-}
-.bamboo.square {
-}
-.bamboo.square > .slides > * {
-    position: absolute;
-    top: 0;
-    left: 0;
-}
-.bamboo.square > .tempSlide {
-    position: relative;
-}
-.bamboo.square > .tempSlide > div {
-    position: relative;
-    float: left;
-    overflow: hidden;
-    transition: 0.1s ease-out;
-    -webkit-transform: translate3d(0, 0, 0);
-    transform: translate3d(0, 0, 0);
-    list-style: none;
-}
-.bamboo.square > .tempSlide > div > * {
-    position: absolute;
-    top: 0px;
-    left: 0px;
-}
-.bamboo .fit-img {
-    position: relative;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-}