krll/static/index/style.css

72 lines
1.3 KiB
CSS
Raw Normal View History

2024-02-19 12:21:12 +09:00
main {
align-items: center;
padding-top: 100px;
display: flex;
flex-direction:column;
2024-02-19 12:21:12 +09:00
}
.input-container {
display: flex;
justify-content: center;
width: 500px;
}
@media screen and (max-width: 500px) {
.input-container {
width: 95%;
}
}
.input-container input {
font-size: 20px;
box-sizing: border-box;
padding: 6px;
border: solid 1px var(--border-color);
border-radius: 5px 0 0 5px;
width: 100%;
color: var(--text-color);
background-color: var(--input-background-color);
}
.input-container input:focus {
outline: none;
border-color: var(--border-highlight-color);
}
.input-container button {
font-size: 20px;
box-sizing: border-box;
border: none;
border-radius: 0 5px 5px 0;
color: var(--button-text-color);
background-color: #6F59F5;
padding: 0 10px;
}
.result-container {
display: flex;
flex-direction: column;
align-items: center;
padding-top: 20px;
font-size: 18px;
}
.result-container p {
margin: 0;
}
.result-container #error {
display: none;
}
.result-container #short-url {
cursor: pointer;
margin-top: 10px;
}
.result-container #copied {
opacity: 0;
margin-top: 10px;
margin-bottom: 20px;
font-size: 15px;
}