Browse Source

add cgi-bin

add product details
feature/buy
Dslak 5 years ago
parent
commit
d1539518f2
  1. 9
      cgi-bin/conn.conn
  2. 162
      cgi-bin/functions.inc
  3. 4
      cgi-bin/params.inc
  4. 6
      components/breadcrumb/breadcrumb.html
  5. 82
      components/buy/buy.html
  6. 29
      components/buy/buy.js
  7. 198
      components/buy/buy.scss
  8. 8
      components/header/header.html
  9. 22
      components/sectionHeader/sectionHeader.html
  10. BIN
      images/products/1.png
  11. BIN
      images/products/2.png
  12. BIN
      images/products/3.png
  13. 38
      pages/index.ejs
  14. BIN
      src/fonts/066ce24dae3730ed6c648b09efaea93a.eot
  15. BIN
      src/fonts/066ce24dae3730ed6c648b09efaea93a.ttf
  16. BIN
      src/fonts/066ce24dae3730ed6c648b09efaea93a.woff2
  17. BIN
      src/fonts/icomoon.eot
  18. 9
      src/fonts/icomoon.svg
  19. BIN
      src/fonts/icomoon.ttf
  20. BIN
      src/fonts/icomoon.woff
  21. 2
      src/fonts/selection.json
  22. 10
      src/scss/forms.scss
  23. 11
      src/scss/icons.scss
  24. 13
      webpack.config.js

9
cgi-bin/conn.conn

@ -0,0 +1,9 @@
<?php
$DATAhst="localhost";
$DATAusr="root";
$DATApwd="root";
$DATAdtb="iolovolio";
?>

162
cgi-bin/functions.inc

