Skip to content

Commit

Permalink
fix styling
Browse files Browse the repository at this point in the history
  • Loading branch information
@Kerrialn
Kerrialn committed Jan 11, 2024
1 parent ffd3e64 commit 68dcb0a
Show file tree
Hide file tree
Showing 24 changed files with 107 additions and 71 deletions.
22 changes: 19 additions & 3 deletions assets/styles/_variables.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,8 @@ $enable-shadows: true !default;

// Body

$border-color: $gray-400 !default;

$body-color: $gray-700 !default;

$headings-color: $gray-900 !default;
Expand Down Expand Up @@ -88,14 +90,24 @@ $btn-active-box-shadow: $box-shadow !default;
// Forms

$form-label-font-weight: 500 !default;
$input-border-color: $gray-400 !default;
$input-border-radius: 0 !default;
$input-box-shadow: 0 !default;

$input-box-shadow: $box-shadow !default;

$input-focus-border-color: $gray-400 !default;
$input-focus-color: $black;
$input-focus-box-shadow: 0 !default;
$input-group-addon-bg: $gray-100 !default;

$border-width: 1px !default;

// Navs

// Select

$form-select-box-shadow: 0 !default;
$form-select-focus-box-shadow: 0 !default;

// Navs
$nav-link-color: $body-color !default;
$nav-link-disabled-color: $secondary !default;
$nav-link-hover-color: $dark !default;
Expand Down Expand Up @@ -164,6 +176,9 @@ $card-cap-padding-y: 1rem !default;
$card-cap-padding-x: 1.5rem !default;
$card-border-width: $border-width !default;

$card-border-radius: 0 !default;
$card-inner-border-radius: 0 !default;

// Toasts

$toast-header-color: $headings-color !default;
Expand All @@ -172,6 +187,7 @@ $toast-header-color: $headings-color !default;

$modal-content-border-color: $gray-300 !default;
$modal-header-border-width: 0 !default;
$modal-content-border-radius: 0 !default;

// List group
$list-group-item-padding-y: 0.75rem !default;
Expand Down
5 changes: 5 additions & 0 deletions assets/styles/app.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,11 @@
@import 'mapbox-gl/src/css/mapbox-gl.css';


.text-bg-dark-grey {
color: #333 !important;
background-color: rgba(0,0,0,0.07) !important;
}

