Bootstrap Snippet Checklist médico para Impressão using HTML CSS Bootstrap Javascript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <meta name="mobile-web-app-capable" content="yes">
      <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
      <title>Checklist</title>
      <!-- Bootstrap -->
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
      <link href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700" rel="stylesheet">
      <link href="https://fonts.googleapis.com/css?family=Encode+Sans:200" rel="stylesheet">
      <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
      <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
      <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
   </head>
   <body>
      <div class="container">
         <div class="row">
            <div class="col-md-12 mt-2">
               <div class="logo"><h2>Checklist Médico</h2></div>
            </div>
         </div>
         <div class="row">
            <div class="col-12 mt-1">
               <table class="table table-sm">
                  <tbody>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
         @media print
         {    
         .no-print, .no-print *
         {
         display: none !important;
         }
         }
         .custom-file-control:lang(en)::after {
         content: "Selecione";
         }
         .custom-file-control:lang(en)::before {
         content: "≫";
         }
         .custom-file-control {text-align: left;}
         select, input {background-color:#D6E6F4;border:0;}
         table td {height: 38px;}
         .element-white {background-color:#fff;border:0;}
         #foto {cursor: pointer;}
         .titulo {background-color:#1F4A7D;font-family:'Open Sans Condensed';font-weight:700;}
         textarea
         {
             border: 1px solid #f7f7f7;             
             margin: 2% auto;             
             resize: none;             
             background-image: -moz-linear-gradient   (top, transparent 24px, transparent 48px,#E7EFF8 0px); 
             background-image: -webkit-linear-gradient(top, transparent 24px, transparent 24px,#E7EFF8 0);            
             -webkit-background-size:  100% 50px;
             background-size: 100% 50px;
         }
         
         select{
              border: 0 !important;  /*Removes border*/
              -webkit-appearance: none;
              -moz-appearance: none;
              appearance: none;
              text-overflow:'';
              text-indent: 0.01px; /* Removes default arrow from firefox*/
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

1
2
3
4
5
6
7
8
9
10
11
12
13
        $("#foto").click(function(){
           $("#btnImagemPaciente").trigger('click');
        })
        
        window.addEventListener('load', function() {
         document.querySelector('input[type="file"]').addEventListener('change', function() {
            if (this.files && this.files[0]) {
               var img = document.getElementById('foto_preview');  // $('img')[0]
               img.src = URL.createObjectURL(this.files[0]); // set src to file url
               img.onload = imageIsLoaded; // optional onload event listener
            }
         });
      })
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

"Checklist médico para Impressão"
Bootstrap 4.0.0 Snippet by rodrigozem

Related: See More

Questions / Comments:

"Checklist médico para Impressão" Bootstrap 4.0.0 Snippet by rodrigozem

Related: See More

Questions / Comments:

"Checklist médico para Impressão"
Bootstrap 4.0.0 Snippet by rodrigozem