@ -0,0 +1,162 @@
<?php
function conv_date($od){
$tmp=explode("-",substr($od,0,10));
$stres = $tmp[2]."/".$tmp[1]."/".$tmp[0]."";
return $stres;
}
function convert($stringa){
$strres = $stringa;
$strres = str_replace("'","&#039;",$strres);
return stripslashes(nl2br($strres));
}
function convert_mce($stringa){
$strres = $stringa;
$strres = str_replace("'","&#039;",$strres);
return stripslashes($strres);
}
function conv_url($text){
$entities = array('+','%21', '%2A', '%27', '%28', '%29', '%3B', '%3A', '%40', '%26', '%3D', '%2B', '%24', '%2C', '%2F', '%3F', '%25', '%23', '%5B', '%5D');
$replacements = array('-','_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_', '_',);
return str_replace($entities, $replacements, urlencode($text));
}
function save_photo($foto,$basepath,$id){
$filename = $foto;
// Get new sizes
list($width, $height) = getimagesize($filename);
$percent=800/$width;
$newwidth = $width * $percent;
$newheight = $height * $percent;
// Load
$thumb = imagecreatetruecolor($newwidth, $newheight);
switch(exif_imagetype($filename)){
case 1:
$source = imagecreatefromgif($filename);
break;
case 2:
$source = imagecreatefromjpeg($filename);
break;
case 3:
$source = imagecreatefrompng($filename);
break;
}
// Resize
imagecopyresized($thumb, $source, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);
// Output
imagejpeg($thumb, $basepath."$id.jpg");
// echo $basepath."$id.jpg";
}
/*
function sendMail($SM_email,$SM_email2,$SM_email_CC,$SM_subject,$SM_message,$SM_showalert,$SM_append){
$host=$GLOBALS['BASE_URL']."";
$send_date=conv_date(date("Y-m-d"));
$top=<<<ttop
<html><head><style>
body{font-family: sans, Arial; margin: 0px; font-size: 10pt;}
td{font-family: sans-serif; font-size: 10pt;}
</style><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></head><body bgcolor="#4e984a"><center>
<table border="0" width="720" cellspadding="20">
<tr><td align="center" colspan="2">
<img src="$host/images/logo-white.png" alt="Ordine dei Farmacisti di Salerno" width="150"><br><br></td></tr>
<tr><td align="left" style="padding:5px; color: white" ><b>$SM_subject</b></td>
<td align="right" style="padding:5px; color: white" >$send_date</td></tr>
<tr><td style="border-top: 8px solid #FFFFFF;border-left: 1px solid #FFFFFF;border-right: 1px solid #FFFFFF;border-bottom: 8px solid #FFFFFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px; padding:10px;line-height:23px" bgcolor="white" colspan="2">
ttop;
$bottom="</td></tr>";
$bottom.="<tr><td colspan=\"2\" align=\"center\" style=\"text-align:justify; font-size:8pt; color: white\"><br>".
"Questa e-mail contiene informazioni di propriet&agrave; e di natura confidenziale. Se non siete il destinatario corretto di questo messaggio, vi ricordiamo che ogni diffusione, distribuzione o copia di questo messaggio &egrave; severamente proibita. Se avete ricevuto questo messaggio per errore, siete pregati di cancellarlo immediatamente. Quanto precede ai fini del rispetto del D.L. n. 196/03 sulla tutela dei dati personali.<br>-<br>".
"This e-mail (and any attachments) is strictly confidential and for use only by intendend recipients. If you are not an intended recipients, we point you that any diffusion, distribution or copy of this message is severely forbidden. If you have received t his message by mistake please destroy it immediately (under the observance of D.L. n. 196/03 which protects personal data).".
"<br>Rispetta l'ambiente. Non stampare questa mail se non &egrave; necessaria.";
$bottom.="</td></tr></table></center></body></html>";
$headers = "From: \"Ordine dei Farmacisti di Salerno\" <info@ordinefarmacistisalerno.itt> \n";
$headers .= "MIME-Version: 1.0\n";
$msg="";
if($SM_append){
$append_name = basename($SM_append);
$append_type = mime_content_type($SM_append);
$data = chunk_split(base64_encode(file_get_contents($SM_append)));
$semi_rand = md5(time());
$mime_boundary = "==Multipart_Boundary_x{$semi_rand}x";
$headers .= "Content-Type: multipart/mixed;\n";
$headers .= " boundary=\"{$mime_boundary}\"\n";
$headers .= "X-Mailer: PHP " . phpversion();
$msg .= "This is a multi-part message in MIME format.\n\n";
$msg .= "--{$mime_boundary}\n";
$msg .= "Content-Type: text/html; charset=\"iso-8859-1\"\n";
$msg .= "Content-Transfer-Encoding: 7bit\n\n";
$msg .= $top.$SM_message.$bottom."\n\n";
$msg .= "--{$mime_boundary}\n";
$msg .= "Content-Type: {$append_type}; name=\"{$append_name}\"\n";
$msg .= "Content-Transfer-Encoding: base64\n";
$msg .= "Content-Disposition: attachment; filename=\"{$append_name}\"\n\n";
$msg .= $data."\n\n";
$msg .= "--{$mime_boundary}--\n";
}else{
$headers .= "Content-Type: text/html; charset=\"iso-8859-1\"\n";
$msg = $top.$SM_message.$bottom."\n\n";
}
if(@mail(trim($SM_email),$SM_subject,$msg, $headers)){
if(@$SM_email2){
if($SM_email_CC){
$headers = "Bcc: $SM_email_CC \n".$headers;
}
@mail(trim($SM_email2),$SM_subject,$msg, $headers)or die("errore invio mail");
}
if($SM_showalert){
echo "<br><center><h1><i class=\"fa fa-check\"></i></h1><h2>E-mail inviata correttamente</h2><br></center>";
}
}else{
if($SM_showalert){
echo "<br><br><br><center><h1><i class=\"fa fa-exclamation-triangle\"></i></h1><h2>ERRORE:</h2><br>".
"Si &egrave; verificato un errore nell'invio della mail.<br>".
"Si prega contattare l'amministratore del sistema.</center>";
}
}
$of=fopen("../mailoutput.html","w");
fwrite($of, "Email:".$SM_email."\n<br>Email:".$SM_email2."\n<br>Email CC:".$SM_email_CC."\n<br>Subject:".$SM_subject."\n<br><br>CONTENT:\n".$msg);
fclose($of);
}
*/
?>

4
cgi-bin/params.inc

@ -0,0 +1,4 @@
<?php
$BASE_URL="http://".$_SERVER['HTTP_HOST']."";
$ROOT = realpath($_SERVER["DOCUMENT_ROOT"]);
?>

