Skip to content

Commit aa532d5

Browse files
Salvatore112Salvatore112
committed
style: change the style of buttons
1 parent 0a004b4 commit aa532d5

1 file changed

Lines changed: 45 additions & 19 deletions

File tree

‎templates/simulations/setup.html‎

Lines changed: 45 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -99,25 +99,34 @@
9999
display: flex;
100100
gap: 0.5rem;
101101
}
102-
.btn-green {
103-
background-color: #28a745;
104-
border: none;
105-
color: white;
102+
/* Unified button styles: outline style for both auth and profile/logout */
103+
.btn-outline-primary {
104+
color: #0d6efd;
105+
border-color: #0d6efd;
106+
background-color: transparent;
106107
transition: all 0.2s ease;
107108
}
108-
.btn-green:hover {
109-
background-color: #218838;
110-
color: white;
111-
}
112-
.btn-blue {
109+
.btn-outline-primary:hover {
113110
background-color: #0d6efd;
114-
border: none;
115-
color: white;
111+
color: #fff;
112+
border-color: #0d6efd;
113+
}
114+
.btn-outline-danger {
115+
color: #dc3545;
116+
border-color: #dc3545;
117+
background-color: transparent;
116118
transition: all 0.2s ease;
117119
}
118-
.btn-blue:hover {
119-
background-color: #0b5ed7;
120-
color: white;
120+
.btn-outline-danger:hover {
121+
background-color: #dc3545;
122+
color: #fff;
123+
border-color: #dc3545;
124+
}
125+
/* Removing old green/blue specific button classes, keeping for consistency but not used in new design.
126+
However, we'll keep the structure but override with outline style. To match exactly,
127+
we apply .btn-outline-primary and .btn-outline-danger for all action buttons. */
128+
.btn-green, .btn-blue {
129+
/* These are replaced by outline classes, but keep for backward if any; we'll not use them */
121130
}
122131
.user-info {
123132
display: flex;
@@ -132,6 +141,20 @@
132141
font-weight: 500;
133142
font-size: 0.875rem;
134143
}
144+
.action-buttons-group {
145+
display: flex;
146+
gap: 0.5rem;
147+
}
148+
/* Ensure consistent sizing for all buttons in the auth section */
149+
.btn-sm {
150+
font-size: 0.875rem;
151+
padding: 0.375rem 0.75rem;
152+
border-radius: 0.375rem;
153+
}
154+
/* Additional style for consistency: any custom button must look similar */
155+
.btn-outline-primary, .btn-outline-danger {
156+
font-weight: 500;
157+
}
135158
</style>
136159
</head>
137160
<body>
@@ -144,13 +167,16 @@ <h1 class="card-title mb-0">Multi-Agent Tracking Simulation Setup</h1>
144167
{% if user.is_authenticated %}
145168
<div class="user-info">
146169
<span class="user-badge">{{ user.username }}</span>
147-
<a href="{% url 'accounts:profile' %}" class="btn btn-sm btn-outline-secondary">Profile</a>
148-
<a href="{% url 'accounts:logout' %}" class="btn btn-sm btn-outline-danger">Logout</a>
170+
<div class="action-buttons-group">
171+
<a href="{% url 'accounts:profile' %}" class="btn btn-sm btn-outline-primary">Profile</a>
172+
<a href="{% url 'accounts:logout' %}" class="btn btn-sm btn-outline-danger">Logout</a>
173+
</div>
149174
</div>
150175
{% else %}
151176
<div class="auth-buttons">
152-
<a href="{% url 'accounts:login' %}" class="btn btn-sm btn-green">Sign in</a>
153-
<a href="{% url 'accounts:register' %}" class="btn btn-sm btn-blue">Create account</a>
177+
<!-- Unify design: using same outline style as Profile and Logout buttons -->
178+
<a href="{% url 'accounts:login' %}" class="btn btn-sm btn-outline-primary">Sign in</a>
179+
<a href="{% url 'accounts:register' %}" class="btn btn-sm btn-outline-primary">Create account</a>
154180
</div>
155181
{% endif %}
156182
</div>
@@ -193,7 +219,7 @@ <h5 class="mb-3">User algorithms</h5>
193219

194220
{% if not user.is_authenticated %}
195221
<div class="info-tip mt-3">
196-
<span>📌</span> To add an algorithm create an account. Custom algorithms will have access to the necessary API.
222+
To add an algorithm create an account. Custom algorithms will have access to the necessary API.
197223
<a href="{% url 'accounts:register' %}">Create account</a>
198224
</div>
199225
{% endif %}

0 commit comments

Comments
 (0)