mirror of
https://github.com/zulip/zulip.git
synced 2026-06-30 21:11:04 +08:00
07f7089cf3
This commit adds min-height property added by bootstrap to the label.checkbox elements in components.css. We do not need to add padding-left property added by bootstrap since we already set padding to 0. After adding this CSS, we can safely remove the CSS from bootstrap.css.
139 lines
2.9 KiB
CSS
139 lines
2.9 KiB
CSS
/* Reusable, object-oriented CSS base components for all Zulip pages
|
|
(both web app and portico). */
|
|
|
|
.new-style {
|
|
label.checkbox {
|
|
padding: 0;
|
|
display: inline-block;
|
|
position: relative;
|
|
vertical-align: top;
|
|
min-height: 20px;
|
|
|
|
input[type="checkbox"] {
|
|
position: absolute;
|
|
clip: rect(0, 0, 0, 0);
|
|
|
|
~ span {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
position: relative;
|
|
top: -2px;
|
|
|
|
padding: 2px;
|
|
margin: 0 5px 0 0;
|
|
height: 10px;
|
|
width: 10px;
|
|
|
|
font-weight: 300;
|
|
line-height: 0.8;
|
|
font-size: 1.3rem;
|
|
text-align: center;
|
|
border: 1px solid hsla(0, 0%, 0%, 0.6);
|
|
|
|
border-radius: 4px;
|
|
filter: brightness(0.8);
|
|
|
|
cursor: pointer;
|
|
}
|
|
|
|
&:checked ~ span {
|
|
background-image: url("../images/checkbox.svg");
|
|
background-size: 85%;
|
|
background-position: 50% 50%;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
&:disabled ~ span {
|
|
opacity: 0.5;
|
|
cursor: not-allowed;
|
|
}
|
|
}
|
|
}
|
|
|
|
a.no-style {
|
|
color: inherit;
|
|
}
|
|
}
|
|
|
|
a.no-underline,
|
|
a.no-underline:hover {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.half-opacity {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
.simplebar-track {
|
|
.simplebar-scrollbar::before {
|
|
background-color: hsl(0, 0%, 0%);
|
|
box-shadow: 0 0 0 1px hsla(0, 0%, 100%, 0.33);
|
|
}
|
|
|
|
&.simplebar-vertical {
|
|
transition: width 0.2s ease 1s;
|
|
|
|
&.simplebar-hover {
|
|
width: 15px;
|
|
transition: width 0.2s ease;
|
|
}
|
|
}
|
|
|
|
&.simplebar-horizontal {
|
|
transition: height 0.2s ease 1s;
|
|
|
|
&.simplebar-hover {
|
|
height: 15px;
|
|
transition: height 0.2s ease;
|
|
}
|
|
}
|
|
}
|
|
|
|
i.zulip-icon.zulip-icon-bot {
|
|
color: hsl(180, 5%, 74%);
|
|
vertical-align: top;
|
|
padding: 0 2px;
|
|
}
|
|
|
|
.tippy-content {
|
|
/* This actually sets the
|
|
* default font size of only
|
|
* tooltips; popovers should define
|
|
* font-size of their own.
|
|
*/
|
|
font-size: 12px;
|
|
}
|
|
|
|
/* Hide the somewhat buggy browser show password feature in IE, Edge,
|
|
since it duplicates our own "show password" widget. */
|
|
input::-ms-reveal {
|
|
display: none;
|
|
}
|
|
|
|
.password-div {
|
|
position: relative;
|
|
|
|
.password_visibility_toggle {
|
|
position: absolute;
|
|
right: 10px;
|
|
top: 42px;
|
|
opacity: 0.6;
|
|
|
|
&:hover {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
}
|
|
|
|
select.bootstrap-focus-style {
|
|
&:focus {
|
|
outline: 1px dotted hsl(0, 0%, 20%);
|
|
outline: 5px auto -webkit-focus-ring-color;
|
|
outline-offset: -2px;
|
|
}
|
|
}
|