Yurdle/assets/css/yurdle.css

125 lines
1.8 KiB
CSS
Raw Normal View History

2024-01-07 03:27:44 +03:00
#tebriks {
text-align: center;
font-size: larger;
font-weight: 800;
color: blue;
background-color: coral;
padding: 3px;
border: 1px solid white;
}
2024-01-07 21:37:14 +03:00
.latest-guess {
visibility: hidden;
opacity: 0;
}
.latest-guess.fade {
visibility: inherit;
opacity: 1;
transition: opacity 1s;
}
2024-01-07 03:27:44 +03:00
.innot {
text-align: center;
}
.guess-table {
width: 100%;
display: table;
overflow-x: auto;
-ms-overflow-style: none;
scrollbar-width: none;
}
@media screen and (max-device-width: 1000px) {
.guess-table {
display: block;
overflow-x: auto;
}
}
.guess-th {
border: aliceblue 3px solid;
}
.guess-td {
text-align: center;
border: aliceblue 1px solid;
}
.type0 {
background-color: red;
font-weight: 800;
}
.type1 {
background-color: orange;
color: darkblue;
font-weight: 500;
}
.type2 {
background-color: green;
}
.type10 {
background-color: red;
font-weight: 800;
}
.type10::after {
content: "👇"
}
.type12 {
background-color: red;
font-weight: 800;
}
.type12::after {
content: "👆"
2024-01-07 15:35:18 +03:00
}
/* */
/* AUTOCOMPLETE */
/* */
.autocomplete {
/*the container must be positioned relative:*/
position: relative;
display: inline-block;
box-sizing: border-box;
}
.autocomplete-items {
box-sizing: border-box;
position: absolute;
border: 2px solid #10161d;
border-bottom: none;
border-top: none;
z-index: 99;
/*position the autocomplete items to be the same width as the container:*/
top: 100%;
left: 0;
right: 0;
}
.autocomplete-items div {
padding: 10px;
cursor: pointer;
background-color: #96939B;
border-bottom: 1px solid #10161d;
}
.autocomplete-items div:hover {
/*when hovering an item:*/
background-color: #00ADB5;
color: #e8e8e8;
}
.autocomplete-active {
/*when navigating through the items using the arrow keys:*/
background-color: #00ADB5 !important;
color: #e8e8e8;
2024-01-07 03:27:44 +03:00
}