#22380: "Provide hooks for custom CSS"
这个案件是关于哪方面的?
发生什么事? 请从下方选择
发生什么事? 请从下方选择
请检查是否已有同课题案件
若肯定,请「投票」给这桩案件。最高票的案件将「优先」处理!
| # | Status | Votes | Game | Type | Title | Last update |
|---|
细节描述
-
• 如果有的话,请将你在屏幕上所看到的错误信息粘贴出来.
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. -
• 请说明你当时想做什么,你做了什么,然后发生了什么
• 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 请以英文复制/粘贴显示文字而非你的语言。 If you have a screenshot of this bug (good practice), you can use a picture hosting service of your choice (snipboard.io for example) to upload it and copy/paste the link here. 这段文本在翻译系统中吗?如果存在,它被翻译是否已超过二十四小时?
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. • 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 请简明而精确地解释您的建议,以便让人明白您想表达的意思。
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. • 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 当你被封锁的时候,屏幕上出现了些什么呢?(空白的屏幕?部分游戏平台画面?错误的信息?)
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. • 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 哪个规则没有被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. -
• 在游戏回放中,是否有不符合游戏规则的地方?如果有的话,请问是在哪一步呢?
• 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 你当时是想做哪个游戏行动?
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. -
• 你在想做什么的时候,触发了这个游戏选项?
-
• 当你想这么做时,发生了什么事(错误信息,游戏状态信息,......)?
• 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 请问这个问题发生在游戏的哪个阶段(当前的游戏说明是什么)?
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. -
• 当你想进行一个游戏行动时,发生了什么事(错误信息,游戏状态信息,......)?
• 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 请描述一下显示画面上面的问题。 If you have a screenshot of this bug (good practice), you can use a picture hosting service of your choice (snipboard.io for example) to upload it and copy/paste the link here.
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. • 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 请以英文复制/粘贴显示文字而非你的语言。 If you have a screenshot of this bug (good practice), you can use a picture hosting service of your choice (snipboard.io for example) to upload it and copy/paste the link here. 这段文本在翻译系统中吗?如果存在,它被翻译是否已超过二十四小时?
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. • 您正使用哪一款浏览器呢?
Google Chrome v79
-
• 请简明而精确地解释您的建议,以便让人明白您想表达的意思。
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. • 您正使用哪一款浏览器呢?
Google Chrome v79
案件历史
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.
增加一些新内容到这篇报告
- 其他的游戏桌 ID / 移动 ID
- 按 F5 是否解决了这个问题?
- 问题是否发生了好几次?还是每次都发生?还是时好时坏?
- If you have a screenshot of this bug (good practice), you can use a picture hosting service of your choice (snipboard.io for example) to upload it and copy/paste the link here.
