cd58916e05
## 概要 [Task3696: ツールの雛形作成](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/3696) - DevContainerを追加 ## レビューポイント - 特になし ## 動作確認状況 - ローカルで確認
34 lines
650 B
CSS
34 lines
650 B
CSS
.snackbar {
|
|
position: fixed;
|
|
top: -100px; /* 上から現れるための初期位置 */
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
background-color: #323232;
|
|
color: #ffffff;
|
|
border-radius: 5px;
|
|
padding: 16px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
min-width: 300px;
|
|
max-width: 80%;
|
|
z-index: 1000;
|
|
transition: top 0.5s ease-in-out; /* アニメーション効果の追加 */
|
|
}
|
|
|
|
.snackbar.show {
|
|
top: 20px; /* 最終的な表示位置 */
|
|
}
|
|
|
|
.snackbar button {
|
|
background: transparent;
|
|
border: none;
|
|
color: #ffffff;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.snackbar p {
|
|
margin: 0;
|
|
margin-right: 16px;
|
|
}
|