mirror of
https://github.com/sissbruecker/linkding
synced 2024-12-01 23:59:10 +00:00
353ba433f0
* base.scss: Prevent zoom-in on focusing inputs on small viewports Adding a media query which sets the font-size for `.form-input` inputs to 1rem. This aims to prevent the zoom-in on small viewports on iOS devics which automatically zoom-in a website if the font-size in a focused input is smaller than 16px. * Update bookmarks/styles/base.scss --------- Co-authored-by: Sascha Ißbrücker <sascha.issbruecker@googlemail.com>
113 lines
1.9 KiB
SCSS
113 lines
1.9 KiB
SCSS
body {
|
|
margin: 20px 10px;
|
|
|
|
@media (min-width: $size-sm) {
|
|
// High horizontal padding accounts for checkboxes that show up in bulk edit mode
|
|
margin: 20px 24px;
|
|
}
|
|
}
|
|
|
|
header {
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
header .toasts {
|
|
margin-bottom: 20px;
|
|
|
|
.toast {
|
|
margin-bottom: 0.4rem;
|
|
}
|
|
|
|
.toast a.btn-clear:visited {
|
|
color: currentColor;
|
|
}
|
|
}
|
|
|
|
.navbar {
|
|
|
|
.navbar-brand {
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.logo {
|
|
width: 28px;
|
|
height: 28px;
|
|
}
|
|
|
|
h1 {
|
|
text-transform: uppercase;
|
|
display: inline-block;
|
|
margin: 0 0 0 8px;
|
|
}
|
|
}
|
|
|
|
.dropdown-toggle {
|
|
}
|
|
}
|
|
|
|
/* Overrides */
|
|
|
|
// Reduce heading sizes
|
|
h1 {
|
|
font-size: inherit;
|
|
}
|
|
|
|
h2 {
|
|
font-size: .85rem;
|
|
color: $gray-color-dark;
|
|
}
|
|
|
|
// Fix up visited styles
|
|
a:visited {
|
|
color: $link-color;
|
|
}
|
|
a:visited:hover {
|
|
color: $link-color-dark;
|
|
}
|
|
.btn-link:visited:not(.btn-primary) {
|
|
color: $link-color;
|
|
}
|
|
.btn-link:visited:not(.btn-primary):hover {
|
|
color: $link-color-dark;
|
|
}
|
|
|
|
// Increase spacing between columns
|
|
.container > .columns > .column:not(:first-child) {
|
|
padding-left: 2rem;
|
|
}
|
|
|
|
// Remove left padding from first pagination link
|
|
.pagination .page-item:first-child a {
|
|
padding-left: 0;
|
|
}
|
|
|
|
// Override border color for tab block
|
|
.tab-block {
|
|
border-bottom: solid 1px $border-color;
|
|
}
|
|
|
|
// Form auto-complete menu
|
|
.form-autocomplete .menu {
|
|
.menu-item.selected > a, .menu-item > a:hover {
|
|
background: $secondary-color;
|
|
color: $primary-color;
|
|
}
|
|
|
|
.group-item, .group-item:hover {
|
|
color: $gray-color;
|
|
text-transform: uppercase;
|
|
background: none;
|
|
font-size: 0.6rem;
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
|
|
// Increase input font size on small viewports to prevent zooming on focus the input
|
|
// on mobile devices. 430px relates to the "normalized" iPhone 14 Pro Max
|
|
// viewport size
|
|
@media screen and (max-width: 430px) {
|
|
.form-input {
|
|
font-size: 16px;
|
|
}
|
|
}
|