DK2/public/assets/css/buttons.css

71 lines
1.9 KiB
CSS
Raw Normal View History

2024-10-12 18:39:28 -05:00
.ui.button {
cursor: pointer;
display: inline-block;
border: none;
font-size: 1rem;
2024-10-16 22:55:47 -05:00
font-family: var(--main-font);
2024-10-12 18:39:28 -05:00
background: #f7f8fa linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1));
box-shadow: 0 1px 0 1px rgba(255, 255, 255, 0.3) inset, 0 0 0 1px #adb2bb inset;
color: #111111;
padding: 0.5rem 1rem 0.5rem;
text-align: center;
border-radius: 3px;
user-select: none;
text-decoration: none;
transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease;
-webkit-tap-highlight-color: transparent;
&:hover {
background-color: #e0e0e0;
background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.1));
box-shadow: 0 1px 0 1px rgba(255, 255, 255, 0.3) inset, 0 0 0 1px #adb2bb inset;
color: rgba(0, 0, 0, 0.8);
}
&.badge {
font-size: 10px;
padding: 0.1rem 0.25rem;
}
&.primary {
background-color: #f4cc67;
background-image: linear-gradient(rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.1));
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset;
color: #111111;
border: 1px solid;
border-color: #C59F43 #AA8326 #957321;
&:hover {
background-color: #fac847;
border-color: #C59F43 #AA8326 #957321;
}
}
&.secondary {
background-color: #444c55;
color: #ffffff;
background-image: linear-gradient(rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.1));
border: 1px solid;
border-color: #3D444C #2F353B #2C3137;
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset;
&:hover {
background-color: #4e5964;
border-color: #32373E #24282D #212429;
}
}
&.danger {
background-color: #e57373;
background-image: linear-gradient(rgba(255, 255, 255, 0.15), rgba(139, 0, 0, 0.1));
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.2) inset;
border: 1px solid;
border-color: #d32f2f #c62828 #b71c1c;
&:hover {
background-color: #d95c5c;
border-color: #b71c1c #a52727 #8e1f1f;
}
}
}