Browse Source

update template

main
ghost 3 years ago
parent
commit
e3fc7ce98d
  1. 2
      src/application/controller/api/image.php
  2. 15
      src/application/controller/home.php
  3. 10
      src/application/controller/index.php
  4. 12
      src/application/view/following.phtml
  5. 74
      src/application/view/home.phtml
  6. 119
      src/public/css/user.css

2
src/application/controller/api/image.php

@ -5,5 +5,5 @@ if (isset($_GET['hash'])) {
$icon = new Icon(); $icon = new Icon();
header("Content-Type: image/jpeg"); header("Content-Type: image/jpeg");
echo $icon->generateImageResource(md5($_GET['hash']), 26, 36, false); echo $icon->generateImageResource(md5($_GET['hash']), 42, 42, false);
} }

15
src/application/controller/home.php

@ -0,0 +1,15 @@
<?php
if (!isset($_SESSION['username'])) {
header('Location: ' . PROJECT_HOST . '/login', true, 302);
}
$metaTitle = _('Home | Twisterarmy Cloud');
$followingUsersTotal = 0;
foreach ((array) $_twister->getFollowing($_SESSION['username']) as $followingUserName) {
$followingUsersTotal++;
}
require(PROJECT_DIR . '/application/view/home.phtml');

10
src/application/controller/index.php

@ -1,10 +0,0 @@
<?php
if (!isset($_SESSION['username'])) {
header('Location: ' . PROJECT_HOST . '/login', true, 302);
}
$metaTitle = _('Home | Twisterarmy Cloud');
require(PROJECT_DIR . '/application/view/home.phtml');

12
src/application/view/following.phtml

@ -9,13 +9,13 @@
<?php if ($followingUsersTotal) { ?> <?php if ($followingUsersTotal) { ?>
<span><?php echo $followingUsersTotal ?></span> <span><?php echo $followingUsersTotal ?></span>
<?php } ?> <?php } ?>
</a><a class="item" href="bookmarks" title="<?php echo _('Bookmarks') ?>"> </a><a class="item" href="#todo" title="<?php echo _('Bookmarks') ?>">
<i class="bi bi-bookmarks"></i> <i class="bi bi-bookmarks"></i>
</a><a class="item" href="mentions" title="<?php echo _('Mentions') ?>"> </a><a class="item" href="#todo" title="<?php echo _('Mentions') ?>">
<i class="bi bi-at"></i> <i class="bi bi-at"></i>
</a><a class="item" href="messages" title="<?php echo _('Messages') ?>"> </a><a class="item" href="#todo" title="<?php echo _('Messages') ?>">
<i class="bi bi-envelope"></i> <i class="bi bi-envelope"></i>
</a><a class="item" href="settings" title="<?php echo _('Messages') ?>"> </a><a class="item" href="#todo" title="<?php echo _('Settings') ?>">
<i class="bi bi-gear"></i> <i class="bi bi-gear"></i>
</a> </a>
</div> </div>
@ -25,10 +25,8 @@
@<?php echo $followingUser['name'] ?> @<?php echo $followingUser['name'] ?>
</div> </div>
<?php } ?> <?php } ?>
<h2><?php echo _('Following suggestions') ?></h2>
</div> </div>
</div> </div>
<div class="side"></div> <div class="side"></div>
</div>
<div class="footer">
<?php include(PROJECT_DIR . '/application/controller/common/footer/user.php') ?>
</div> </div>

74
src/application/view/home.phtml