6
components/breadcrumb/breadcrumb.html

@ -1,6 +1,8 @@
<?php
switch($_GET['q']) {
$levels = array();
switch($getQ[0]) {
case 'raccontare':
$levels[0] = array('raccontare', '/raccontare');
break;
@ -12,6 +14,7 @@
break;
case 'acquistare':
$levels[0] = array('acquistare', '/acquistare');
if($getQ[1]) {$levels[1] = array($getQ[2], '/acquistare/'.$getQ[1].'/'.$getQ[2]);}
break;
case 'due-cucchiai-di-salute':
@ -37,6 +40,7 @@
</li>
<?php
foreach($levels as $level) {
echo '<li class="item"> <a class="link" href="'.$level[1].'">'.$level[0].'</a></li>';
}

82
components/buy/buy.html

@ -1,8 +1,88 @@
<?php
@include('components/breadcrumb/breadcrumb.php');
setlocale(LC_MONETARY, 'it_IT.UTF-8');
?>
<div class="component-buy">
<div class="row no-gutters">
<?php
if($getQ[1]) {
$q = mysqli_query($conn, "SELECT * FROM products WHERE id=".$getQ[1]);
$r = mysqli_fetch_array($q);
?>
<div class="content">
<div class="container">
<div class="row details">
<div class="col-12 col-md-6">
<div class="image-container">
<img class="image" src="<?= '/images/products/'.$r['id'].'.png';?>">
</div>
</div>
<div class="col-12 col-md-6">
<span class="type"><?= $r['type'];?></span>
<span class="name"><?= $r['name'];?></span>
<span class="description"><?= $r['description'];?></span>
<div class="items">
<div class="item">
<span class="label">Format</span>
<span class="value"><?= $r['format'];?></span>
</div>
<div class="item">
<span class="label">Biologico</span>
<span class="value"><?= $r['bio'] ? 'Si' : 'No';?></span>
</div>
<div class="item">
<span class="label">Annata</span>
<span class="value"><?= $r['year'];?></span>
</div>
</div>
<span class="price"><?= money_format('%.2n',$r['price']);?></span>
<div class="add-container">
<div class="qty-container">
<input class="qty" type="number" min="0" step="1" pattern="[\d]{9}"" value="1">
<button class="plus icon-plus"></button>
<button class="minus icon-minus"></button>
</div>
<button class="button button-brown add-to-cart">
<span class="icon icon-buy my-auto ml-auto mr-1"></span>
<span class="my-auto mr-auto ml-1">aggiungi</a>
</button>
</div>
</div>
</div>
</div>
</div>
<?php
}
?>
<div class="content <?= $getQ[1] ? 'has-detail' : '';?>">
<div class="container">
<div class="row">
<?php
$q = mysqli_query($conn, "SELECT * FROM products");
while($r = mysqli_fetch_array($q)){
?>
<div class="col-12 col-md-4">
<div class="box">
<a href="/acquistare/<?= $r['id'];?>/<?= $r['name'];?>">
<img class="image" src="<?= '/images/products/'.$r['id'].'.png';?>">
<span class="type"><?= $r['type'];?></span>
<span class="name"><?= $r['name'];?></span>
<span class="price"><?= money_format('%.2n',$r['price']);?></span>
</a>
</div>
</div>
<?php
}
?>
</div>
</div>
</div>
</div>

29
components/buy/buy.js

@ -2,4 +2,31 @@
$(document).ready( () => {
console.log('Load component - buy')
})
const component = $('.component-buy')
if(component.length) {
const details = component.find('.details')
if(details.length) {
const qty = details.find('.qty')
const plus = details.find('.plus')
const minus = details.find('.minus')
qty.on('input', (e) => { $(e.currentTarget).val($(e.currentTarget).val().replace(/[^0-9]/g, '') || 1) })
plus.off('.click').on('click.click', () => {
const value = parseInt(qty.val())
qty.val(value + 1)
})
minus.off('.click').on('click.click', () => {
const value = parseInt(qty.val())
if(value > 1) {
qty.val(value - 1)
}
})
}
}
})

198
components/buy/buy.scss

