diff --git a/task_1_html_css/src/card.css b/task_1_html_css/src/card.css index c37fb38..d149676 100644 --- a/task_1_html_css/src/card.css +++ b/task_1_html_css/src/card.css @@ -17,40 +17,15 @@ article { } .card-open-symbol { + display: flex; + justify-content: center; + align-items: center; font-size: 1.5rem; + width: 2rem; transition: rotate 0.5s; cursor: pointer; } - &:has(.card-check:checked) { - >main { - opacity: 0%; - max-height: 0; - transition: opacity 0.2s, max-height 0.2s ease 0.2s; - } - - .card-open-symbol { - rotate: -90deg; - } - } - - &:has(header) { - main { - img { - border-radius: 0 0 var(--border-radius) var(--border-radius); - } - } - } - - &:has(footer) { - main { - img { - border-radius: var(--border-radius) var(--border-radius) 0 0; - } - } - } - - header { line-height: 2rem; border-bottom: 1px solid var(--border-color); @@ -116,4 +91,37 @@ article { } } } + + &:has(.card-check:checked) { + header { + border: none; + } + + >main { + opacity: 0%; + max-height: 0; + transition: opacity 0.2s, max-height 0.2s ease 0.2s, padding 0.2s ease 0.2s; + padding: 0; + } + + .card-open-symbol { + rotate: -90deg; + } + } + + &:has(header) { + main { + img { + border-radius: 0 0 var(--border-radius) var(--border-radius); + } + } + } + + &:has(footer) { + main { + img { + border-radius: var(--border-radius) var(--border-radius) 0 0; + } + } + } } diff --git a/task_1_html_css/src/vite.config.js b/task_1_html_css/src/vite.config.js index 6a0fcea..58fd0ce 100644 --- a/task_1_html_css/src/vite.config.js +++ b/task_1_html_css/src/vite.config.js @@ -1,7 +1,7 @@ export default { 'server': { - 'host': '0.0.0.0', - 'port': 5173, + // 'host': '0.0.0.0', + 'port': 8080, }, };