@ -1,61 +1,49 @@
<?php include(PROJECT_DIR . '/application/controller/common/header/user.php') ?> <?php include(PROJECT_DIR . '/application/controller/common/header/user.php') ?>
<div class="container"> <div class="container">
<div class="main"> <div class="left">
<div class="menu"> <div class="menu">
<a class="item active" href="<?php echo PROJECT_HOST ?>" title="<?php echo _('Home') ?>"> <a class="item active" href="<?php echo PROJECT_HOST ?>" title="<?php echo _('Home') ?>">
<i class="bi bi-house"></i> <i class="bi bi-house"></i>
</a> </a><a class="item" href="following" title="<?php echo _('Following') ?>">
<a class="item" href="following" title="<?php echo _('Following') ?>">
<i class="bi bi-person"></i> <i class="bi bi-person"></i>
<span>12</span> <?php if ($followingUsersTotal) { ?>
</a> <span><?php echo $followingUsersTotal ?></span>
<a class="item" href="bookmarks" title="<?php echo _('Bookmarks') ?>"> <?php } ?>
</a><a class="item" href="#todo" title="<?php echo _('Bookmarks') ?>">
<i class="bi bi-bookmarks"></i> <i class="bi bi-bookmarks"></i>
<span>4</span> </a><a class="item" href="#todo" title="<?php echo _('Mentions') ?>">
</a>
<a class="item" href="mentions" title="<?php echo _('Mentions') ?>">
<i class="bi bi-at"></i> <i class="bi bi-at"></i>
</a> </a><a class="item" href="#todo" title="<?php echo _('Messages') ?>">
<a class="item" href="messages" title="<?php echo _('Messages') ?>">
<i class="bi bi-envelope"></i> <i class="bi bi-envelope"></i>
</a> </a><a class="item" href="#todo" title="<?php echo _('Settings') ?>">
<a class="item" href="settings" title="<?php echo _('Messages') ?>">
<i class="bi bi-gear"></i> <i class="bi bi-gear"></i>
</a> </a>
</div> </div>
<form action="<?php echo PROJECT_HOST ?>" method="POST" name="post" class="post"> </div>
<div> <div class="right">
<textarea name="post" placeholder="<?php echo _('Enter your post...') ?>"></textarea> <div class="post">
</div> <form action="<?php echo PROJECT_HOST ?>" method="POST" name="post">
<!--<span>220</span>--> <div class="avatar">
<button><?php echo _('Send') ?></button> <img src="<?php echo PROJECT_HOST ?>/api/image?hash=<?php echo $_SESSION['username'] ?>" alt="" />
</form> </div>
<div class="message">
<textarea name="post" placeholder="<?php echo _('Enter your post...') ?>"></textarea>
</div>
<div class="action">
<!--<span>220</span>-->
<button><?php echo _('Send') ?></button>
</div>
</form>
</div>
<div class="content"> <div class="content">
<div class="item"> <div class="item">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make <div class="avatar">
</div> <img src="<?php echo PROJECT_HOST ?>/api/image?hash=<?php echo $_SESSION['username'] ?>" alt="" />
<div class="item"> </div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make <div class="message">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="side">
<!-- todo
<form action="<?php echo PROJECT_HOST ?>" method="POST" name="search" class="search">
<input type="text" value="" placeholder="Search...">
</form>
-->
<div class="suggestions">
<h4><?php echo _('Who to follow') ?></h4>
<h4><?php echo _('New users') ?></h4>
<h4><?php echo _('Last activity') ?></h4>
<h4><?php echo _('Related posts') ?></h4>
</div>
</div>
</div>
<div class="footer">
<?php include(PROJECT_DIR . '/application/controller/common/footer/user.php') ?>
</div> </div>

119
src/public/css/user.css