@ -2,6 +2,202 @@
@import "../../src/scss/mixins.scss";
.component-buy {
padding-top: $header-height-mobile+60px;
padding: 30px 0;
.content {
width: 100%;
.box {
display: block;
width: 100%;
height: 100%;
background: $white;
padding: 30px 0;
.image {
display: block;
height: 150px;
margin: auto;
padding: 0 0 20px 0;
}
.type {
display: block;
text-align: center;
@include font-style($font-serif, 'regular', $font-16);
color: $brown;
line-height: $font-22;
}
.name {
display: block;
text-align: center;
@include font-style($font-serif, 'regular', $font-24);
color: $olive-dark;
line-height: $font-32;
}
.price {
display: block;
text-align: center;
@include font-style($font-serif, 'regular', $font-20);
color: $brown;
line-height: $font-38;
}
}
.details {
padding: 0 0 40px 0;
.image-container{
display: block;
width: 100%;
margin: auto;
padding: 40px;
background: $white;
.image {
display: block;
width: 30%;
margin: auto;
}
}
.type {
display: block;
text-align: left;
@include font-style($font-serif, 'regular', $font-16);
color: $brown;
line-height: $font-22;
padding-top: 30px;
}
.name {
display: block;
text-align: left;
@include font-style($font-serif, 'regular', $font-44);
color: $olive-dark;
line-height: $font-60;
padding-bottom: 24px;
}
.description {
display: block;
text-align: left;
@include font-style($font-sans, 'regular', $font-18);
color: $gray;
line-height: $font-24;
}
.price {
display: block;
text-align: left;
@include font-style($font-serif, 'regular', $font-28);
color: $brown;
line-height: $font-38;
padding-top: 28px;
}
.items {
display: block;
width: 100%;
padding-top: 28px;
.item {
display: block;
width: 50%;
padding: 3px 0;
.label,
.value {
@include font-style($font-sans, 'regular', $font-18);
color: $gray;
line-height: $font-24;
text-transform: uppercase;
}
.value {
text-transform: none;
float: right;
}
}
}
.price {
display: block;
text-align: left;
@include font-style($font-serif, 'regular', $font-28);
color: $brown;
line-height: $font-38;
padding-top: 28px;
}
.add-container {
display: block;
padding-top: 28px;
.qty-container {
position: relative;
display: inline-block;
float: left;
width: calc(50% - 4px);
.qty {
appearance: none;
-moz-appearance: textfield;
&:-webkit-inner-spin-button {
appearance: none;
}
text-align: center;
}
.plus,
.minus {
position: absolute;
appearance: none;
background: none;
padding: 0;
margin: 0;
border: 0;
top: 10px;
left: 10px;
font-size: $font-20;
color: $gray;
}
.plus {
left: initial;
right: 10px;
}
}
.add-to-cart {
position: relative;
display: inline-flex;
float: right;
height: 48px;
padding: 0;
@include font-style($font-serif, 'regular', $font-28);
width: calc(50% - 4px);
}
}
}
&.has-detail {
background: $white;
}
}
}
@media (min-width: map-get($grid-breakpoints, 'md')) {
.component-buy {
.content {
.details {
.image-container{
width: calc(100% - 40px);
}
}
}
}
}

8
components/header/header.html

@ -17,16 +17,16 @@
</span>
<ul class="menu">
<li class="item <?php if($_GET['q'] == 'conoscere') { echo "active";}?>">
<li class="item <?php if($getQ[0] == 'conoscere') { echo "active";}?>">
<a href="/conoscere" class="label">conoscere</a>
</li>
<li class="item <?php if($_GET['q'] == 'produrre') { echo "active";}?>">
<li class="item <?php if($getQ[0] == 'produrre') { echo "active";}?>">
<a href="/produrre" class="label">produrre</a>
</li>
<li class="item <?php if($_GET['q'] == 'acquistare') { echo "active";}?>">
<li class="item <?php if($getQ[0] == 'acquistare') { echo "active";}?>">
<a href="/acquistare" class="label">acquistare</a>
</li>
<li class="item <?php if($_GET['q'] == 'raccontare') { echo "active";}?>">
<li class="item <?php if($getQ[0] == 'raccontare') { echo "active";}?>">
<a href="/raccontare" class="label">raccontare</a>
</li>
</ul>

