diff --git a/public/style.css b/public/style.css index c093e68..19c7900 100644 --- a/public/style.css +++ b/public/style.css @@ -1385,8 +1385,9 @@ textarea:focus { /* Стили для изображений в заметках */ .note-image { - max-width: 100%; - height: auto; + width: 150px; + height: 150px; + object-fit: cover; border-radius: 6px; margin: 10px 0; box-shadow: 0 2px 4px rgba(0,0,0,0.1); @@ -1396,6 +1397,27 @@ textarea:focus { .note-image:hover { transform: scale(1.02); + box-shadow: 0 4px 8px rgba(0,0,0,0.2); +} + +.note-image::after { + content: "🔍"; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background: rgba(0,0,0,0.7); + color: white; + padding: 8px; + border-radius: 50%; + font-size: 16px; + opacity: 0; + transition: opacity 0.2s ease; + pointer-events: none; +} + +.note-image:hover::after { + opacity: 1; } .note-images-container { @@ -1410,6 +1432,10 @@ textarea:focus { display: inline-block; } +.note-image-item .note-image { + position: relative; +} + .note-image-item .remove-note-image-btn { position: absolute; top: 5px; @@ -1488,4 +1514,9 @@ textarea:focus { width: 80px; height: 80px; } + + .note-image { + width: 120px; + height: 120px; + } }