diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..ab1f416 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,10 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Ignored default folder with query files +/queries/ +# Datasource local storage ignored files +/dataSources/ +/dataSources.local.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/Lab2_assets.iml b/.idea/Lab2_assets.iml new file mode 100644 index 0000000..d6ebd48 --- /dev/null +++ b/.idea/Lab2_assets.iml @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/.idea/copilot.data.migration.ask2agent.xml b/.idea/copilot.data.migration.ask2agent.xml new file mode 100644 index 0000000..1f2ea11 --- /dev/null +++ b/.idea/copilot.data.migration.ask2agent.xml @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml new file mode 100644 index 0000000..49851ae --- /dev/null +++ b/.idea/inspectionProfiles/Project_Default.xml @@ -0,0 +1,16 @@ + + + + \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml new file mode 100644 index 0000000..07115cd --- /dev/null +++ b/.idea/misc.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..2975278 --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..35eb1dd --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/task-1-card/card.css b/task-1-card/card.css index c660b89..3f2775c 100644 --- a/task-1-card/card.css +++ b/task-1-card/card.css @@ -35,3 +35,73 @@ */ /* Студент починає звідси */ +* { + box-sizing: border-box; +} +:root{ + --acent-shadow-color: goldenrod; + --color-border: gray; + --acent-text-color: black; + --radius: 30px; + --pading: 10px; + --space: 15px; + --text-size:20px; +} +body{ + background-color: #e6e0e0; + margin: 50px; +} +.card{ + border: 1px solid var(--color-border); + border-radius: var(--radius); + box-shadow:var(--acent-shadow-color) 0 0 20px; + padding: var(--pading); + background: white; + width:280px; + border-spacing: var(--space); + flex-direction: column; + margin-top: auto; + font-size: var(--text-size); + +} +.card:hover{ + transform:translateY(-2px); + transition-duration:200ms; +} +.card-image{ + border-radius: var(--radius); + aspect-ratio: auto; + object-fit: cover; + width: 100%; +} +.card-description{ + -webkit-line-clamp: 2; + display: -webkit-box; + -webkit-box-orient: vertical; + overflow: hidden; +} +button:hover{ + color: white; + background-color: darkred; +} +button:focus-visible{ + outline: none; + border: 5px solid #f67352; +} +button { + transition-duration: 150ms; + background-color: var(--acent-shadow-color); + color: var(--acent-text-color); + font-size: 30px; + border-radius: var(--radius); + border-width: 20px; + +} +.card-meta{ + color: gray; +} +.card-price{ + color: blue; + font-weight: bold; + font-size: var(--text-size); +} diff --git a/task-1-card/card.html b/task-1-card/card.html index a3adf23..ab9c3f4 100644 --- a/task-1-card/card.html +++ b/task-1-card/card.html @@ -18,13 +18,13 @@ Варіант C — Картка СТАТТІ Варіант D — Картка КУРСУ --> - +
Зображення для картки + src="https://m.media-amazon.com/images/M/MV5BMTM1NjExNjg1OV5BMl5BanBnXkFtZTcwMTQ0NzIwMw@@._V1_FMjpg_UX1000_.jpg" + alt="Зображення Майкла Джексона"> -

Назва товару / профілю / статті

+

Майкл Джексон

Допоміжна інформація: автор, дата, тривалість тощо @@ -40,7 +40,13 @@

Назва товару / профілю / статті Дізнатися більше + +

- +
diff --git a/task-2-selectors/styles.css b/task-2-selectors/styles.css new file mode 100644 index 0000000..6e052dc --- /dev/null +++ b/task-2-selectors/styles.css @@ -0,0 +1,45 @@ +input[type="email"] { + border: 2px solid blue; +} + +input:focus{ + outline: 3px solid blue; + box-shadow: 5px 5px 10px lightpink; +} + +li:first-child{ + font-weight: bold; +} + +tbody tr:nth-child(2n){ + background: #f5f5f5; +} + +p:not(.intro){ + color: #666; +} +blockquote::before{ + content: "«"; + color: blue; +} +blockquote::after{ + content: "»"; + color: blue; +} + +blockquote{ + border-left: 5px solid blue; + padding-left: 10px; +} +h2 { + color: #3030ef; +} +h1{ + color: #3030ef; +} + +body{ + box-shadow: #1a1a1a 0 0 15px; + border-radius: 30px; + padding: 20px; +}