panki/bingo-cli
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

make it look nicer

Browse Source
This commit is contained in:
Felix Pankratz 2024-05-09 19:33:55 +02:00
parent 3198b46892
commit 4d395ae24d
3 changed files with 28 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
BingoField.py
View File

@ -21,20 +21,21 @@ class BingoField(Static):
super().__init__() super().__init__()
self.text = text self.text = text
def on_mount(self) -> None: #def on_mount(self) -> None:
self.styles.content_align = ('center', 'middle') #self.styles.content_align = ('center', 'middle')
self.styles.border = ('solid', 'green') #self.styles.text_align = 'center'
self.styles.height = '100%' #self.styles.border = ('blank', 'green')
self.styles.width = '100%' #self.styles.height = '100%'
#self.styles.width = '100%'
def on_click(self) -> None: def on_click(self) -> None:
self.selected = not self.selected self.selected = not self.selected
if self.selected: if self.selected:
self.styles.animate('background', 'green', duration=0.1) # self.styles.animate('background', 'green', duration=0.1)
self.styles.border = ('solid', 'black') self.add_class('field_selected')
else: else:
self.styles.animate('background', '#1c1c1c', duration=0.1) self.remove_class('field_selected')
self.styles.border = ('solid', 'green') #self.styles.animate('background', '#1c1c1c', duration=0.1)
# The post_message method sends an event to be handled in the DOM # The post_message method sends an event to be handled in the DOM
self.post_message(self.Selected(self.num, self.selected)) self.post_message(self.Selected(self.num, self.selected))

4
bingo.py
View File

@ -18,6 +18,10 @@ class BingoApp(App):
yield Header() yield Header()
yield BingoDisplay() yield BingoDisplay()
def on_mount(self) -> None:
self.title = 'CCC Bingo'
self.sub_title = 'GPN22 Edition'
def action_toggle_dark(self) -> None: def action_toggle_dark(self) -> None:
'''An action to toggle dark mode.''' '''An action to toggle dark mode.'''
self.dark = not self.dark self.dark = not self.dark

21
bingo.tcss
View File

@ -4,6 +4,19 @@ BingoBoard {
height: 100%; height: 100%;
} }
BingoField {
content-align: center middle;
text-align: center;
height: 100%;
width: 100%;
background: $panel;
border: thick $background;
}
BingoField.field_selected {
background: $success;
}
BingoDisplay { BingoDisplay {
layout: vertical; layout: vertical;
height: 100%; height: 100%;
@ -17,18 +30,12 @@ BingoDisplay {
.seed_input { .seed_input {
width: 70%; width: 70%;
border-title-align: left; border-title-align: left;
background: $background;
} }
.roll_btn { .roll_btn {
width: 30%; width: 30%;
} }
.box {
height: 100%;
border: solid green;
text-align: center;
content-align: center middle;
}
Input.-valid { Input.-valid {
border: tall $success 60%; border: tall $success 60%;
} }