More style changes

This commit is contained in:
Gregory Ballantine 2022-11-21 18:48:49 -05:00
parent b347988937
commit 3ac8671742
4 changed files with 44 additions and 17 deletions

View File

@ -1,10 +1,12 @@
$primary-color: yellow $primary-color: #009688
$primary-color-highlight: darken($primary-color, 10%) $primary-color-highlight: lighten($primary-color, 10%)
$accent-color: #795548
$accent-color-highlight: lighten($accent-color, 10%)
$box-shadow-1: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23) $box-shadow-1: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23)
$box-shadow-2: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) $box-shadow-2: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23)
$nav-height: 60px $nav-height: 75px
body body
padding-top: $nav-height padding-top: $nav-height
@ -12,6 +14,25 @@ body
background: lightgrey background: lightgrey
font-size: 16px font-size: 16px
a
color: $accent-color
transition: all 230ms ease-in-out
&:hover
color: $accent-color-highlight
.button.button-primary,
button.button-primary,
input[type="button"].button-primary,
input[type="reset"].button-primary,
input[type="submit"].button-primary
background-color: $primary-color
border-color: $primary-color
font-size: 1.5rem
transition: all 230ms ease-in-out
&:hover
background-color: $primary-color-highlight
border-color: $primary-color-highlight
.container .container
max-width: 1100px max-width: 1100px
padding: 20px 30px padding: 20px 30px
@ -26,9 +47,10 @@ body
left: 0 left: 0
width: 100% width: 100%
height: $nav-height height: $nav-height
background: #212121 background: $primary-color
color: #eee color: white
font-size: 2.75rem font-size: 3rem
font-weight: bold
box-shadow: $box-shadow-1 box-shadow: $box-shadow-1
z-index: 100 z-index: 100
@ -41,19 +63,23 @@ body
li li
display: inline-block display: inline-block
margin-top: 6px margin-top: 12px
margin-left: 15px margin-left: 15px
.nav-link a .nav-link a
color: $primary-color color: white
transition: all 230ms ease-in-out
&:hover &:hover
color: $primary-color-highlight color: #eee
#main-wrapper #main-wrapper
margin-top: 25px margin-top: 25px
#ticket-form
textarea
max-width: 100%
height: 250px
min-height: 100px
#ticket-header #ticket-header
margin-bottom: 15px margin-bottom: 15px
@ -103,10 +129,12 @@ body
position: relative position: relative
display: inline-block display: inline-block
box-sizing: border-box box-sizing: border-box
width: calc(50% - 3px) width: 50%
height: 100% height: 100%
padding: 10px 12px padding: 10px 12px
text-align: center text-align: center
&:hover
background: rgba(0, 0, 0, .1)
i i
margin-right: 5px margin-right: 5px

View File

@ -34,7 +34,7 @@
<label for="ticket_body">Ticket body</label> <label for="ticket_body">Ticket body</label>
<textarea id="ticket_body" class="u-full-width" placeholder="Explain what this ticket is about..." name="ticket_body"></textarea> <textarea id="ticket_body" class="u-full-width" placeholder="Explain what this ticket is about..." name="ticket_body"></textarea>
<input class="button-primary" type="submit" value="Submit"> <input class="button-primary u-full-width" type="submit" value="Submit">
</form> </form>
</div> </div>
</div> </div>

View File

@ -11,7 +11,7 @@
<div class="row"> <div class="row">
<div class="columns twelve"> <div class="columns twelve">
<form action="{{ url_for('ticket.edit', {ticket_id: ticket.id}) }}" method="POST" class="u-full-width"> <form id="ticket-form" action="{{ url_for('ticket.edit', {ticket_id: ticket.id}) }}" method="POST" class="u-full-width">
<div class="row"> <div class="row">
<div class="six columns"> <div class="six columns">
<label for="ticket_title">Title</label> <label for="ticket_title">Title</label>
@ -34,7 +34,7 @@
<label for="ticket_body">Ticket body</label> <label for="ticket_body">Ticket body</label>
<textarea id="ticket_body" class="u-full-width" placeholder="Explain what this ticket is about..." name="ticket_body">{{ ticket.body }}</textarea> <textarea id="ticket_body" class="u-full-width" placeholder="Explain what this ticket is about..." name="ticket_body">{{ ticket.body }}</textarea>
<input class="button-primary" type="submit" value="Submit"> <input class="button-primary u-full-width" type="submit" value="Submit">
</form> </form>
</div> </div>
</div> </div>

View File

@ -26,8 +26,7 @@
<ul class="ticket-status"> <ul class="ticket-status">
<li class="ticket-actions"> <li class="ticket-actions">
<ul> <ul>
<li><a href="{{ url_for('ticket.edit', {ticket_id: ticket.id}) }}"><i class="fa-solid fa-pen-to-square"></i>Edit</a></li> <li><a href="{{ url_for('ticket.edit', {ticket_id: ticket.id}) }}"><i class="fa-solid fa-pen-to-square"></i>Edit</a></li><li><a href="{{ url_for('ticket.edit', {ticket_id: ticket.id}) }}"><i class="fa-solid fa-trash"></i>Delete</a></li>
<li><a href="{{ url_for('ticket.edit', {ticket_id: ticket.id}) }}"><i class="fa-solid fa-trash"></i>Delete</a></li>
</ul> </ul>
</li> </li>
<li> <li>