[Favourite][TWIG][CSS] Favourite shows alt-text and properly sets colours. Titles translated on the right panel.
This commit is contained in:
Eliseu Amaro
Hugo Sales
parent
f5175cc59d
commit
5de0704de2
|
|
@ -58,17 +58,24 @@ class Favourite extends Plugin
|
|||
}
|
||||
|
||||
// if note is favourited, "is_set" is 1
|
||||
$opts = ['note_id' => $note->getId(), 'gsactor_id' => $user->getId()];
|
||||
$is_set = DB::find('favourite', $opts) != null;
|
||||
$form = Form::create([
|
||||
['is_set', HiddenType::class, ['data' => $is_set ? '1' : '0']],
|
||||
$opts = ['note_id' => $note->getId(), 'gsactor_id' => $user->getId()];
|
||||
$is_set = DB::find('favourite', $opts) != null;
|
||||
$form_fav = Form::create([
|
||||
['submit_fav', SubmitType::class,
|
||||
[
|
||||
'label' => ' ',
|
||||
'attr' => [
|
||||
'class' => $is_set ? 'favourite-button-on' : 'favourite-button-off',
|
||||
],
|
||||
],
|
||||
],
|
||||
['note_id', HiddenType::class, ['data' => $note->getId()]],
|
||||
["favourite-{$note->getId()}", SubmitType::class, ['label' => ' ', 'attr' => ['class' => $is_set ? 'favourite-button-on' : 'favourite-button-off']]],
|
||||
["favourite-{$note->getId()}", HiddenType::class, ['data' => $is_set ? '1' : '0']],
|
||||
]);
|
||||
|
||||
// Form handler
|
||||
$ret = self::noteActionHandle(
|
||||
$request, $form, $note, "favourite-{$note->getId()}", /**
|
||||
$request, $form_fav, $note, "favourite-{$note->getId()}", /**
|
||||
* Called from form handler
|
||||
*
|
||||
* @param $note Note to be favourited
|
||||
|
|
@ -77,11 +84,11 @@ class Favourite extends Plugin
|
|||
* @throws RedirectException Always thrown in order to prevent accidental form re-submit from browser
|
||||
*/ function ($note, $data) use ($opts, $request) {
|
||||
$fave = DB::find('favourite', $opts);
|
||||
if ($data['is_set'] === '0' && $fave === null) {
|
||||
if ($data["favourite-{$note->getId()}"] === '0' && $fave === null) {
|
||||
DB::persist(Entity\Favourite::create($opts));
|
||||
DB::flush();
|
||||
} else {
|
||||
if ($data['is_set'] === '1' && $fave !== null) {
|
||||
if ($data["favourite-{$note->getId()}"] === '1' && $fave !== null) {
|
||||
DB::remove($fave);
|
||||
DB::flush();
|
||||
}
|
||||
|
|
@ -97,7 +104,7 @@ class Favourite extends Plugin
|
|||
return $ret;
|
||||
}
|
||||
|
||||
$actions[] = $form->createView();
|
||||
$actions[] = $form_fav->createView();
|
||||
return Event::next;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -195,27 +195,18 @@
|
|||
display: block;
|
||||
}
|
||||
|
||||
.favourite-button-off {
|
||||
all: unset;
|
||||
|
||||
cursor: pointer !important;
|
||||
border: none !important;
|
||||
.favourite-button-container button {
|
||||
width: 1em !important;
|
||||
height: 1em !important;
|
||||
background-size: cover !important;
|
||||
background-image: url(../icons/heart.svg) !important;
|
||||
filter: invert(26%) sepia(21%) saturate(580%) hue-rotate(201deg) brightness(96%) contrast(93%);
|
||||
border: unset !important;
|
||||
padding: unset !important;
|
||||
mask-image: url("../icons/heart.svg") !important;
|
||||
}
|
||||
.favourite-button-off {
|
||||
background: var(--bg2) !important;
|
||||
}
|
||||
.favourite-button-on {
|
||||
all: unset;
|
||||
|
||||
cursor: pointer !important;
|
||||
border: none !important;
|
||||
width: 1em !important;
|
||||
height: 1em !important;
|
||||
background-size: cover !important;
|
||||
background-image: url(../icons/heart.svg) !important;
|
||||
filter: invert(100%);
|
||||
background: var(--white) !important;
|
||||
}
|
||||
|
||||
.note-content {
|
||||
|
|
|
|||
|
|
@ -26,11 +26,11 @@
|
|||
|
||||
background-color: var(--translucent);
|
||||
}
|
||||
.section-title-hamburger {
|
||||
.section-title-menu {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.section-title-hamburger svg {
|
||||
.section-title-menu svg {
|
||||
align-self: center;
|
||||
fill: var(--white);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,56 +0,0 @@
|
|||
form {
|
||||
width: 50%;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
padding: var(--main-size);
|
||||
border-radius: var(--unit-size);
|
||||
}
|
||||
|
||||
fieldset {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
font-family: var(--display-font);
|
||||
font-size: var(--main-size);
|
||||
}
|
||||
|
||||
fieldset legend {
|
||||
margin-bottom: var(--main-size);
|
||||
}
|
||||
|
||||
br {
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
label {
|
||||
font-family: var(--display-font);
|
||||
font-size: var(--medium-size);
|
||||
}
|
||||
|
||||
input[type="text"]:hover,
|
||||
input[type="password"]:hover,
|
||||
input[type="email"]:hover,
|
||||
input[type="text"]:focus,
|
||||
input[type="password"]:focus,
|
||||
input[type="email"]:focus {
|
||||
background: var(--white) !important;
|
||||
color: var(--bg1) !important;
|
||||
transition: all 0.4s ease;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
input[type="email"] {
|
||||
all: unset;
|
||||
background: var(--translucent);
|
||||
padding: var(--unit-size) var(--small-size);
|
||||
box-sizing: border-box;
|
||||
border-radius: var(--unit-size);
|
||||
font-size: var(--medium-size);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
fieldset div:last-child {
|
||||
text-align: end;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 3.1 KiB |
|
|
@ -29,7 +29,7 @@
|
|||
</head>
|
||||
|
||||
<body class="bg">
|
||||
{% block header %}
|
||||
{% block header %}
|
||||
<div id='header'>
|
||||
<details class="panel" id="left-container">
|
||||
<summary tabindex="1">
|
||||
|
|
|
|||
|
|
@ -14,10 +14,15 @@
|
|||
{% endif %}
|
||||
|
||||
<div class="note-actions">
|
||||
|
||||
{% if have_user %}
|
||||
{% for act in get_note_actions(note) %}
|
||||
{{ form(act) }}
|
||||
{% for current_action in get_note_actions(note) %}
|
||||
{{ form_start(current_action) }}
|
||||
{% if current_action.submit_fav is defined %}
|
||||
<span title="Favourite this note." class="favourite-button-container">
|
||||
{{ form_widget(current_action.submit_fav) }}
|
||||
</span>
|
||||
{% endif %}
|
||||
{{ form_end(current_action) }}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/security/security.css') }}">
|
||||
{% endblock %}
|
||||
|
||||
{% block title %}Log in!{% endblock %}
|
||||
{% block title %}{{ "Log in!" | trans }}{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div class='content'>
|
||||
|
|
@ -17,34 +17,26 @@
|
|||
<div class="alert alert-danger">{{ error.messageKey | trans(error.messageData, 'security') }}</div>
|
||||
{% endif %}
|
||||
|
||||
<p>
|
||||
{% if app.user %}
|
||||
<h1 class="mb-3">
|
||||
You are logged in as {{ app.user.username }}.
|
||||
<br>
|
||||
<button class="btn btn-lg btn-primary">
|
||||
<a href="{{ path('app_logout') }}">{{ "Logout" | trans }}</a>
|
||||
</button>
|
||||
</h1>
|
||||
{% else %}
|
||||
{# TODO: Login can be done with email, so the id's and stuff should reflect that, along with using the translation facilities #}
|
||||
<label for="inputNickname">{{ "Nickname or Email" | trans }}</label>
|
||||
<br>
|
||||
<input type="text" value="{{ last_login_id }}" name="nickname" id="inputNickname"
|
||||
class="form-control" required autofocus>
|
||||
{% if app.user %}
|
||||
<h1 class="mb-3">
|
||||
{{ "You are logged in as" | trans }} {{ app.user.username }}.
|
||||
<button class="btn btn-lg btn-primary">
|
||||
<a href="{{ path('app_logout') }}">{{ "Logout" | trans }}</a>
|
||||
</button>
|
||||
</h1>
|
||||
{% else %}
|
||||
{# TODO: Login can be done with email, so the id's and stuff should reflect that, along with using the translation facilities #}
|
||||
<label for="inputNickname">{{ "Nickname or Email" | trans }}</label>
|
||||
<input type="text" value="{{ last_login_id }}" name="nickname" id="inputNickname" class="form-control" required autofocus>
|
||||
{% endif %}
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label for="inputPassword">{{ "Password" | trans }}</label>
|
||||
<br>
|
||||
<input type="password" name="password" id="inputPassword" class="form-control" required>
|
||||
</p>
|
||||
<label for="inputPassword">{{ "Password" | trans }}</label>
|
||||
<input type="password" name="password" id="inputPassword" class="form-control" required>
|
||||
|
||||
<input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
|
||||
|
||||
<p class="checkbox mb-3">
|
||||
<label>{{ "Remember me" | trans}}</label>
|
||||
<label>{{ "Remember me" | trans }}</label>
|
||||
<input type="checkbox" name="_remember_me">
|
||||
</p>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,17 +1,16 @@
|
|||
<aside id='right-panel'>
|
||||
{% if post_form is defined %}
|
||||
<section class="section-widget">
|
||||
<legend class="section-title">
|
||||
<details>
|
||||
<summary class="section-title-hamburger">
|
||||
Create a note {{ icon('plus-circle', 'icon icon-plus') | raw }}
|
||||
</summary>
|
||||
<details class="section-title">
|
||||
<summary class="section-title-menu">
|
||||
{{ "Create a note" | trans }}
|
||||
{{ icon('plus-circle', 'icon icon-plus') | raw }}
|
||||
</summary>
|
||||
|
||||
{% for tab in tabs %}
|
||||
<a class="section-title-hamburger-element" href={{ path(tab['href']) }}>{{ tab['title'] }}</a>
|
||||
{% endfor %}
|
||||
</details>
|
||||
</legend>
|
||||
{% for tab in tabs %}
|
||||
<a class="section-title-menu-element" href={{ path(tab['href']) }}>{{ tab['title'] }}</a>
|
||||
{% endfor %}
|
||||
</details>
|
||||
|
||||
<div class="section-form">
|
||||
{{ form_start(post_form) }}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user