1
0
mirror of https://github.com/24eme/signaturepdf.git synced 2023-08-25 09:33:08 +02:00

Externalisation du css

This commit is contained in:
Vincent LAURENT 2022-01-05 01:23:37 +01:00
parent f65f77b4aa
commit c20b244dba
3 changed files with 45 additions and 28 deletions

35
public/css/app.css Normal file
View File

@ -0,0 +1,35 @@
@font-face {
font-family: 'Caveat';
font-style: normal;
font-weight: 400;
src: url(/vendor/fonts/Caveat-Regular.ttf) format('truetype');
}
#container-pages {
overflow: auto;
}
#sidebarTools {
width: 350px;
}
#sidebarTools .list-item-add label:hover {
background: #e8ebed;
border: 1px solid #505050;
}
#sidebarTools .list-item-add label:active, #sidebarTools .list-item-add label.active, #sidebarTools .list-item-add .btn-check:active + .btn-outline-secondary, #sidebarTools .list-item-add .btn-check:checked + .btn-outline-secondary {
background: #c9d1d8;
border: 1px solid #000;
box-shadow: 0 .25rem .5rem rgba(0,0,0,.075) !important;
}
#input-text-signature {
font-family: Caveat;
font-size: 48px;
}
#img-upload {
max-width: 460px;
max-height: 200px;
}

View File

@ -46,7 +46,7 @@ loadingTask.promise.then(function(pdf) {
var pdfHistory = {};
var currentScale = 1.5;
var windowWidth = window.innerWidth;
var menu = document.getElementById('offcanvasTop')
var menu = document.getElementById('sidebarTools');
var menuOffcanvas = new bootstrap.Offcanvas(menu)
var currentCursor = null;
@ -56,7 +56,7 @@ loadingTask.promise.then(function(pdf) {
var responsiveDisplay = function() {
if(is_mobile()) {
document.body.style.paddingRight = "";
document.body.style.paddingRight = "inherit";
menu.classList.remove('show');
menuOffcanvas.hide();
document.getElementById('container-pages').classList.remove('vh-100');

View File

@ -7,35 +7,17 @@
<link href="/vendor/bootstrap.min.css?5.1.1" rel="stylesheet">
<link href="/vendor/bootstrap-icons.css?1.5.0" rel="stylesheet">
<style>
@font-face {
font-family: 'Caveat';
font-style: normal;
font-weight: 400;
src: url(/vendor/fonts/Caveat-Regular.ttf) format('truetype');
}
.offcanvas .list-item-add label:hover {
background: #e8ebed;
border: 1px solid #505050;
}
.offcanvas .list-item-add label:active, .offcanvas .list-item-add label.active, .offcanvas .list-item-add .btn-check:active + .btn-outline-secondary, .offcanvas .list-item-add .btn-check:checked + .btn-outline-secondary {
background: #c9d1d8;
border: 1px solid #000;
box-shadow: 0 .25rem .5rem rgba(0,0,0,.075) !important;
}
</style>
<link href="/css/app.css" rel="stylesheet">
<title>Signature PDF</title>
</head>
<body class="bg-light" style="padding-right: 350px;">
<div style="height: 65px;" class="d-md-none"></div>
<div id="container-pages" style="overflow: auto" class="col-12 pt-1 pb-1 text-center vh-100">
<div id="container-pages" class="col-12 pt-1 pb-1 text-center vh-100">
</div>
<div style="height: 55px;" class="d-md-none"></div>
<div class="offcanvas offcanvas-end show d-none d-md-block shadow-sm" data-bs-backdrop="false" data-bs-scroll="true" data-bs-keyboard="false" tabindex="-1" id="offcanvasTop" aria-labelledby="offcanvasTopLabel" style="width: 350px;">
<div class="offcanvas offcanvas-end show d-none d-md-block shadow-sm" data-bs-backdrop="false" data-bs-scroll="true" data-bs-keyboard="false" tabindex="-1" id="sidebarTools" aria-labelledby="sidebarToolsLabel">
<div class="offcanvas-header mb-0 pb-0">
<h5 id="offcanvasTopLabel">Signature du PDF</h5>
<h5 id="sidebarToolsLabel">Signature du PDF</h5>
<button type="button" class="btn-close text-reset d-md-none" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
@ -83,7 +65,7 @@
</div>
<div class="position-fixed top-0 start-0 bg-white w-100 p-2 shadow-sm d-md-none">
<div class="d-grid gap-2">
<button id="btn_svn_select" class="btn btn-light btn-lg" data-bs-toggle="offcanvas" data-bs-target="#offcanvasTop" aria-controls="offcanvasTop"><i class="bi bi-hand-index"></i> Séléctionner une signature</button>
<button id="btn_svn_select" class="btn btn-light btn-lg" data-bs-toggle="offcanvas" data-bs-target="#sidebarTools" aria-controls="sidebarTools"><i class="bi bi-hand-index"></i> Séléctionner une signature</button>
</div>
<div id="svg_selected_container" class="text-center d-none position-relative">
<img id="svg_selected" src="" style="height: 48px;" class="img-fluid"/>
@ -120,11 +102,11 @@
<canvas id="signature-pad" class="border bg-light" width="462" height="200"></canvas>
</div>
<div class="tab-pane fade" id="nav-type" role="tabpanel" aria-labelledby="nav-type-tab">
<input id="input-text-signature" type="text" class="form-control form-control-lg" placeholder="Ma signature" style="font-family: Caveat; font-size: 48px;" />
<input id="input-text-signature" type="text" class="form-control form-control-lg" placeholder="Ma signature" />
</div>
<div class="tab-pane fade" id="nav-import" role="tabpanel" aria-labelledby="nav-import-tab">
<div class="text-center">
<img id="img-upload" class="d-none" style="max-width: 460px; max-height: 200px;" src="" />
<img id="img-upload" class="d-none" src="" />
</div>
<form id="form-image-upload" action="/image2svg" method="POST" enctype="multipart/form-data">
<input id="input-image-upload" class="form-control" name="image" type="file">