#22380: "Provide hooks for custom CSS"
Sobre o que é este relatório?
O que aconteceu ? Por favor escolha abaixo
O que aconteceu ? Por favor escolha abaixo
Por favor, cheque se já há um report com o mesmo assunto
Se sim, por favor, VOTE para este report. Reports com mais votos recebem PRIORIDADE!
| # | Status | Votes | Game | Type | Title | Last update |
|---|
Descrição detalhada
-
• Por favor copie e cole a mensagem de erro que aparece na tela, se possível.
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. -
• Por favor explique o que queria fazer, o que fez e o que aconteceu
• Qual navegador você está usando?
Google Chrome v79
-
• Por favor copie/cole o texto em inglês em vez de sua língua. Se você tiver uma captura de tela desse bug (boa prática), pode usar um serviço de hospedagem de imagens de sua escolha (por exemplo, snipboard.io) para enviá-la e copiar/colar o link aqui. Este texto está disponível no sistema de traduções? Se sim, foi traduzido há mais de 24 horas?
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. • Qual navegador você está usando?
Google Chrome v79
-
• Por favor, explique sua sugestão precisamente e de forma concisa, de forma que fique o mais fácil possível, entender o que você quer dizer.
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. • Qual navegador você está usando?
Google Chrome v79
-
• O que estava presente na tela quando você estava bloqueado (tela em branco? Parte da imagem do jogo? Mensagem de erro?)
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. • Qual navegador você está usando?
Google Chrome v79
-
• Que parte das regras não foi respeitada pela adaptação do BGA?
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. -
• A violação de regras está visível na revisão do jogo? Se sim, em que número de jogada?
• Qual navegador você está usando?
Google Chrome v79
-
• Qual era a ação de jogo que queria fazer?
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. -
• O que você tentou fazer para provocar esta ação de jogo?
-
• O que aconteceu quando tentou fazer isto(mensagem de erro, mensagem na barra de estado do jogo)?
• Qual navegador você está usando?
Google Chrome v79
-
• Em que passo do jogo ocorre o problema(qual era a instrução corrente do jogo)?
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. -
• O que aconteceu quando tentou fazer essa ação de jogo (mensagem de erro, mensagem na barra de estado do jogo)?
• Qual navegador você está usando?
Google Chrome v79
-
• Por favor descreva o problema de visualização. Se você tiver uma captura de tela desse bug (boa prática), pode usar um serviço de hospedagem de imagens de sua escolha (por exemplo, snipboard.io) para enviá-la e copiar/colar o link aqui.
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. • Qual navegador você está usando?
Google Chrome v79
-
• Por favor copie/cole o texto em inglês em vez de sua língua. Se você tiver uma captura de tela desse bug (boa prática), pode usar um serviço de hospedagem de imagens de sua escolha (por exemplo, snipboard.io) para enviá-la e copiar/colar o link aqui. Este texto está disponível no sistema de traduções? Se sim, foi traduzido há mais de 24 horas?
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. • Qual navegador você está usando?
Google Chrome v79
-
• Por favor, explique sua sugestão precisamente e de forma concisa, de forma que fique o mais fácil possível, entender o que você quer dizer.
This issue groups a few suggestions, but they're closely related so I think it makes sense to only open one issue.
1. Unless boardgamearena.com/bug?id=13845 is implemented first, please add a high-level id or class "cubirds" so that custom CSS can be targetted to only this game. E.g. you could follow the example of Can't Stop and put a <div id="cubirds"> as a child of #game_play_area wrapping #table_wrap and #myhand_wrap; then rules can be written with selector "#cubirds .stockitem" and not worry about breaking other games.
2. A typical card in the DOM looks like
<div id="table_cards_line_0_item_43" class="stockitem " style="top: 0px; left: 786.5px; width: 60px; height: 80px; background-image: url("x.boardgamearena.net/data/themereleases/current/games/cubirds/200616-1303/img/cubirds_cards.png"); background-position: -600% 0%;"></div>
I can understand putting the top and left positions in inline style, but couldn't the width and height go into the stylesheet under selector .stockitem; and the background-image and background-position go into the stylesheet with selector .card_type_6 etc? Having classes for the different birds would also allow custom CSS to do things like using ::before to add helpful text with the names for those who want that.
3. Similarly for the "play birds" cards at the end of each row: these can probably be targetted by their IDs, but it would be nicer to have a class name by which to target them. I'd quite like to play around with alternative graphics.
4. Slightly off topic, but while I'm on the subject of the "play birds" cards, I don't think they need the background-position. The default position works fine because that sprite isn't a sprite sheet. • Qual navegador você está usando?
Google Chrome v79
Histórico do relatório
CSS customs isn't possible anymore (temperally or forever)
Thanks for this report, I discovered that there were existing custom CSS in BGA ^^
For the first point, I think this is indeed something more related to the website, so I'll try to raise this to the admins to get feedback.
Regarding the other points (2,3 and 4) :
The card management is done through a standard way at BGA, using a custom library named stock. You can find more on this on BGA's wiki. en.doc.boardgamearena.com/Stock
This library is responsible to manage the cards positioning, animation... and does it the way you describe, using inline styles.
As a game developer, I have no control over it, but I have to say that sizes and background positioning are managed at a single Javascript place, and therefore doing it there instead of letting the devs do it within the css seems to me like a fair choice.
Adicione alguma coisa para este relatório
- Outro ID de mesa / ID de jogada
- Carregar em F5 resolveu o problema?
- O problema aparece várias vezes? Sempre? Imprevisivelmente?
- Se você tiver uma captura de tela desse bug (boa prática), pode usar um serviço de hospedagem de imagens de sua escolha (por exemplo, snipboard.io) para enviá-la e copiar/colar o link aqui.
