Added some sytling

This commit is contained in:
herz 2022-03-14 15:57:12 +01:00
parent 275ddd5717
commit cc6f15de7d
3 changed files with 76 additions and 14 deletions

View File

@ -3,6 +3,66 @@
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<title>{% block titel %}{% endblock %}</title>
<style>
body {
background-color: #212121;
color: #ffffff;
}
h1 {
color: #ffffff;
}
.content {
width: 80%;
margin: 0 auto;
}
.input-form-container {
width: 75%;
margin: 0 auto;
}
.card{
background-color: #424242;
color: #ffffff;
margin-bottom: 10px;
margin-right: 10px;
}
.card-body{
background-color: #424242;
color: #ffffff;
}
.Faceit-elo-and-steamid64 {
width: 80%;
margin: 0 auto;
}
.FaceIT-elo{
background-color: #424242;
color: #ffffff;
}
.SteamID64{
background-color: #424242;
color: #ffffff;
}
.profile-links {
width: 80%;
margin: 0 auto;
}
.status_screen_input {
background-color: #424242;
color: #ffffff;
border-radius: 20px
}
.input-form-container textarea.status_screen_input {
resize: none;
}
</style>
</head>
<body>
<nav class="navbar navbar-light bg-light">
@ -13,7 +73,7 @@
</a>
</div>
</nav>
<div>
<div class="content">
{% block content %}
{% endblock %}
</div>

View File

@ -1,11 +1,13 @@
{% extends "base.html" %}
{% block titel %}Faceit Elo Search by HerZ{% endblock %}
{% block content %}
<div class="input-group">
<div class="input-form-container">
<form action="#" method="post">
<p>Status Screen:</p>
<p><input type="text" name="status_screen_input" /></p>
<p><input type="submit" value="submit" /></p>
<p><textarea name="status_screen_input" class="status_screen_input" rows="25" cols="75" ></textarea></p>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
</div>
{% endblock %}

View File

@ -3,10 +3,10 @@
{% block content %}
<div class="input-group">
{%for steamid in steamids%}
<div class="card" style="width: 18rem;">
<div class="card" >
<img class="Steam-PB" src="{{steam_pic_dict[steamid]}}" alt="Card image cap">
<div class="card-body">
<h5 class="STeam-Name">{{steam_name_dict[steamid]}}</h5>
<h3 class="STeam-Name">{{steam_name_dict[steamid]}}</h3>
<p class="FaceIT-IMG">
{% if faceit_level_dict[steamid] == 1 %}
<img src="/static/faceit1.svg" alt="FaceIT Level 1" width="100" height="100">
@ -33,13 +33,13 @@
{% endif %}
</p>
</div>
<ul class="list-group list-group-flush">
{% if not faceit_elo_dict[steamid] == 0 %}
<li class="list-group-item">FaceIT ELO: {{faceit_elo_dict[steamid]}}</li>
<li class="list-group-item">SteamID: {{steamid64_dict[steamid]}}</li>
{% endif %}
</ul>
<div class="card-body">
{% if not faceit_elo_dict[steamid] == 0 %}
<div class="Faceit-elo-and-steamid64">
<p class="FaceIT-elo">FaceIT ELO: {{faceit_elo_dict[steamid]}}</p>
<p class="SteamID64">SteamID: {{steamid64_dict[steamid]}}</p>
</div>
{% endif %}
<div class="profile-links">
<a href="https://steamcommunity.com/profiles/{{steamid64_dict[steamid]}}" class="card-link">Steam Profile</a>
{% if not faceit_elo_dict[steamid] == 0 %}
<a href="https://www.faceit.com/en/players/{{faceit_name_dict[steamid]}}" class="card-link">FaceIT Link</a>