22
components/sectionHeader/sectionHeader.html

@ -1,3 +1,25 @@
<?php
switch($getQ[0]) {
case 'raccontare':
case 'due-cucchiai-di-salute':
case 'le-variabili-del-gusto':
case 'un-olio-da-strippare':
$section_label = 'raccontare';
break;
case 'conoscere':
$section_label = 'conoscere';
break;
case 'produrre':
$section_label = 'produrre';
break;
case 'acquistare':
$section_label = 'acquistare';
break;
}
?>
<div class="component-sectionHeader">
<h2 class="label"><?= $section_label;?></label>
</div>

BIN
images/products/1.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

BIN
images/products/2.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

BIN
images/products/3.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

38
pages/index.ejs

@ -1,21 +1,22 @@
<?php
switch($_GET['q']) {
case 'raccontare':
case 'due-cucchiai-di-salute':
case 'le-variabili-del-gusto':
case 'un-olio-da-strippare':
$section_label = 'raccontare';
break;
case 'conoscere':
$section_label = 'conoscere';
break;
case 'produrre':
$section_label = 'produrre';
break;
case 'acquistare':
$section_label = 'acquistare';
break;
}
session_start();
@include 'cgi-bin/conn.conn';
@include 'cgi-bin/functions.inc';
@include 'cgi-bin/params.inc';
$GLOBALS['getQ'][0]="iolovolio";
$GLOBALS['isHome'] = true;
$GLOBALS['conn'];
$conn = @mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR");
mysqli_set_charset($conn, "utf8");
if(@$_GET['q']){ $GLOBALS['getQ'] = explode("/",$_GET['q']); }
if($getQ[0]!="iolovolio"){ $isHome = false; }
?>
<!DOCTYPE html>
@ -34,8 +35,7 @@
<main class="main-content">
<?php
echo $_GET['q'];
@include $_GET['q'].'.php';
@include $getQ[0].'.php';
?>
</main>

BIN
src/fonts/066ce24dae3730ed6c648b09efaea93a.eot

Binary file not shown.

BIN
src/fonts/066ce24dae3730ed6c648b09efaea93a.ttf

Binary file not shown.

BIN
src/fonts/066ce24dae3730ed6c648b09efaea93a.woff2

Binary file not shown.

BIN
src/fonts/icomoon.eot

Binary file not shown.

9
src/fonts/icomoon.svg

