Skip to content

Instantly share code, notes, and snippets.

View susanahernandezd's full-sized avatar
🤍

Susana Hernandez susanahernandezd

🤍
View GitHub Profile
.scroll-x {
/*
[1]: All items a forced onto a single line, causing the overflow when necessary.
[2]: Automatic overflow means a scroll bar won’t be present if it isn’t needed
[3]: Make it smooth scrolling on iOS devices before
[4]: Hide the ugly scrollbars in Edge until the scrollable area is hovered
[5]: Hide the scroll bar in WebKit browsers
*/
white-space: nowrap; /* [1] */
overflow-x: auto; /* [2] */
img {
object-fit: cover;
}
.text-ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
// Fluid font size
// @include fluid-type($min_font, $max_font);
/*
.title {
@include fluid-type(2.625rem, 4.25rem)
}
*/
h2 {
font-size: 4vw;
}
p {
font-size: calc(1em +1vw);
line-height: calc(1.4em + 1vw);
}
// Improvement
function getArrayObjectOfNestedValue(arrayObjects, val, key) {
const stack = [...arrayObjects];
while (stack.length > 0) {
const currentObj = stack.shift();
if (currentObj && currentObj[key] && currentObj[key] === val) {
return currentObj;
}
const keys = currentObj instanceof Object ? Object.keys(currentObj) : [];
const menus = [
{
"SeName": "clothing",
"SubCategories": [
{
"SeName": "trousers",
"SubCategories": [
{
"SeName": "trouser-nike",
"SubCategories": [],
html { height: 100%; }
body {height: 100%; }
#content {min-height: 100%; }
// You can use 7 different pseudo-elements to customize web browser’s scrollbar
::-webkit-scrollbar {/* entire scrollbar scope */}
::-webkit-scrollbar-button {/* directional buttons at the top and bottom of the scrollbar */}
::-webkit-scrollbar-track {/* space below the scrollbar */}
::-webkit-scrollbar-track-piece {/* not covered area by the scrollbar-thumb */}
::-webkit-scrollbar-thumb {/* draggable scrollbar itself */}
::-webkit-resizer {/* resizser at the bottom of the scrollbar */}
::-webkit-scrollbar-corner {/* bottom of the scrollbar without resizse */}
*:not(.not-custom-scrollbar) {