Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

<div class="prediction">のセルを可変にしたい #5

Closed
nimiusrd opened this issue Oct 11, 2017 · 6 comments
Closed

<div class="prediction">のセルを可変にしたい #5

nimiusrd opened this issue Oct 11, 2017 · 6 comments
Labels

Comments

@nimiusrd
Copy link
Contributor

JSで動的に生成する?

@nimiusrd
Copy link
Contributor Author

以下4つのセルの形式(CSS)さえあればJSで作れそう

  • 何もなし
  • 役職
  • アイコン
  • 記号

@nimiusrd
Copy link
Contributor Author

役職は[3, 8]
参加人数[5, 15]

@nimiusrd
Copy link
Contributor Author

画像の大きさはviewportに依存するのではなくセルに依存したほうが良さそう

@nimiusrd
Copy link
Contributor Author

役職数に応じて、grid-template-columnsをJSでイジってやればよさそう
セルのmax-widthとmin-heightを決めて、あとはfrでいい感じにする

@nimiusrd
Copy link
Contributor Author

grid: repeat(${Agent数+1}, 1fr) / repeat(${役職数+1}, 1fr);
ただしセルの最小幅、最大幅の設定が必要

@nimiusrd
Copy link
Contributor Author

最小幅は
minmax(100px , 1fr)
みたいな感じ
最大幅は気になったらなんとかするということにする

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant