card complete

This commit is contained in:
counterweight 2025-03-04 02:17:26 +01:00
parent ac20fbccdb
commit b60fb66db2
Signed by: counterweight
GPG key ID: 883EDBAA726BD96C
7 changed files with 135 additions and 14 deletions

View file

@ -36,7 +36,7 @@
width: 100%;
height: 500px;
margin: 5px 5px;
padding: 5px;
padding: 10px;
}
}
@ -75,7 +75,7 @@
.myoffer-card {
width: 23%;
min-width: 400px;
min-width: 339px;
height: 500px;
margin: 10px 10px;
padding: 10px;
@ -110,7 +110,7 @@
.myoffer-card {
display: grid;
grid-template-columns: 48% 4% 48%;
grid-template-rows: 23% 1% 18% 1% 18% 1% 18% 1% 20%;
grid-template-rows: 25% 1% 30% 1% 18% 1% 14% 1% 10%;
}
.myoffer-card > div {
@ -139,7 +139,7 @@
margin-left: 2px;
}
.left-icon-checkboxed-field img {
height: 1.2em;
height: 1.1em;
}
.right-icon-checkboxed-field {
@ -209,6 +209,20 @@
text-align: left;
}
.offer-action-buttons-area {
grid-column-start: 1;
grid-column-end: 4;
grid-row: 9;
display: flex;
align-items: center;
justify-content: flex-end;
}
.offer-action-area {
cursor: pointer;
margin-right: 20px;
}
.offer-long-text {
font-size: 0.9em;
}

6
src/public/img/edit.svg Normal file
View file

@ -0,0 +1,6 @@
<!-- pen-to-square icon by Free Icons (https://free-icons.github.io/free-icons/) -->
<svg xmlns="http://www.w3.org/2000/svg" height="1em" fill="currentColor" viewBox="0 0 512 512">
<path
d="M 476.65483234714003 17.16765285996055 Q 458.47731755424064 0 436.2603550295858 0 L 436.2603550295858 0 L 436.2603550295858 0 Q 414.043392504931 0 395.86587771203153 17.16765285996055 L 365.57001972386587 47.463510848126234 L 365.57001972386587 47.463510848126234 L 464.53648915187375 146.42998027613413 L 464.53648915187375 146.42998027613413 L 494.8323471400395 116.13412228796844 L 494.8323471400395 116.13412228796844 Q 512 97.95660749506904 512 75.7396449704142 Q 512 53.52268244575937 494.8323471400395 35.34516765285996 L 476.65483234714003 17.16765285996055 L 476.65483234714003 17.16765285996055 Z M 173.69625246548324 239.33727810650888 Q 164.60749506903352 248.42603550295857 160.5680473372781 261.55424063116374 L 130.27218934911244 350.42209072978306 L 130.27218934911244 350.42209072978306 Q 126.23274161735701 364.560157790927 136.33136094674558 375.6686390532544 Q 147.439842209073 385.767258382643 161.57790927021696 381.7278106508876 L 251.45562130177515 351.43195266272187 L 251.45562130177515 351.43195266272187 Q 263.5739644970414 347.3925049309665 272.66272189349115 338.3037475345168 L 442.3195266272189 168.64694280078896 L 442.3195266272189 168.64694280078896 L 343.35305719921104 69.68047337278107 L 343.35305719921104 69.68047337278107 L 173.69625246548324 239.33727810650888 L 173.69625246548324 239.33727810650888 Z M 96.94674556213018 59.581854043392504 Q 55.54240631163708 60.59171597633136 28.276134122287967 87.85798816568047 L 28.276134122287967 87.85798816568047 L 28.276134122287967 87.85798816568047 Q 1.009861932938856 115.12426035502959 0 156.5285996055227 L 0 415.05325443786984 L 0 415.05325443786984 Q 1.009861932938856 456.4575936883629 28.276134122287967 483.72386587771206 Q 55.54240631163708 510.99013806706114 96.94674556213018 512 L 355.4714003944773 512 L 355.4714003944773 512 Q 396.8757396449704 510.99013806706114 424.14201183431953 483.72386587771206 Q 451.4082840236686 456.4575936883629 452.4181459566075 415.05325443786984 L 452.4181459566075 318.1065088757396 L 452.4181459566075 318.1065088757396 Q 452.4181459566075 303.9684418145957 443.3293885601578 294.879684418146 Q 434.2406311637081 285.79092702169623 420.1025641025641 285.79092702169623 Q 405.96449704142015 285.79092702169623 396.8757396449704 294.879684418146 Q 387.7869822485207 303.9684418145957 387.7869822485207 318.1065088757396 L 387.7869822485207 415.05325443786984 L 387.7869822485207 415.05325443786984 Q 387.7869822485207 429.1913214990138 378.698224852071 438.28007889546353 Q 369.6094674556213 447.3688362919132 355.4714003944773 447.3688362919132 L 96.94674556213018 447.3688362919132 L 96.94674556213018 447.3688362919132 Q 82.80867850098619 447.3688362919132 73.7199211045365 438.28007889546353 Q 64.63116370808679 429.1913214990138 64.63116370808679 415.05325443786984 L 64.63116370808679 156.5285996055227 L 64.63116370808679 156.5285996055227 Q 64.63116370808679 142.3905325443787 73.7199211045365 133.301775147929 Q 82.80867850098619 124.21301775147928 96.94674556213018 124.21301775147928 L 193.89349112426035 124.21301775147928 L 193.89349112426035 124.21301775147928 Q 208.03155818540435 124.21301775147928 217.12031558185404 115.12426035502959 Q 226.20907297830374 106.03550295857988 226.20907297830374 91.8974358974359 Q 226.20907297830374 77.75936883629191 217.12031558185404 68.6706114398422 Q 208.03155818540435 59.581854043392504 193.89349112426035 59.581854043392504 L 96.94674556213018 59.581854043392504 L 96.94674556213018 59.581854043392504 Z"
/>
</svg>

After

Width:  |  Height:  |  Size: 3.6 KiB

View file

@ -0,0 +1,40 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- trash-can icon by Free Icons (https://free-icons.github.io/free-icons/) -->
<svg
height="1em"
fill="currentColor"
viewBox="0 0 512 512"
version="1.1"
id="svg1"
sodipodi:docname="trash-can-darkred.svg"
inkscape:version="1.4 (1:1.4+202410161351+e7c3feb100)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1" />
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:zoom="1.6855469"
inkscape:cx="255.70336"
inkscape:cy="256"
inkscape:window-width="1978"
inkscape:window-height="1088"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1" />
<path
d="M 167 18 Q 176 1 196 0 L 316 0 L 316 0 Q 336 1 345 18 L 352 32 L 352 32 L 448 32 L 448 32 Q 462 32 471 41 Q 480 50 480 64 Q 480 78 471 87 Q 462 96 448 96 L 64 96 L 64 96 Q 50 96 41 87 Q 32 78 32 64 Q 32 50 41 41 Q 50 32 64 32 L 160 32 L 160 32 L 167 18 L 167 18 Z M 64 128 L 448 128 L 64 128 L 448 128 L 448 448 L 448 448 Q 447 475 429 493 Q 411 511 384 512 L 128 512 L 128 512 Q 101 511 83 493 Q 65 475 64 448 L 64 128 L 64 128 Z M 160 192 Q 145 193 144 208 L 144 432 L 144 432 Q 145 447 160 448 Q 175 447 176 432 L 176 208 L 176 208 Q 175 193 160 192 L 160 192 Z M 256 192 Q 241 193 240 208 L 240 432 L 240 432 Q 241 447 256 448 Q 271 447 272 432 L 272 208 L 272 208 Q 271 193 256 192 L 256 192 Z M 352 192 Q 337 193 336 208 L 336 432 L 336 432 Q 337 447 352 448 Q 367 447 368 432 L 368 208 L 368 208 Q 367 193 352 192 L 352 192 Z"
id="path1"
style="fill:#800000;fill-opacity:1" />
</svg>

After

Width:  |  Height:  |  Size: 2 KiB

View file

@ -0,0 +1,40 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- trash-can icon by Free Icons (https://free-icons.github.io/free-icons/) -->
<svg
height="1em"
fill="currentColor"
viewBox="0 0 512 512"
version="1.1"
id="svg1"
sodipodi:docname="trash-can-lasecagold.svg"
inkscape:version="1.4 (1:1.4+202410161351+e7c3feb100)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs1" />
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:zoom="1.6855469"
inkscape:cx="255.70336"
inkscape:cy="256"
inkscape:window-width="1978"
inkscape:window-height="1088"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="svg1" />
<path
d="M 167 18 Q 176 1 196 0 L 316 0 L 316 0 Q 336 1 345 18 L 352 32 L 352 32 L 448 32 L 448 32 Q 462 32 471 41 Q 480 50 480 64 Q 480 78 471 87 Q 462 96 448 96 L 64 96 L 64 96 Q 50 96 41 87 Q 32 78 32 64 Q 32 50 41 41 Q 50 32 64 32 L 160 32 L 160 32 L 167 18 L 167 18 Z M 64 128 L 448 128 L 64 128 L 448 128 L 448 448 L 448 448 Q 447 475 429 493 Q 411 511 384 512 L 128 512 L 128 512 Q 101 511 83 493 Q 65 475 64 448 L 64 128 L 64 128 Z M 160 192 Q 145 193 144 208 L 144 432 L 144 432 Q 145 447 160 448 Q 175 447 176 432 L 176 208 L 176 208 Q 175 193 160 192 L 160 192 Z M 256 192 Q 241 193 240 208 L 240 432 L 240 432 Q 241 447 256 448 Q 271 447 272 432 L 272 208 L 272 208 Q 271 193 256 192 L 256 192 Z M 352 192 Q 337 193 336 208 L 336 432 L 336 432 Q 337 447 352 448 Q 367 447 368 432 L 368 208 L 368 208 Q 367 193 352 192 L 352 192 Z"
id="path1"
style="fill:#e1c300;fill-opacity:1" />
</svg>

After

Width:  |  Height:  |  Size: 2 KiB

View file

@ -0,0 +1,6 @@
<!-- trash-can icon by Free Icons (https://free-icons.github.io/free-icons/) -->
<svg xmlns="http://www.w3.org/2000/svg" height="1em" fill="currentColor" viewBox="0 0 512 512">
<path
d="M 167 18 Q 176 1 196 0 L 316 0 L 316 0 Q 336 1 345 18 L 352 32 L 352 32 L 448 32 L 448 32 Q 462 32 471 41 Q 480 50 480 64 Q 480 78 471 87 Q 462 96 448 96 L 64 96 L 64 96 Q 50 96 41 87 Q 32 78 32 64 Q 32 50 41 41 Q 50 32 64 32 L 160 32 L 160 32 L 167 18 L 167 18 Z M 64 128 L 448 128 L 64 128 L 448 128 L 448 448 L 448 448 Q 447 475 429 493 Q 411 511 384 512 L 128 512 L 128 512 Q 101 511 83 493 Q 65 475 64 448 L 64 128 L 64 128 Z M 160 192 Q 145 193 144 208 L 144 432 L 144 432 Q 145 447 160 448 Q 175 447 176 432 L 176 208 L 176 208 Q 175 193 160 192 L 160 192 Z M 256 192 Q 241 193 240 208 L 240 432 L 240 432 Q 241 447 256 448 Q 271 447 272 432 L 272 208 L 272 208 Q 271 193 256 192 L 256 192 Z M 352 192 Q 337 193 336 208 L 336 432 L 336 432 Q 337 447 352 448 Q 367 447 368 432 L 368 208 L 368 208 Q 367 193 352 192 L 352 192 Z"
/>
</svg>

After

Width:  |  Height:  |  Size: 1 KiB

View file

@ -201,7 +201,6 @@ class Offer {
const tradeDescDiv = document.createElement('div');
tradeDescDiv.classList.add('trade-desc');
tradeDescDiv.classList.add('subtle-box');
const youBuyText = document.createElement('p');
youBuyText.classList.add('offer-card-content-title');
@ -236,7 +235,6 @@ class Offer {
const premiumDescDiv = document.createElement('div');
premiumDescDiv.classList.add('premium-desc');
premiumDescDiv.classList.add('subtle-box');
const premiumTitle = document.createElement('p');
premiumTitle.classList.add('offer-card-content-title');
@ -269,7 +267,6 @@ class Offer {
const whereDescDiv = document.createElement('div');
whereDescDiv.classList.add('where-desc');
whereDescDiv.classList.add('subtle-box');
const whereDescTitle = document.createElement('p');
whereDescTitle.classList.add('offer-card-content-title');
@ -283,7 +280,6 @@ class Offer {
const whenDescDiv = document.createElement('div');
whenDescDiv.classList.add('when-desc');
whenDescDiv.classList.add('subtle-box');
const whenDescTitle = document.createElement('p');
whenDescTitle.classList.add('offer-card-content-title');
@ -297,7 +293,6 @@ class Offer {
const bitcoinMethodsDiv = document.createElement('div');
bitcoinMethodsDiv.classList.add('bitcoin-methods-desc');
bitcoinMethodsDiv.classList.add('subtle-box');
const bitcoinMethodsTitle = document.createElement('p');
bitcoinMethodsTitle.classList.add('offer-card-content-title');
@ -363,7 +358,6 @@ class Offer {
const visibilityDiv = document.createElement('div');
visibilityDiv.classList.add('visibility-desc');
visibilityDiv.classList.add('subtle-box');
const visibilityTitle = document.createElement('p');
visibilityTitle.classList.add('offer-card-content-title');
@ -472,7 +466,6 @@ class Offer {
const otherOfferFeaturesDiv = document.createElement('div');
otherOfferFeaturesDiv.classList.add('other-desc');
otherOfferFeaturesDiv.classList.add('subtle-box');
const otherOfferFeaturesTitle = document.createElement('p');
otherOfferFeaturesTitle.classList.add('offer-card-content-title');
@ -486,7 +479,7 @@ class Offer {
const areBigNotesAcceptedIcon = document.createElement('img');
areBigNotesAcceptedIcon.src = '/img/eur-bill-lasecagold.svg';
const areBigNotesAcceptedText = document.createElement('p');
areBigNotesAcceptedText.innerText = 'Billetes grandes OK';
areBigNotesAcceptedText.innerText = 'Billetes grandes';
const checkIcon = document.createElement('img');
checkIcon.src = '/img/circle-check-green.svg';
@ -499,7 +492,7 @@ class Offer {
const areBigNotesAcceptedIcon = document.createElement('img');
areBigNotesAcceptedIcon.src = '/img/eur-bill-gray.svg';
const areBigNotesAcceptedText = document.createElement('p');
areBigNotesAcceptedText.innerText = 'Billetes grandes OK';
areBigNotesAcceptedText.innerText = 'Billetes grandes';
const checkIcon = document.createElement('img');
checkIcon.src = '/img/circle-xmark-gray.svg';
@ -512,6 +505,27 @@ class Offer {
otherOfferFeaturesDiv.append(areBigNotesAcceptedContainer);
const actionButtonsArea = document.createElement('p');
actionButtonsArea.classList.add('offer-action-buttons-area');
const editActionArea = document.createElement('div');
editActionArea.classList.add('offer-action-area');
const editActionIcon = document.createElement('img');
editActionIcon.src = '/img/edit.svg';
const editActionText = document.createElement('p');
editActionText.innerText = 'Editar';
editActionArea.append(editActionIcon, editActionText);
const deleteActionArea = document.createElement('div');
deleteActionArea.classList.add('offer-action-area');
const deleteActionIcon = document.createElement('img');
deleteActionIcon.src = '/img/trash-can-darkred.svg';
const deleteActionText = document.createElement('p');
deleteActionText.innerText = 'Eliminar';
deleteActionArea.append(deleteActionIcon, deleteActionText);
actionButtonsArea.append(editActionArea, deleteActionArea);
offerCard.append(
tradeDescDiv,
premiumDescDiv,
@ -519,7 +533,8 @@ class Offer {
whenDescDiv,
bitcoinMethodsDiv,
visibilityDiv,
otherOfferFeaturesDiv
otherOfferFeaturesDiv,
actionButtonsArea
);
return offerCard;

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 MiB