@ -7,9 +7,8 @@
<font-face units-per-em="1024" ascent="960" descent="-64" />
<missing-glyph horiz-adv-x="1024" />
<glyph unicode="&#x20;" horiz-adv-x="512" d="" />
<glyph unicode="&#xe900;" glyph-name="arrow-down" d="M90.467 728.644c-10.031-0.021-19.188-3.748-26.178-9.883l0.045 0.039c-8.36-7.337-13.608-18.044-13.608-29.977 0-10.064 3.734-19.257 9.891-26.268l-0.039 0.045 421.444-481.644c7.338-8.359 18.045-13.607 29.978-13.607s22.64 5.248 29.939 13.562l0.039 0.045 421.444 481.644c6.119 6.966 9.853 16.158 9.853 26.223 0 11.933-5.249 22.64-13.563 29.938l-0.045 0.039c-6.964 6.112-16.152 9.842-26.21 9.842-11.928 0-22.631-5.244-29.929-13.552l-0.039-0.045-391.489-447.378-391.489 447.378c-7.337 8.355-18.041 13.6-29.97 13.6-0.026 0-0.052 0-0.078 0h0.004z" />
<glyph unicode="&#xe901;" glyph-name="arrow-right" d="M231.352 26.463c0.021-10.031 3.748-19.188 9.883-26.178l-0.039 0.045c7.337-8.36 18.044-13.608 29.977-13.608 10.064 0 19.257 3.734 26.268 9.891l-0.045-0.039 481.644 421.444c8.359 7.338 13.607 18.045 13.607 29.978s-5.248 22.64-13.562 29.939l-0.045 0.039-481.644 421.444c-6.966 6.119-16.158 9.853-26.223 9.853-11.933 0-22.64-5.249-29.938-13.563l-0.039-0.045c-6.112-6.964-9.842-16.152-9.842-26.21 0-11.928 5.244-22.631 13.552-29.929l0.045-0.039 447.378-391.489-447.378-391.489c-8.355-7.337-13.6-18.041-13.6-29.97 0-0.026 0-0.052 0-0.078v0.004z" />
<glyph unicode="&#xe902;" glyph-name="cart" d="M58.668 888.913c-0.009 0-0.019 0-0.029 0-16.622 0-30.098-13.475-30.098-30.098 0 0 0 0 0 0v0c0-0.009 0-0.019 0-0.029 0-16.622 13.475-30.098 30.098-30.098 0.010 0 0.021 0 0.031 0h110.19c35.747 0 66.548-23.965 75.215-58.52l54.523-215.974c0.203-0.786 0.374-1.356 0.561-1.917l-0.061 0.212 64.487-257.976c6.74-26.727 30.784-45.558 58.373-45.558h513.306c33.232 0 60.195 26.963 60.195 60.195v360.467c0 33.233-26.963 60.195-60.195 60.195h-603.423c-5.105 0-10.117-0.721-14.961-1.969l-14.373 56.992c-15.317 61.068-70.636 104.078-133.647 104.078zM331.84 669.618h603.423v-106.194c-1.498 0.272-3.225 0.433-4.989 0.441h-201.404c-0.009 0-0.019 0-0.030 0-16.622 0-30.098-13.475-30.098-30.098 0 0 0 0 0 0v0c0 0 0 0 0 0 0-16.622 13.475-30.098 30.098-30.098 0.010 0 0.021 0 0.031 0h201.394c0.009 0 0.020 0 0.031 0 1.754 0 3.473 0.15 5.145 0.438l-0.179-0.025v-194.93h-513.306l-48.644 194.518h177.794c0.009 0 0.019 0 0.029 0 16.622 0 30.098 13.475 30.098 30.098 0 0 0 0 0 0v0c0 0 0 0 0 0 0 16.622-13.475 30.098-30.098 30.098-0.010 0-0.021 0-0.031 0h-192.841zM566.772 436.566c0 0 0 0 0 0-16.622 0-30.098-13.475-30.098-30.098 0-0.010 0-0.021 0-0.031v0.002c0.067-16.572 13.516-29.98 30.097-29.98 0 0 0 0 0 0h133.529c0 0 0 0 0 0 16.581 0 30.031 13.408 30.097 29.974v0.006c0 0.009 0 0.019 0 0.029 0 16.622-13.475 30.098-30.098 30.098 0 0 0 0 0 0v0zM432.391 207.659c-55.338 0-100.316-45-100.316-100.257 0-55.336 44.978-100.316 100.316-100.316 55.257 0 100.257 44.98 100.257 100.316 0 55.257-45 100.257-100.257 100.257zM728.9 207.659c-55.336 0-100.257-45-100.257-100.257 0-55.336 44.921-100.316 100.257-100.316 55.257 0 100.257 44.98 100.257 100.316 0 55.257-45 100.257-100.257 100.257zM432.391 147.464c22.102 0 40.062-17.959 40.062-40.062 0-22.181-17.96-40.12-40.062-40.12-22.182 0-40.12 17.939-40.12 40.12 0 22.103 17.939 40.062 40.12 40.062zM728.9 147.464c22.104 0 40.062-17.959 40.062-40.062 0-22.181-17.958-40.12-40.062-40.12-22.182 0-40.062 17.939-40.062 40.12 0 22.103 17.88 40.062 40.062 40.062z" />
<glyph unicode="&#xe903;" glyph-name="drop" d="M809.466 294.489c0-164.284-133.182-297.466-297.466-297.466s-297.466 133.182-297.466 297.466c0 164.284 297.466 604.488 297.466 604.488s297.466-440.204 297.466-604.488z" />
<glyph unicode="&#xe904;" glyph-name="user" d="M512.003 906.541c-127.764 0-231.657-103.977-231.657-231.74 0-89.876 51.445-167.88 126.412-206.275-85.198-37.947-144.78-123.37-144.78-222.485v-194.439c0-34.308 27.835-62.142 62.142-62.142h375.761c34.308 0 62.142 27.834 62.142 62.142v194.439c0 99.119-59.586 184.546-144.756 222.491 74.988 38.396 126.471 116.395 126.471 206.269 0 127.763-103.97 231.74-231.734 231.74zM512.003 844.399c93.7 0 169.592-75.98 169.592-169.598s-75.892-169.516-169.592-169.516c-93.617 0-169.516 75.898-169.516 169.516s75.899 169.598 169.516 169.598zM505.447 427.368h13.188c100.092 0 181.245-81.156 181.245-181.328v-194.439h-375.761v194.439c0 100.171 81.157 181.328 181.328 181.328z" />
<glyph unicode="&#xe900;" glyph-name="buy" d="M498.102 903.176c-115.187 0-211.767-96.565-211.767-215.468h-167.207v-78.016h0.363v-538.852h-0.363v-78.016h784.003v7.693h1.742v687.408h-78.016v-0.218h-113.213c0 118.903-100.353 215.468-215.541 215.468zM498.102 828.861c78.030 0 141.226-63.124 141.226-141.154h-278.679c0 78.030 59.422 141.154 137.453 141.154zM197.579 609.692h88.756v-55.736h74.314v55.736h278.679v-55.736h74.314v55.736h113.213v-538.852h-629.278z" />
<glyph unicode="&#xe901;" glyph-name="minus" d="M976.53 489.004v-81.976h-929.060v81.976z" />
<glyph unicode="&#xe902;" glyph-name="plus" d="M471.011 912.53h81.976v-929.060h-81.976zM976.53 489.004v-81.976h-929.060v81.976z" />
<glyph unicode="&#xe903;" glyph-name="angle-down" d="M90.513 706.035l-47.292-47.292 468.778-468.778 468.778 468.778-47.292 47.292-421.487-421.487z" />
</font></defs></svg>

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/fonts/icomoon.ttf

