Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Image Added


Totvs custom background color
customcolor#0897E9

HTML
<style type="text/css">
    .

...

lms * {
      

...

-webkit-box-sizing: 

...

border-box;
      

...

-moz-box-sizing: 

...

border-box;
      

...

box-sizing: 

...

border-box;
    }

    

...

.lms-text-center {
      

...

text-

...

align: 

...

center;
    }

    

...

.lms-full-height {
      

...

height: 

...

100%;
    }

    .

...

lms-container {
      

...

margin-right: 

...

auto;
      

...

margin-left: auto;
      

...

max-width: 

...

1046px;
    }

    

...

.lms-row {
	  width: 100%;
      display: -moz-box;
    

...

  -moz-flex-flow: 

...

row wrap;
      

...

-moz-justify-content: 

...

center;

    

...

  

...

display: -ms-flexbox;
      

...

-ms-flex-flow: row wrap;
      

...

-ms-justify-content: 

...

center;

...

     

...

 

...


...

      

...

display: 

...

-

...

webkit-flex;
      display: -webkit-box;
      

...

-

...

webkit-

...

flex-

...

flow: row 

...

wrap;

...

  

...

    

...

-

...

webkit-

...

justify-

...

content: center;

      

...

display: 

...

flex;
      

...

flex-

...

flow: 

...

row wrap;

...

      
   

...

   justify-content: 

...

center;

...

     

...



    }

    .

...

lms-

...

col {
      width: 

...

33.333333%;
      padding-right: 20px;
      padding-left: 

...

20px;
      margin-bottom: 

...

40px;
    }

    .

...

lms-

...

panel {
      border: 1px 

...

solid 

...

#dadada;
      

...

border-

...

radius: 

...

4px;
      

...

padding: 

...

30px;
    }

    

...

.lms-panel .lms-panel-thumb {
      

...

width: 

...

87px;
    }

    

...

.lms-panel .lms-panel-title {
      

...

font-

...

size: 

...

20px;
      

...

color: 

...

#58595b;
    }

    

...

.lms-panel .lms-panel-title > a {
      color: #58595b;
      

...

font-

...

weight: 

...

bold;
    }

    .

...

lms-panel .lms-panel-text {
      

...

color: 

...

#58595b;
      

...

line-

...

height: 

...

1.75;
      

...

margin-

...

bottom: 

...

0;
    }
.teste{
   

...

position: absolute;
    top: 

...

0;
    left: 0;
    

...

width: 

...

100%;
    

...

height: 100%;

...

    

...

object-fit: cover;
    opacity: 0.5; /* ajuste a 

...

opacidade 

...

conforme 

...

necessário 

...

*/
 

...

 

...

  z-index: -1; 
}
  </style>

...

<div class="lms">   
<div class="

...

lms-container">
    

...

<div>
      <img src="https://cdn-icons-png.flaticon.com/512/1809/1809239.png" /
      class="teste">
    </div>   

...

   
 <div class="lms-row">
          <div class="

...

lms-col">
          <div class="lms-panel lms-text-center lms-full-height">
            <img class="lms-panel-thumb" src="https://tdn.totvs.com/download/

...

thumbnails/

...

811721444/o%20que%20ha%20de%20novo.png?api=v2&nonce=1709753316058">
            <h1 

...

class="lms-panel-title">
        

...

    

...

 

...

 <a href="https://tdn.totvs.com/pages/viewpage.action?pageId=828866286">O que há de novo?</a>
        

...

 

...

   </h1>
     

...

 

...

      

...

<p class="lms-panel-text">Fique por dentro das novidades do produtos TOTVS Saúde Hospitais e Clínicas.</p>
    

...

    

...

 

...

 </div>         </div>
  

...

 

...

     <div class="lms-col">
  

...

 

...

       

...

<div class="lms-panel lms-text-center lms-full-height">
        

...

 

...

   <img 

...

class="lms-panel-thumb" src="https://tdn.totvs.com/download/thumbnails/811721444/TOTVS.png?api=v2&nonce=1709753270308">
         

...

 

...

 

...

 

...

<h1 class="lms-panel-title">
        

...

 

...

    

...

 

...

<a href="https://tdn.totvs.com/display/LRM/Linha+RM+Saúde">Linha RM Saúde</a>
        

...

 

...

   </h1>
     

...

 

...

    

...

  

...

<p class="lms-panel-text">Toda documentação do RM em um único lugar.</p>
          

...

</div>
        

...

</div>
		<div class="lms-col">
        

...

 

...

 <div class="lms-panel 

...

lms-text-center lms-full-height">
    

...

    

...

 

...

   <img 

...

class="lms-panel-thumb" src="https://tdn.totvs.com/download/thumbnails/811721444/pep.png?api=v2&nonce=1710529421428">
            <h1 class="lms-panel-title">
    

...

 

...

        

...

 <a href="https://tdn.totvs.com/display/LRM/PEP+RM">PEP RM</a>
        

...

 

...

   </h1>
     

...

 

...

    

...

  

...

<p class="lms-panel-text">O passo a passo de como utilizar o Prontuário Eletrônico do paciente.</p>
          </div>
        

...

</div>
        

...

<div class="lms-col">
       

...

 

...

  <div class="lms-panel 

...

lms-text-center lms-full-height">
        

...

 

...

   

...

<img class="lms-panel-thumb" src="https://tdn.totvs.com/download/thumbnails/811721444/pep-1.png?api=v2&nonce=1709753316056">
        

...

 

...

   

...

<h1 class="lms-panel-title">
       

...

 

...

 

...

     

...

<a href="https://tdn.totvs.com/display/LRM/Portais">Portais</a>
           

...

 </h1>
        

...

 

...

   

...

<p class="lms-panel-text">Confira na integra tudo sobre os Portais.</p>
          </div>
        </div>
		<div class="lms-col">
        

...

  

...

<div class="lms-panel lms-text-center lms-full-height">
            

...

<img class="

...

lms-panel-thumb" src="https://tdn.totvs.com/download/thumbnails/811721444/SUS.png?api=v2&nonce=1709753316055">
           

...

 <h1 class="

...

lms-

...

panel-

...

title">

...

              <a href="https://

...

totvscst.

...

zendesk.com/

...

hc/

...

pt-br/#home">Central de atendimento</a>
            </

...

h1>
            <p class="

...

lms-panel-text">Tem alguma dúvida ou sugestão? Entre em contato com nossa central de atendimento.</p>
          </div>
        </div>
      </div>
    </

...

div>
</div>