-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathnews.html
106 lines (106 loc) · 5.67 KB
/
news.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html>
<html lang="uk" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>News</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link rel="stylesheet" href="main.css">
</head>
<body>
<header>
<nav>
<div class="nav-wrapper z-depth-1">
<a href="#" class="title">SN</a>
<ul id="nav-mobile" class="right">
<li><img src="images/user.png" alt="Здесь должна быть картинка"></li>
<li><a href="index.html" class="user">Luella Hudbbard</a></li>
</ul>
</div>
</nav>
</header>
<main id="news">
<div class="container">
<div class="row">
<div class="side-menu">
<div class="collection">
<a href="profile.html" class="collection-item"><i class="material-icons">assignment_ind</i>My profile</a>
<a href="news.html" class="collection-item active"><i class="material-icons">chrome_reader_mode</i>News</a>
<a href="messages.html" class="collection-item"><i class="material-icons">email</i><span class="new badge">4</span>Messages</a>
<a href="friends.html" class="collection-item"><i class="material-icons">face</i>Friends</a>
<a href="events.html" class="collection-item"><i class="material-icons">event_available</i>Events</a>
<a href="#!" class="collection-item"><i class="material-icons">image</i>Media</a>
</div>
</div>
<div class="col s12">
<div class="flex">
<div class="col">
<h5 class="heading">News</h5>
</div>
<div class="col">
<a class="btn-floating btn-medium waves-effect waves-light"><i class="material-icons">add</i></a>
</div>
</div>
<div class="row">
<ul class="collection">
<li class="collection-item">
<div class="row">
<img src="images/user1.png" alt="Здесь должна быть картинка">
<div class="information">
<span class="title">Pranav Talley</span>
<p class="time">12:45:34</p>
</div>
</div>
<p class="text">Sed vel magna consequat, viverra risus vitae, maximus ex. Nulla sed ex at nibh facilisis malesuada et quis ex. Donec
venetatis tellus tellus, eu elementum ipsum pharetra vel. Etiam ac orci vehicula, luctus turpis sit amet, maximus nulla.
Fusce libero odio, rutrum non erat nec, sagittis scelerisque mi.</p>
</li>
<li class="collection-item">
<div class="row">
<img src="images/user2.png" alt="Здесь должна быть картинка">
<div class="information">
<span class="title">Serena Perkins</span>
<p class="time">12:45:34</p>
</div>
</div>
<p class="text">Fusce tincidunt constectetur ullamcorper. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac
turpis egestas. Praesent ut tempus nunc. Phasellus ut ipsum laoreet, auctor ex maximus, euismod lacus. Curabitur et
odio magna. Nullam ultrices libero id eleifend constectetur.</p>
<div class="flex">
<img src="images/1.png" alt="Здесь должна быть картинка">
<img src="images/2.png" alt="Здесь должна быть картинка">
<img src="images/3.png" alt="Здесь должна быть картинка">
<img src="images/4.png" alt="Здесь должна быть картинка">
</div>
</li>
<li class="collection-item">
<div class="row">
<img src="images/user3.png" alt="Здесь должна быть картинка">
<div class="information">
<span class="title">Lyndsey Thomson</span>
<p class="time">12:45:34</p>
</div>
</div>
<p class="text">I like this article!</p>
<div class="block">
<div class="pre-block">
<span class="white-text">Curabitur tristique sapien in tempus bibendum.</span>
</div>
<div class="rear-block">
<p>Sed sit amet leo interdum, pellentesque felis in, malesuada mi. Duis leo elit, faucibus vel justo id, rutrum congue
lectus. Nam pellentesque placerat neque, vitae venetatis justo imperdiet sit amet. Nunc gravida convallis
consequat. Vestibulum vitae scelerisque diam.</p>
<a href="#">somewebsite.com</a>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</main>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
</body>
</html>