Binary file not shown.

BIN
src/fonts/icomoon.woff

Binary file not shown.

2
src/fonts/selection.json

File diff suppressed because one or more lines are too long

10
src/scss/forms.scss

@ -66,7 +66,8 @@ input[type=text],
input[type=password],
input[type=email],
input[type=tel],
input[type=date] {
input[type=date],
input[type=number] {
color: $dark-gray;
background: $white;
border-radius: 0;
@ -159,11 +160,16 @@ select {
border-radius: 0;
height: auto;
display: block;
padding: 7px 15px;
padding: 10px 15px;
border: 2px solid $white;
text-align: center;
@include font-style( $font-sans, 'regular', $font-14);
&.button-brown {
background: $brown;
color: $white;
}
&.button-big {
padding: 10px 20px;
font-size: $font-18;

11
src/scss/icons.scss

@ -25,18 +25,15 @@
}
.icon-arrow-down:before {
.icon-buy:before {
content: "\e900";
}
.icon-arrow-right:before {
.icon-minus:before {
content: "\e901";
}
.icon-cart:before {
.icon-plus:before {
content: "\e902";
}
.icon-drop:before {
.icon-angle-down:before {
content: "\e903";
}
.icon-user:before {
content: "\e904";
}

13
webpack.config.js

@ -13,6 +13,7 @@ const pagesPath = path.join(__dirname, './pages')
const distPath = path.join(__dirname, './public')
const componentPath = path.join(__dirname, './components')
const imagesPath = path.join(__dirname, './images')
const binsPath = path.join(__dirname, './cgi-bin')
const assetsPath = path.join(__dirname, './assets')
const docsPath = path.join(__dirname, './docs')
const srcPath = './src'
@ -54,6 +55,16 @@ module.exports = (env) => {
context: imagesPath,
from: '*.*',
to: distPath + '/images',
},
{
context: imagesPath,
from: '**/*.*',
to: distPath + '/images',
},
{
context: binsPath,
from: '*.*',
to: distPath + '/cgi-bin',
}
]
})
@ -90,7 +101,7 @@ module.exports = (env) => {
entry: entries,
output: {
path: path.join(distPath, '/assets/js'),
publicPath: './assets/js',
publicPath: '/assets/js',
filename: 'bundle.js'
},
module: {

Loading…
Cancel
Save