71 lines
1.9 KiB
CSS
71 lines
1.9 KiB
CSS
.ui.button {
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
border: none;
|
|
font-size: 1rem;
|
|
font-family: var(--main-font);
|
|
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;
|
|
}
|
|
}
|
|
}
|