justuser-31/ss14_chemistry_site
1
0
Fork 0
mirror of https://github.com/Justuser3310/ss14_chemistry_site.git synced 2025-02-08 09:07:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Наработки с верхней панелью

Browse Source
This commit is contained in:
none 2024-02-01 21:26:36 +03:00
parent 963bba8797
commit 326cdf1780
2 changed files with 80 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
assets/style.css
View File

@ -1,32 +1,45 @@
/* Общая характеристика */
body { body {
background-color: #242829; background-color: #242829;
} }
/* Заморочная настройка переключателей */
.Select { .Select {
background-color: rgb(27, 29, 30); background-color: rgb(27, 29, 30);
color: #fff; color: #fff;
} }
.Select-input > input { .Select-input > input {
color: #fff; color: #fff;
} }
.Select .Select-value { .Select .Select-value {
background-color: rgb(27, 29, 30); background-color: rgb(27, 29, 30);
} }
.Select-control { .Select-control {
background-color: rgb(25, 25, 25) !important; background-color: rgb(25, 25, 25) !important;
color: #fff; color: #fff;
} }
.Select-menu-outer { .Select-menu-outer {
background-color: rgb(27, 29, 30); background-color: rgb(27, 29, 30);
color: #fff; color: #fff;
border-radius: 10; border-radius: 10;
} }
.has-value.Select--single>.Select-control .Select-value .Select-value-label, .has-value.is-pseudo-focused.Select--single>.Select-control .Select-value .Select-value-label{ .has-value.Select--single>.Select-control .Select-value .Select-value-label, .has-value.is-pseudo-focused.Select--single>.Select-control .Select-value .Select-value-label{
color: white color: white;
}
/* Div для социалок */
.socials {
background-color: #2e4ebf;
border-radius: 15px;
display: flex;
flex-direction: row;
padding-left: 1%;
padding-right: 1%;
}
/* Текст социалок */
.socials_text {
color: white;
text-decoration: auto;
padding-left: 8%;
} }

66
site.py
View File

@ -3,13 +3,39 @@ from db import *
db = read_db() db = read_db()
els = list(db.keys()) els = list(db.keys())
## Сайт
###### ОФОРМЛЕНИЕ #######
from dash import Dash, dcc, html, Input, Output,callback from dash import Dash, dcc, html, Input, Output,callback
app = Dash(__name__, title="SS14 Tools", update_title=None) app = Dash(__name__, title="SS14 Tools", update_title=None)
#### ФОРМАТ СТРАНИЦЫ ####
app.index_string = '''
<!DOCTYPE html>
<html>
<head>
{%metas%}
<title>{%title%}</title>
{%favicon%}
{%css%}
</head>
<body>
{%app_entry%}
<footer>
{%config%}
{%scripts%}
{%renderer%}
</footer>
</body>
</html>
'''
###### ОФОРМЛЕНИЕ #######
# Форматируем список для красоты # Форматируем список для красоты
def list_form(ll): def list_form(ll):
global db global db
@ -17,7 +43,8 @@ def list_form(ll):
formatted = [] formatted = []
imgs = {'medicine': '💊', imgs = {'medicine': '💊',
'chemicals': '🧪', 'chemicals': '🧪',
'botany': '🪴'} 'botany': '🪴',
'drinks': '🍸'}
for i in ll: for i in ll:
if type(i) == int: if type(i) == int:
@ -31,21 +58,47 @@ def list_form(ll):
# 'background-color': 'rgb(27, 29, 30)', 'color': 'rgb(255,255,255)' # 'background-color': 'rgb(27, 29, 30)', 'color': 'rgb(255,255,255)'
# Типо контейнер для всего
# [
# Div,
# Div
# ]
app.layout = html.Div([ app.layout = html.Div([
# Соцсети и исходный код + название
html.Div([
html.Div([
html.Img(src='assets/favicon.ico', width='50px', height='auto', style={'padding':10}),
html.Div(children='''SS14 Tools'''
, style={'color':'rgb(255,255,255)', 'font-weight': 'bold', 'font-size': '1.5rem'})
], style={'display': 'flex', 'flex-wrap': 'wrap', 'align-items': 'center', 'flex': 1}),
html.Div([
dcc.Link('Discord',href='https://discord.gg/VxHbM3cedQ'),
dcc.Link('Telegram',href='https://t.me/ss14tools')
], style={'display': 'flex', 'flex-wrap': 'wrap', 'align-items': 'center', 'flex': 1}),
#Пустой контейнер (для правильного отображения)
html.Div(style={'flex':1})
], style={'background-color': '#161819', 'margin': -8, 'display': 'flex', 'flexDirection': 'row', 'justify-content': 'flex-start'}),
# Название + объём + вывод
html.Div([
# Название + объём # Название + объём
html.Div([ html.Div([
# Реакция # Реакция
html.Div([ html.Div([
dcc.Dropdown(list_form(els), id='reaction', placeholder="Реакция", maxHeight=500, dcc.Dropdown(list_form(els), id='reaction', placeholder="Реакция", maxHeight=500,
style={'font-size': '120%'}) #, 'background-color': 'rgb(27, 29, 30)'}) style={'font-size': '120%', 'font-family': 'NotaSans'})
], style={'flex': 4}), ], style={'flex': 4}),
# Объём # Объём
html.Div([ html.Div([
dcc.Dropdown(list_form([30, 50, 100, 300, 1000]), 100, id='amount', clearable=False, searchable=False dcc.Dropdown(list_form([30, 50, 100, 300, 1000]), 100, id='amount', clearable=False, searchable=False
, style={'font-family': '"Source Sans Pro", sans-serif', 'font-size': '120%'}) #, 'background-color': 'rgb(27, 29, 30)'}) , style={'font-family': '"Source Sans Pro", sans-serif', 'font-size': '120%'}) #, 'background-color': 'rgb(27, 29, 30)'})
], style={'flex': 1, 'padding-left': 25}) #, 'background-color': 'rgb(27, 29, 30)'}) ], style={'flex': 1, 'padding-left': 25})
], style={'display': 'flex', 'flexDirection': 'row'}), ], style={'display': 'flex', 'flexDirection': 'row'}),
@ -54,6 +107,7 @@ html.Div([
], style={'padding': '5%', 'margin-left': '30%', 'margin-right': '30%'}) ], style={'padding': '5%', 'margin-left': '30%', 'margin-right': '30%'})
])
# vh - высота окна, vw - ширина окна # vh - высота окна, vw - ширина окна
# #
# 'background-color': '#242829', # 'background-color': '#242829',