body{
padding: 0;
margin: 0;
Expand Down
2 changes: 1 addition & 1 deletion templates/components/event_invitation_response_form.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
class="list-group-item list-group-item-action border-0 rounded-0 d-flex justify-content-start align-items-center w-50">
<div class="me-3">
<img src="{{ eventInvitation.event.base64Image }}"
class="rounded-circle object-fit-cover border"
class=" object-fit-cover border"
height="50" width="50"/>
</div>
<div>
Expand Down
2 changes: 1 addition & 1 deletion templates/components/event_request_response_form.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
{% else %}
<div class="list-group-item border-0 rounded-0 d-flex justify-content-start align-items-start w-50">
<div class="me-3">
<img src="{{ eventRequest.owner.avatar }}" class="rounded-circle border" height="50"/>
<img src="{{ eventRequest.owner.avatar }}" class=" border" height="50"/>
</div>
<div>
<div>{{ eventRequest.owner.fullName }}</div>
Expand Down
4 changes: 2 additions & 2 deletions templates/components/poll_answer_form.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
<div class="d-flex align-items-center">
<div class="lead me-2">{{ pollOption.content }}</div>
{% if userAnswer.pollOption == pollOption %}
<img src="{{ app.user.avatar }}" class="rounded-circle border me-2" height="20" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-title="{{ userAnswer.createdAt|format_datetime(timezone=regional.regionalSettingValueObject.timezone, pattern=date_time_pattern) }}"/>
<img src="{{ app.user.avatar }}" class=" border me-2" height="20" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-title="{{ userAnswer.createdAt|format_datetime(timezone=regional.regionalSettingValueObject.timezone, pattern=date_time_pattern) }}"/>
{% endif %}
</div>
<div>
Expand All @@ -41,7 +41,7 @@
<a href="{{ path('show_profile', {id: poll.owner.id}) }}" class="list-group-item list-group-item-action">
<div class="d-flex justify-content-start align-items-center">
<div>
<img src="{{ poll.owner.avatar }}" class="rounded-circle border me-2" height="50"/>
<img src="{{ poll.owner.avatar }}" class=" border me-2" height="50"/>
</div>
<div>
<div class="fw-bold">{{ poll.owner.fullName }}</div>
Expand Down
4 changes: 2 additions & 2 deletions templates/conversation/show.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
href="{{ path('show_profile', {id: participant.owner.id}) }}">
<div>
<img src="{{ participant.owner.avatar }}" height="50"
class="border rounded-circle me-2"/>
class="border cle me-2"/>
</div>
<div>
<div class="fw-bold lh-1">{{ participant.owner.fullName }}</div>
Expand Down Expand Up @@ -43,7 +43,7 @@
<div class="list-group-item sticky-top z-3 d-flex justify-content-start align-items-center">
<div>
<img src="{{ message.conversationParticipant.owner.avatar }}" height="30"
class="border rounded-circle me-3"/>
class="border cle me-3"/>
</div>
<div>
<div class="fw-bold lh-1">{{ message.conversationParticipant.owner.fullName }}</div>
Expand Down
2 changes: 1 addition & 1 deletion templates/email/invitation-email.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
{% block content %}
<div class="card">
<div class="card-body">
<h1>{{ 'email-intro'|trans({name: user.fullName}) }}</h1>
<h1>{{ 'email-intro'|trans({firstName: user.fullName}) }}</h1>
<p class="lead">{{ 'invitation-text'|trans({title: event.title}) }} </p>
<div class="text-center">
<a class="btn btn-primary btn-lg w-100" target="_blank"
Expand Down
2 changes: 1 addition & 1 deletion templates/email/no-account-participant-invitation-email.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
<table>
<tr>
<th>
<p class="text-center">{{ 'invitation-no-account-text'|trans({title: event.title, name: owner.fullName}) }}</p>
<p class="text-center">{{ 'invitation-text'|trans({title: event.title, name: owner.fullName}) }}</p>
<center data-parsed="">
<table class="button success float-center">
<tr>
Expand Down
2 changes: 1 addition & 1 deletion templates/events/group/discussion/show.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
<div class="d-flex justify-content-between align-items-center">
<div>
<a href="{{ path('show_profile', {id: comment.owner.id}) }}">
<img src="{{ comment.owner.avatar }}" class="rounded-circle border me-2"
<img src="{{ comment.owner.avatar }}" class=" border me-2"
height="50"/>
</a>
</div>
Expand Down
6 changes: 3 additions & 3 deletions templates/events/group/members.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
<div class="list-group-item list-group-item-action d-flex align-items-start justify-content-between">
<div class="me-2 d-flex justify-content-start align-items-start">
<a href="{{ path('show_profile', {id: groupMember.owner.id}) }}">
<img class="rounded-circle border me-3" height="50"
<img class=" border me-3" height="50"
src="{{ groupMember.owner.avatar }}">
</a>
<div>
Expand Down Expand Up @@ -54,7 +54,7 @@
<div class="list-group-item list-group-item-action d-flex align-items-center justify-content-between">
<div class="me-2 d-flex justify-content-start align-items-start">
<a href="{{ path('show_profile', {id: joinRequest.owner.id}) }}">
<img class="rounded-circle border me-3" height="50"
<img class=" border me-3" height="50"
src="{{ joinRequest.owner.avatar }}">
</a>
<div>
Expand Down Expand Up @@ -97,7 +97,7 @@
<div class="list-group-item list-group-item-action d-flex align-items-center justify-content-between">
<div class="me-2 d-flex justify-content-start align-items-start">
<a href="{{ path('show_profile', {id: invitation.owner.id}) }}">
<img class="rounded-circle border me-3" height="50"
<img class=" border me-3" height="50"
src="{{ invitation.owner.avatar }}">
</a>
<div>
Expand Down
29 changes: 16 additions & 13 deletions templates/events/group/show.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,21 +11,21 @@
{{ include('partials/_event-group-navbar.html.twig') }}
</div>
<div class="col-12 col-md-6">
<div class="card mb-3">
<div class="card-body">
<div class="fw-bold text-muted small">{{ 'group-activity'|trans|upper }}</div>
<turbo-frame id="event-group-graph-frame"
src="{{ path('event_group_activity_graph', {id: eventGroup.id }) }}">
<div class="d-flex justify-content-center py-5">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="card mb-3">
<div class="card-body">
<div class="fw-bold text-muted small">{{ 'group-activity'|trans|upper }}</div>
<turbo-frame id="event-group-graph-frame"
src="{{ path('event_group_activity_graph', {id: eventGroup.id }) }}">
<div class="d-flex justify-content-center py-5">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</turbo-frame>
</div>
</div>
</turbo-frame>
</div>
</div>

{% if app.user and eventGroup.isMember(app.user) or app.user and eventGroup.isMaintainer(app.user) %}
{% if app.user and eventGroup.isMember(app.user) or app.user and eventGroup.isMaintainer(app.user) %}
<div class="list-group mb-3 list-group-horizontal d-flex justify-content-between">
<a href="{{ path('create_event', {eventGroup: eventGroup.id}) }}"
class="list-group-item list-group-item-action text-center">
Expand Down Expand Up @@ -70,7 +70,10 @@
<div class="text-center text-muted">{{ 'group-hidden-content'|trans|upper }}</div>
{% endif %}
{% else %}
<div class="text-center text-muted">{{ 'create-account-to-join-group'|trans|upper }}</div>
<div class="text-center mt-5">
<div class="text-muted mb-2">{{ 'create-account-to-join-group'|trans|upper }}</div>
<a class="btn btn-outline-primary" href="{{ path('app_register') }}">{{ 'sign-up'|trans }}</a>
</div>
{% endif %}
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions templates/events/organisers/index.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
<div class="list-group-item d-flex justify-content-between align-items-start">
<div class="d-flex justify-content-start">
<div class="me-3">
<img height="50" class="rounded-circle border" src="{{ organiser.owner.avatar }}"/>
<img height="50" class=" border" src="{{ organiser.owner.avatar }}"/>
</div>
<div>
<div>{{ organiser.owner.fullName }}</div>
Expand Down Expand Up @@ -63,7 +63,7 @@
<div class="d-flex justify-content-start align-items-start">
<div>
<a href="{{ path('show_profile', {id: inviation.owner.id}) }}">
<img class="rounded-circle border me-3"
<img class=" border me-3"
src="{{ inviation.owner.avatar }}"
height="50"/>
</a>
Expand Down
17 changes: 8 additions & 9 deletions templates/events/show.html.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -82,10 +82,9 @@
<div class="fw-bold">{{ event.eventGroup.name }}</div>
</a>
{% endif %}
<div class="list-group-item d-flex">
<div>{{ event.startAt|format_date(timezone=regional.regionalSettingValueObject.timezone,pattern=day_date_pattern) }}</div>
<div>{{ event.startAt|format_time(timezone=regional.regionalSettingValueObject.timezone,pattern=time_pattern) }}
- {{ event.endAt|format_time(timezone=regional.regionalSettingValueObject.timezone,pattern=time_pattern) }}</div>
<div class="list-group-item d-flex justify-content-start align-items-center">
<div class="me-2">{{ event.startAt|format_date(timezone=regional.regionalSettingValueObject.timezone,pattern=day_date_pattern) }} </div>
<div>{{ event.startAt|format_time(timezone=regional.regionalSettingValueObject.timezone,pattern=time_pattern) }} - {{ event.endAt|format_time(timezone=regional.regionalSettingValueObject.timezone,pattern=time_pattern) }}</div>
</div>
<div class="list-group-item d-flex d-flex justify-content-between align-items-center"
{{ stimulus_controller('clipboard', {
Expand Down Expand Up @@ -237,7 +236,7 @@
class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
<div class="d-flex justify-content-start align-items-center">
<div>
<img height="50" class="rounded-circle border me-2"
<img height="50" class=" border me-2"
src="{{ organiser.owner.avatar }}"/>
</div>
<div>
Expand All @@ -259,7 +258,7 @@
<a href="{{ path('show_profile', {id: participant.owner.id}) }}"
class="list-group-item list-group-item-action d-flex justify-content-start">
<div class="me-2">
<img height="50" class="rounded-circle"
<img height="50" class=""
src="{{ participant.owner.avatar }}"/>
</div>
<div>
Expand All @@ -280,7 +279,7 @@
class="list-group-item list-group-item-action d-flex justify-content-start align-items-start">
<div>
<img src="{{ invitation.owner.avatar }}"
class="rounded-circle border me-2"
class=" border me-2"
height="50"/>
</div>
<div>
Expand Down Expand Up @@ -348,7 +347,7 @@
<div class="card mb-3">
<div class="card-header bg-white sticky-top">
<div class="d-flex justify-content-start align-items-start">
<img class="rounded-circle me-2 border"
<img class=" me-2 border"
src="{{ imageCollection.owner.avatar }}"
width="40"
height="40"/>
Expand Down Expand Up @@ -417,7 +416,7 @@
{% for invitation in event.eventEmailInvitations %}
<div {{ stimulus_target('list-group-search', 'item') }}
data-searchable-content="{{ invitation.email }}"
class="list-group-item d-flex justify-content-between align-items-center">
class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
<div>
<div>{{ invitation.email }}</div>
<div>{{ invitation.createdAt|time_ago }}</div>
Expand Down
2 changes: 1 addition & 1 deletion templates/macro/event.macro.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@
<a href="{{ path('show_profile', {id: event.owner.id}) }}"
class="list-group-item list-group-item-action d-flex justify-content-start align-items-start">
<div>
<img src="{{ event.owner.avatar }}" class="rounded-circle border me-2"
<img src="{{ event.owner.avatar }}" class=" border me-2"
height="35"/>
</div>
<div>
Expand Down
6 changes: 3 additions & 3 deletions templates/macro/group.macro.twig
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="card card-hover h-100">
<div class="card-body text-center">
{% if eventGroup.base64Image %}
<img class="border rounded-circle object-fit-cover mb-2" height="50" width="50"
<img class="border object-fit-cover mb-2" height="50" width="50"
src="{{ eventGroup.base64Image }}"/>
{% endif %}
<div class="fw-bold">{{ eventGroup.name }}</div>
Expand All @@ -27,7 +27,7 @@
class="list-group-item list-group-item-action">
<div class="d-flex justify-content-start align-items-center">
<div>
<img src="{{ comment.owner.avatar }}" class="rounded-circle border me-2"
<img src="{{ comment.owner.avatar }}" class=" border me-2"
height="50"/>
</div>
<div>
Expand All @@ -50,7 +50,7 @@
class="list-group-item list-group-item-action">
<div class="d-flex justify-content-start align-items-center">
<div>
<img src="{{ discussion.owner.avatar }}" class="rounded-circle border me-2"
<img src="{{ discussion.owner.avatar }}" class=" border me-2"
height="50"/>
</div>
<div>
Expand Down
Loading

0 comments on commit 68dcb0a

Please sign in to comment.