lbry.tech/app/sass/init/_base.scss
ポール ウェッブ c65b1a5356 LOTS of Sass refactoring
2018-10-05 17:46:08 -05:00

192 lines
2.7 KiB
SCSS

// sass-lint:disable no-important
html {
box-sizing: border-box;
text-rendering: optimizeLegibility;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
*,
*::before,
*::after {
margin: 0; padding: 0;
box-sizing: inherit;
outline: 0 !important;
}
a,
area,
button,
[role="button"],
input,
label,
select,
summary,
textarea {
touch-action: manipulation; // Remove touch delay on supported devices
}
a {
color: currentColor;
text-decoration: none;
}
*[readonly] {
cursor: not-allowed;
}
textarea {
&:not([disabled]) {
resize: vertical;
}
&[disabled] {
resize: none;
}
}
button {
&:not(:disabled) {
cursor: pointer;
}
}
button,
input,
select,
textarea {
border: none;
border-radius: 0;
font-family: inherit;
font-size: inherit;
-moz-appearance: none;
-webkit-appearance: none;
&:focus {
outline: none;
}
}
input,
select,
textarea {
background-color: transparent;
}
[type="button"],
[type="submit"] {
cursor: pointer;
}
iframe {
border: none;
}
img {
max-width: 100%;
font-size: 0;
&::after {
width: 100%; height: 100%;
top: -100%; left: 0;
background-color: $white;
background-image: url("/assets/media/images/missing.png");
background-size: cover;
box-shadow: 0 0 1px 0 rgba($black, 0.3);
content: "";
display: block;
position: relative;
}
}
@media print {
// Intelligent print styles
pre,
blockquote {
border: 1px solid #999 !important;
page-break-inside: avoid !important;
}
tr,
img {
page-break-inside: avoid !important;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm !important;
}
p,
h2,
h3 {
orphans: 3 !important;
widows: 3 !important;
}
h2,
h3 {
page-break-after: avoid !important;
}
thead {
display: table-header-group !important;
}
// Faster, more stable printing
* {
background: transparent !important;
color: #000 !important;
filter: none !important;
text-shadow: none !important;
}
p {
a {
&[href]::after { // Show hypertext data for links and abbreviations
content: " (" attr(href) ")" !important;
}
&[href^="javascript:"],
&[href^="#"] {
&::after {
content: "" !important;
}
}
}
abbr {
&[title]::after {
content: " (" attr(title) ")" !important;
}
}
a,
abbr {
text-decoration: underline !important;
word-wrap: break-word !important;
}
}
}
input::-moz-focus-inner,
button::-moz-focus-inner {
display: none;
}
// Get rid of yellow autofill background
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0 1000px $white inset !important;
&:focus {
outline: none;
}
}