ソースを参照

Make a first stab at a mobile layout

tags/v1.1.0
Fen Dweller 6年前
コミット
85c50ad408
1個のファイルの変更40行の追加4行の削除
  1. +40
    -4
      style.css

+ 40
- 4
style.css ファイルの表示

@@ -56,23 +56,59 @@ body.dark div {
margin: auto; margin: auto;
} }


@media (max-aspect-ratio: 16/9){
@media (max-aspect-ratio: 1/1){
.game-area { .game-area {
width: 100% width: 100%
height: 60%; height: 60%;
} }
#stat-container {
position: fixed;
top: 0%;
left: 0%;
max-width: 50%;
max-height: 50%;
}
#action-panel {
position: fixed;
right: 0%;
top: 0%;
max-width: 33%;
max-height: 50%;
}
#log { #log {
height: 80vh;
max-height: 50vh;
position: fixed;
left: 0%;
bottom: 0%;
width: 50%;
height: 50%;
max-height: 50%;
margin: 0 0 1vh 0; margin: 0 0 1vh 0;
} }
#react-log { #react-log {
position: fixed;
right: 0%;
bottom: 0%;
width: 50%;
height: 50%;
max-height: 50%;
margin: 1vh 0 0 0; margin: 1vh 0 0 0;
height: 40vh; height: 40vh;
} }
.growth-part {
width: 100px !important;
}
.growth-amount {
width: 100px !important;
}
.action-part-button {
width: 100px !important;
}
.action-button {
width: 100px !important;
}
} }


@media (min-aspect-ratio: 16/10){
@media (min-aspect-ratio: 1/1){
.game-area { .game-area {
width: 90% width: 90%
} }


読み込み中…
キャンセル
保存