Vaibhav2812

.fs-10 {
  font-size: 10px;
}

.fs-12 {
  font-size: 12px;
}

.fs-14 {
  font-size: 14px;

Vaibhav2812

$font-sizes: 10 12 14 18 24;

@each $size in $font-sizes {
  .fs-#{$size} {
    font-size: #{$size}px;
  }
}

Vaibhav2812

.message-shared, .warning, .error, .success, .message {
  border: 1px solid #ccc;
  padding: 10px;
  color: #333;
  width: 100px;
  height: 100px;
}

.success {
  background-color: green;

Vaibhav2812

.message-shared {
  border: 1px solid #ccc;
  padding: 10px;
  color: #333;
  width: 100px;
  height: 100px;
}
.message {
  @extend .message-shared
}

Vaibhav2812

$sizes: (
  1:20px,
  2: 16px,
  3: 14px,
);

.size {
  font-size: map-get($sizes, 1);
}

Vaibhav2812

.text-normal {
  font-weight: 500;
}

.text-semibold {
  font-weight: 600;
}

.text-bold {
  font-weight: bold;

Vaibhav2812

$font-weights:(
normal: 500,
semibold:600,
bold: bold
);

@each $element, $weight in $font-weights {
  .text-#{$element} {
    font-weight: $weight;
  }

Vaibhav2812

const arr = [ 1, 2, 3, 4];

const arr2 = arr.map((ele) => ele *2);
// [1,4,6,8]

const arr3 = arr.forEach((ele) => ele * 2);
// undefined

Vaibhav2812

const newCountries = countries.map((element, index, arr) => {
   return element.name === 'India' ? {...element, code: '+91'} : element;
})

console.log(newCountries);
[ { code: "+91",name: "India"}, 
  { code: "7",name: "Russia"},
  { code: "86", name: "China"} ]
 
 

Vaibhav2812

const countries = [ { name: 'India', code: '91', lang: 'Hindi' }, { name: 'Russia',
                  code: '7', lang: 'Russian' },{ name: 'China', code: '86', lang: 'Chinese' }];
                  
const countryWithContinent = countries.map((country) => {
    delete country.lang;
    country.continent = 'Asia';
    return country;    
});

console.log(countryWithContinent);