Merge pull request #1018 from pixelfed/frontend-ui-refactor

Frontend ui refactor
This commit is contained in:
daniel 2019-03-12 00:56:39 -06:00 committed by GitHub
commit a5def258b5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 26 additions and 13 deletions

BIN
public/css/app.css vendored

Binary file not shown.

BIN
public/css/appdark.css vendored

Binary file not shown.

BIN
public/js/profile.js vendored

Binary file not shown.

BIN
public/js/timeline.js vendored

Binary file not shown.

Binary file not shown.

View file

@ -17,8 +17,11 @@
<div class="username-bar pb-2 d-flex align-items-center">
<span class="font-weight-ultralight h1">{{profile.username}}</span>
<span class="pl-4" v-if="profile.is_admin">
<span class="btn btn-outline-danger font-weight-bold py-0">ADMIN</span>
<span class="btn btn-outline-secondary font-weight-bold py-0">ADMIN</span>
</span>
<span class="pl-4">
<a :href="'/users/'+profile.username+'.atom'" class="fas fa-rss fa-lg text-muted"></a>
</span>
<span class="pl-4" v-if="owner">
<a class="fas fa-cog fa-lg text-muted" href="/settings/home"></a>
</span>
@ -44,7 +47,7 @@
Followers
</a>
</div>
<div v-if="profileSettings.following.count" class="font-weight-light pr-5">
<div v-if="profileSettings.following.count" class="font-weight-light">
<a class="text-dark cursor-pointer" v-on:click="followingModal()">
<span class="font-weight-bold">{{profile.following_count}}</span>
Following

View file

@ -1,13 +1,13 @@
<template>
<div class="container" style="">
<div class="row">
<div class="col-md-8 col-lg-8 pt-2 px-0 my-3 timeline order-2 order-md-1">
<div class="col-md-8 col-lg-8 pt-sm-2 px-0 my-sm-3 timeline order-2 order-md-1">
<div v-if="loading" class="text-center">
<div class="spinner-border" role="status">
<span class="sr-only">Loading...</span>
</div>
</div>
<div class="card mb-4 status-card card-md-rounded-0" :data-status-id="status.id" v-for="(status, index) in feed" :key="status.id">
<div class="card mb-sm-4 status-card card-md-rounded-0" :data-status-id="status.id" v-for="(status, index) in feed" :key="status.id">
<div class="card-header d-inline-flex align-items-center bg-white">
<img v-bind:src="status.account.avatar" width="32px" height="32px" style="border-radius: 32px;">

View file

@ -38,8 +38,7 @@ body, button, input, textarea {
}
.search-form {
min-width: 125px;
width: 265px;
width: 100%;
}
.search-form input,
@ -539,3 +538,16 @@ details summary::-webkit-details-marker {
.cursor-pointer {
cursor: pointer;
}
.tooltip-notification .tooltip-inner {
max-width: 200px;
padding: 3px 8px;
color: #fff;
text-align: center;
background-color: #dc3545;
border-radius: .25rem;
}
.tooltip-notification .tooltip.bs-tooltip-auto[x-placement^=top] .arrow::before, .tooltip.bs-tooltip-top .arrow::before {
border-top-color: #dc3545;
}

View file

@ -39,7 +39,7 @@
@if(Auth::check())
<div class="d-block d-sm-none mt-5"></div>
<div class="d-block d-sm-none fixed-bottom">
<div class="card card-body rounded-0 py-2 d-flex align-items-middle">
<div class="card card-body rounded-0 py-2 d-flex align-items-middle box-shadow" style="border-top:1px solid #F1F5F8">
<ul class="nav nav-pills nav-fill">
<li class="nav-item">
<a class="nav-link {{request()->is('/')?'text-primary':'text-muted'}}" href="/"><i class="fas fa-home fa-lg"></i></a>
@ -48,13 +48,13 @@
<a class="nav-link {{request()->is('timeline/public')?'text-primary':'text-muted'}}" href="/timeline/public"><i class="far fa-map fa-lg"></i></a>
</li>
<li class="nav-item">
<div class="nav-link text-black cursor-pointer" data-toggle="modal" data-target="#composeModal"><i class="fas fa-camera-retro fa-lg"></i></div>
<div class="nav-link text-black cursor-pointer" data-toggle="modal" data-target="#composeModal"><i class="far fa-plus-square fa-lg"></i></div>
</li>
<li class="nav-item">
<a class="nav-link {{request()->is('discover')?'text-primary':'text-muted'}}" href="{{route('discover')}}"><i class="far fa-compass fa-lg"></i></a>
</li>
<li class="nav-item">
<a class="nav-link {{request()->is(Auth::user()->username)?'text-primary':'text-muted'}}" href="{{Auth::user()->url()}}"><i class="far fa-user fa-lg"></i></a>
<a class="nav-link {{request()->is('account/activity')?'text-primary':'text-muted'}} tooltip-notification" href="/account/activity"><i class="far fa-bell fa-lg"></i></a>
</li>
</ul>
</div>

View file

@ -7,7 +7,7 @@
<div class="collapse navbar-collapse" id="navbarSupportedContent">
@auth
<ul class="navbar-nav ml-auto d-none d-md-block">
<ul class="navbar-nav ml-auto">
<form class="form-inline search-form">
<input class="form-control mr-sm-2 search-form-input" placeholder="{{__('navmenu.search')}}" aria-label="search" autocomplete="off">
</form>
@ -36,9 +36,7 @@
</li>
<li class="d-block d-md-none">
<a class="nav-link" href="/account/activity" data-toggle="tooltip" title="Notifications">
<i class="far fa-bell fa-lg"></i>
</a>
</li>
{{-- <li class="pr-2">