lec 3 done
This commit is contained in:
22
lectures/lec4/part1/task1.html
Normal file
22
lectures/lec4/part1/task1.html
Normal file
@@ -0,0 +1,22 @@
|
||||
...
|
||||
|
||||
<body>
|
||||
<div class="main">
|
||||
<div class="main__card">
|
||||
<div class="main__card-header">Заголовок</div>
|
||||
<div class="main__card-image main__card-image--position_right">Рисунок</div>
|
||||
<div class="card__content"></div>
|
||||
</div>
|
||||
|
||||
<div class="main__card">
|
||||
<div class="main__card-header">Заголовок</div>
|
||||
<div class="main__card-content"></div>
|
||||
</div>
|
||||
|
||||
<div class="main__card">
|
||||
<div class="main__card-image main__card-image--position_left">Рисунок</div>
|
||||
<div class="main__card-header">Заголовок</div>
|
||||
<div class="main__card-content"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
10
lectures/lec4/part2/task1.pug
Normal file
10
lectures/lec4/part2/task1.pug
Normal file
@@ -0,0 +1,10 @@
|
||||
ol#list(type="I")
|
||||
li Препроцессоры HTML
|
||||
ul(type="disc")
|
||||
li.first
|
||||
a(href="#") Haml
|
||||
li Pug
|
||||
li Препроцессоры CSS
|
||||
ul(type="circle")
|
||||
li.first SAAS
|
||||
li Stylus
|
||||
9
lectures/lec4/part2/task2.pug
Normal file
9
lectures/lec4/part2/task2.pug
Normal file
@@ -0,0 +1,9 @@
|
||||
ol#list(type="I")
|
||||
li Препроцессоры HTML
|
||||
ul(type="disc")
|
||||
li.first: a(href="#") Haml
|
||||
li Pug
|
||||
li Препроцессоры CSS
|
||||
ul(type="circle")
|
||||
li.first SAAS
|
||||
li Stylus
|
||||
10
lectures/lec4/part2/task3.pug
Normal file
10
lectures/lec4/part2/task3.pug
Normal file
@@ -0,0 +1,10 @@
|
||||
- var tag = 'h'
|
||||
- var i = 1
|
||||
|
||||
#{tag+i} Уровень #{i}
|
||||
- i++
|
||||
#{tag+i} Уровень #{i}
|
||||
- i++
|
||||
#{tag+i} Уровень #{i}
|
||||
- i++
|
||||
#{tag+i} Уровень #{i}
|
||||
6
lectures/lec4/part2/task4.pug
Normal file
6
lectures/lec4/part2/task4.pug
Normal file
@@ -0,0 +1,6 @@
|
||||
- var products ={"Товар":"Цена","ручка":30.5, "карандаш":50, "альбом":156, "тетрадь":21.5, "ластик":10.2}
|
||||
table
|
||||
each name,price in products
|
||||
tr
|
||||
td= name
|
||||
td= price
|
||||
8
lectures/lec4/part2/task5.pug
Normal file
8
lectures/lec4/part2/task5.pug
Normal file
@@ -0,0 +1,8 @@
|
||||
table
|
||||
- for(var i=0;i<10;i++)
|
||||
tr
|
||||
- for(var j=0;j<10;j++)
|
||||
- if((i + j) % 2 == 0)
|
||||
td.white
|
||||
- else
|
||||
td.black
|
||||
12
lectures/lec4/part2/task6.pug
Normal file
12
lectures/lec4/part2/task6.pug
Normal file
@@ -0,0 +1,12 @@
|
||||
mixin createList(listType, items, tag)
|
||||
- var dispListType = "ul"
|
||||
- if (listType == "ol")
|
||||
- dispListType = "ol"
|
||||
|
||||
#{dispListType}.list
|
||||
each item in items
|
||||
li
|
||||
#{tag} #{item}
|
||||
|
||||
// Вызов миксина
|
||||
+createList('ul', ['Python', 'JavaScript', 'Java'], 'strong')
|
||||
5
lectures/lec4/part3/task1.styl
Normal file
5
lectures/lec4/part3/task1.styl
Normal file
@@ -0,0 +1,5 @@
|
||||
size=1%
|
||||
section
|
||||
box-shadow: size size (2*size) rgba(0,0,0,0.5)
|
||||
padding:size*2
|
||||
margin:size*4
|
||||
10
lectures/lec4/part3/task2.styl
Normal file
10
lectures/lec4/part3/task2.styl
Normal file
@@ -0,0 +1,10 @@
|
||||
.block
|
||||
display flex
|
||||
flex-wrap wrap
|
||||
p
|
||||
display inline-block
|
||||
background gray
|
||||
&:hover
|
||||
color green
|
||||
&:hover
|
||||
color red
|
||||
19
lectures/lec4/part3/task3.css
Normal file
19
lectures/lec4/part3/task3.css
Normal file
@@ -0,0 +1,19 @@
|
||||
.block {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.block .menu {
|
||||
color: navy;
|
||||
}
|
||||
|
||||
.block .menu a {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.block .menu h1 {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.block:hover {
|
||||
color: white;
|
||||
}
|
||||
7
lectures/lec4/part3/task4.styl
Normal file
7
lectures/lec4/part3/task4.styl
Normal file
@@ -0,0 +1,7 @@
|
||||
style-tag(tagName, color_)
|
||||
& {tagName}
|
||||
color: color_
|
||||
|
||||
div
|
||||
style-tag(ul,Navy)
|
||||
|
||||
8
lectures/lec4/part3/task5.styl
Normal file
8
lectures/lec4/part3/task5.styl
Normal file
@@ -0,0 +1,8 @@
|
||||
color-inv(r,g,b)
|
||||
color: rgb(255 - r,255 - g ,255 - b)
|
||||
|
||||
|
||||
a
|
||||
color-inv(1,2,3)
|
||||
|
||||
// оказывается пробелы обязательны при вычилеениях, иначе парсер ругается. неожиданно получислоь
|
||||
Reference in New Issue
Block a user