@ -19,44 +19,26 @@ a:active {
overflow: hidden overflow: hidden
} }
.container .side { .container > .left {
float: left; float: left;
width: 30%; max-width: 420px;
padding-right: 16px padding-right: 10px
} }
.container .side form input { .container > .right {
height: 36px; float: left;
width: 100%; width: 60%
padding: 16px 8px;
border-radius: 3px;
margin-bottom: 16px;
font-family: Roboto-Regular, Sans-Serif, Verdana;
font-size: 14px;
background: rgb(56, 65, 78);
color: #dfe8f4;
outline: none;
}
.container .side .suggestions {
padding: 16px 8px;
}
.container .side .suggestions h4 {
text-align: center;
text-transform: uppercase
} }
.container .main { .container {
float: left; margin-bottom: 64px
width: 70%
} }
.container .main .menu { .container .menu {
margin-bottom: 6px margin-bottom: 6px
} }
.container .main .menu .item { .container .menu .item {
display: inline-block; display: inline-block;
background: rgba(39, 46, 57, 0.28); background: rgba(39, 46, 57, 0.28);
/* background: rgba(101, 114, 134, 0.28); */ /* background: rgba(101, 114, 134, 0.28); */
@ -67,46 +49,70 @@ a:active {
margin: 2px margin: 2px
} }
.container .main .menu .item.active, .container .menu .item.active,
.container .main .menu .item:hover { .container .menu .item:hover {
background: #272E39; background: #272E39;
} }
.container .main .menu .item span { .container .menu .item span {
font-size: 12px; font-size: 12px;
margin: 0 8px margin: 0 8px
} }
.container .main .post { .container .post {
margin-bottom: 10px; margin-bottom: 10px;
padding: 16px;
background: #272E39; background: #272E39;
border-radius: 3px; border-radius: 3px;
overflow: hidden overflow: hidden;
position: relative;
} }
.container .main .post textarea { .container .post .avatar {
position: absolute;
top: 19px;
left: 19px;
}
.container .post .avatar img {
border-radius: 50%;
border: 2px #fff solid;
}
.container .post .message {
padding-left: 82px;
padding-right: 16px;
padding-top: 16px;
padding-bottom: 16px;
}
.container .post .action {
border-top: 1px #4d5666 solid;
padding: 16px;
overflow: hidden;
}
.container .post .message textarea {
height: 52px; height: 52px;
width: 100%; width: 100%;
padding: 16px 8px; padding: 16px 8px;
border-radius: 3px; border-radius: 3px;
margin-bottom: 16px;
font-family: Roboto-Regular, Sans-Serif, Verdana; font-family: Roboto-Regular, Sans-Serif, Verdana;
font-size: 14px; font-size: 14px;
/*background: rgba(101, 114, 134, 0.28);*/ /*background: rgba(101, 114, 134, 0.28);*/
background: rgba(255, 255, 255, 0.18); /*background: rgba(255, 255, 255, 0.18);*/
background: rgb(77, 86, 102);
color: #dfe8f4; color: #dfe8f4;
outline: none outline: none
} }
.container .main .post textarea:focus { .container .post textarea:focus {
height: 120px; height: 80px;
/*background: rgb(79, 90, 107);*/ background: rgb(79, 90, 107);
background: rgb(103, 112, 126); /*background: rgb(103, 112, 126);*/
} }
.container .main .post button { .container .post button {
float: right; float: right;
padding: 8px 16px; padding: 8px 16px;
border-radius: 3px; border-radius: 3px;
@ -116,26 +122,39 @@ a:active {
border: 0 border: 0
} }
.container .main .post button:hover { .container .post button:hover {
background-color: #437baa background-color: #437baa
} }
.container .main .post .content { .container .post .content {
background: rgb(89,99,116); background: rgb(89,99,116);
border-radius: 3px; border-radius: 3px;
padding: 16px; padding: 16px;
} }
.container .main .content .item { .container .content .item {
padding: 16px; padding: 16px;
margin-bottom: 8px; margin-bottom: 8px;
/*background: rgba(101, 114, 134, 0.28);*/ /*background: rgba(101, 114, 134, 0.28);*/
/*background: rgba(255, 254, 254, 0.04);*/ background: rgba(255, 254, 254, 0.04);
background: rgba(255, 255, 255, 0.18); /*background: rgba(255, 255, 255, 0.18);*/
border-radius: 3px; border-radius: 3px;
color: #dfe8f4 color: #dfe8f4;
}
.container .content .item .avatar {
position: absolute;
top: 19px;
left: 19px;
}
.container .content .item .avatar img {
border-radius: 50%;
border: 2px #fff solid;
} }
.container .main .footer { .container .content .item .message {
margin: 36px 0 padding-left: 65px;
} }
Loading…
Cancel
Save