BC CSS
Saved by @cur10uslearner

JavaScript is powerful.

But sometimes, you can do great things using CSS.

A long thread of CSS tips and tricks:

 1. Smooth scrolling

https://t.co/eRRqdjrykQ
2. Change marker styling
3. Add styling to video subtitle

https://t.co/Oorw0Vymda
4. Change input caret color

https://t.co/OKSsAtxEuJ
5. Typewritter effect using pure CSS

https://t.co/Q6vorP1mFL
6. Customize text selection

https://t.co/lcsl9xVQ4X
7. Zoom image on hover

https://t.co/wB16o8jRWR
8. Customize first letter

https://t.co/5mK65WYUqS
9. Pure CSS image carousel

https://t.co/ecvhTwLBbw
10. Comma separated list

https://t.co/N9WeaMNVtb
11. Text outline using 1 CSS property

https://t.co/k41IoCECRc
12. Customize list style type

https://t.co/DOQK8EV0tS
13. Style range input

https://t.co/DWW7Fskw04
14. 3D elements using CSS

https://t.co/OFUn4UHhUQ
15. Optimize the performance

https://t.co/4im7DbNuFf
16. Create round text

https://t.co/IWEC1nJQV0
17. Wavy underline

https://t.co/7gkr2ykYOB
18. Truncate text using CSS

https://t.co/7SQ5m5mGCM
19. Negative selector

https://t.co/Z6NPEndM24
20. Prevent text selecting

https://t.co/Sudo7KLwh1
21. Make div scrollable

https://t.co/NEYyQadOOA
22. Image reflection

https://t.co/Tsy0J1i9r0
23. Image rendering

https://t.co/J7uLQAjYJB
End of this thread.

I’m planning to post more top-notch content in upcoming days.

Follow me @Prathkum if it sounds good.

More from Pratham

Pratham
Pratham
@Prathkum
Are you planning to learn CSS for adding some cool styling in your website?

In this thread, I'm covering all the basics and proper plan you need to know in order to getting started with CSS.

🧵 👇🏻


We need to know the importance of CSS first. Why CSS?

Well I guess CSS is the only language that add some visuals in website. Without CSS, Without it, websites would still be plain text on white backgrounds.

{ 02 / 17 }

Let's compare a website with and without CSS

Image 1: With CSS
Image 2: Without CSS

{ 03 / 17 }


I this should be enough to explain you why CSS is so important. So lets start

You can gain some decent amount of CSS knowledge in 30 days. And after that you will definitely able to create some good looking website. Let's see how 👇🏻

{ 04 / 17 }

First things first, you need to learn basic stuff

- How to link your CSS files with HTML file
- How to select elements so that you can add styling

{ 05 / 17 }
ALL
Pratham
Pratham
@Prathkum
Roadmap to learn CSS 🎨🛣️

➳ Color
➳ Background
➳ Box model
➳ Height and width
➳ Margin and padding
➳ Border
➳ Positioning
➳ display
➳ Layouts
➳ Grid and Flex
➳ Alignment
➳ Fonts
➳ Animation
➳ Pseudo-classes
➳ Media query
WEBDEV
Advertisement
Pratham \U0001f468\u200d\U0001f4bb\U0001f680
Pratham 👨‍💻🚀...
@Prathkum
Neumorphism is a trendy UI style nowadays. So let's create a neumorphic form using few simple steps

THREAD🧵


Neumorphic design is another UI design that has become popular these days.

Making neumorphic effect is actually pretty easy using only just CSS box-shadow

We'll be creating a neumorphic form in steps👇🏼

2.

STEP 1:

Place a light source(virtually) on screen. In this example I'm considering that my light source is placed top left corner of the screen

3.


STEP 2:

Create a container div and set background color slightly darker than white. I picked #ecf0f3

* Make sure that the color of body and container should be same

CONTINUE...

4.

As we placed our light source on top-left corner, make sure left and top border of container should be brighter than right and bottom border.

This will make the element looks like it has the light source illuminating from the top left corner of the screen.

5.
DESIGN
Pratham
Pratham
@Prathkum
Five great icons websites for every web developer and designer ⏺️

A Thread 🧵👇🏻


1️⃣ Icons 8

- Icons8 is just more than icons. You can download illustrations, vector images, music and much more

🖇️ https://t.co/inHse0QXBh


2️⃣ Icon Monstr

- Black and white themed minimal icons which looks super great. You can also cuatomize the thickness

🖇️ https://t.co/dbQrJi0IHf


3️⃣ Icon Icons

- Over one thousand free icons which you can download as icons or images

🖇️ https://t.co/h5NlH5fGGr


4️⃣ Icons finder

Filter through the world’s largest marketplace for icons with flexibility and ease. Made up by submissions from top designers around the world, and curated by the team

🖇️ https://t.co/sqiZ6H9sR7
WEBDEV
Pratham
Pratham
@Prathkum
React Hooks are the functions which "hook into" React state and lifecycle features from function components. Hooks allows you to manipulate state and other React feature without writing a class. Let's talk about widely used hook

useEffect hook at a glance 🧵👇🏻


useEffect hook is the heart of React functional components

If you're familiar with class components then you might know that we have various lifecycle methods but in functional components, we don't have any lifecycle methods. Instead we have a powerful hook called useEffect

By using useEffect, you tell React that your component needs to do something after render. React will remember the function you passed (we'll refer to it as our “effect”), and call it later after performing the DOM updates

So let's start by understanding the syntax first

3/15


useEffect take two parameters, first is a function and second is an array.

The function inside the useEffect will run every single time component re-render. Consider this piece of code and check the output in next tweet

{ 4 / 15 }


As you can see in the output the function is executed every single time my component re-render

{ 5 / 15 }
WEBDEV , ALL

You May Also Like

Anu Satheesh \U0001f1ee\U0001f1f3
Anu Satheesh 🇮🇳...
@AnuSatheesh5
Agastya Muni & Kaveri River
#story
This is a story which describes how River Kaveri was brought on earth by Agastya muni. There was a king named Kavera lived in the Brahmagiri hills who prayed to Brahma for a child. He was blessed with a daughter whom he named Kaveri.


Agastya muni married her. A demon, named Shoorapadma, wanted to trouble people so he prevented rain from reaching South India. As a result famine occurred in South India.
Agastya Muni who came that way was very sad seeing this. He started to pray Mahadeva for a solution.


Shiva gave him small amount of Ganga water in his Kamandalu (small pot) and said wherever you spill this water the river will flow from there. Agastya Muni travelled lot of places to find a suitable place to pour water. Feeling tired he kept his Kamandalu and took rest.


At that time Ganesha took a form of crow and perched on the Kamadalu and made a hole that water began to flow as river Kaveri. This place is now called as Talakaveri (Karnataka), located in the Brahmagiri hill.


Tala Kaveri has temple for Agastheeswara, which denotes the story between Kaveri and Agasthya muni. Kaveri is a part of Ganga, thus, also called Dakshina Ganga.
🙏🕉🙏
ALL
Vibhu Vashisth
Vibhu Vashisth
@VIBHU_Tweet
राम-रावण युद्ध समाप्त हो चुका था। जगत को त्रास देने वाला रावण अपने कुटुम्ब सहित नष्ट हो चुका था।श्रीराम का राज्याभिषेक हुआ और अयोध्या नरेश श्री राम के नेतृत्व में चारों दिशाओं में शन्ति थी।
अंगद को विदा करते समय राम रो पड़े थे ।हनुमान को विदा करने की शक्ति तो राम में थी ही नहीं ।


माता सीता भी हनुमान को पुत्रवत मानती थी। अत: हनुमान अयोध्या में ही रह गए ।राम दिनभर दरबार में, शासन व्यवस्था में व्यस्त रहते थे। संध्या को जब शासकीय कार्यों में छूट मिलती तो गुरु और माताओं का कुशल-मंगल पूछ अपने कक्ष में जाते थे। परंतु हनुमान जी हमेशा उनके पीछे-पीछे ही रहते थे ।


उनकी उपस्थिति में ही सारा परिवार बहुत देर तक जी भर बातें करता ।फिर भरत को ध्यान आया कि भैया-भाभी को भी एकांत मिलना चाहिए ।उर्मिला को देख भी उनके मन में हूक उठती थी कि इस पतिव्रता को भी अपने पति का सानिध्य चाहिए ।

एक दिन भरत ने हनुमान जी से कहा,"हे पवनपुत्र! सीता भाभी को राम भैया के साथ एकांत में रहने का भी अधिकार प्राप्त है ।क्या आपको उनके माथे पर सिन्दूर नहीं दिखता?इसलिए संध्या पश्चात आप राम भैया को कृप्या अकेला छोड़ दिया करें "।
ये सुनकर हनुमान आश्चर्यचकित रह गए और सीता माता के पास गए ।


माता से हनुमान ने पूछा,"माता आप अपने माथे पर सिन्दूर क्यों लगाती हैं।" यह सुनकर सीता माता बोलीं,"स्त्री अपने माथे पर सिन्दूर लगाती है तो उसके पति की आयु में वृद्धि होती है और वह स्वस्थ रहते हैं "। फिर हनुमान जी प्रभु राम के पास गए ।
ALL
Advertisement
XVIII Airborne Corps\U0001f409
XVIII Airborne Corps🐉...
@18airbornecorps
1 of 16: WE ARE ALL JEWS HERE: THE STORY OF RODDIE EDMONDS

One of the most moving and relevant stories of the Battle of the Bulge, or any American Soldier in any war, is that of Master Sergeant Roddie Edmonds, a Knoxville, Tennessee native, who served with the 106th Infantry.


2 of 16:

Roddie was captured early on in the Battle of the Bulge, on December 19th, when Panzer forces plowed through his unit.

He, along with almost his entire regiment, was forced to surrender.


3 of 16:

The men were transported to the Stalag IX-A POW camp in Ziegenhain, Germany.

Roddie was the senior enlisted American Soldier at the site. As such, he was the conduit between all American Soldiers and their German captors.


4 of 16:

In late January, the camp’s commandant, Major Siegmann [pictured here], ordered Roddie, a Christian, to identify all Jewish Soldiers and order them to stand in formation by themselves the next day.

[Jewish Soldiers were a minority within American units]


5 of 16:

Throughout WWII, captured Jewish Soldiers were often tortured and then killed by their German captors.

In fact, Jewish Soldiers had been told to bury their dog tags before capture. The dog tag identified Jews with the letter “H” for Hebrew.
SOCIETY
Billy Bostickson \U0001f3f4\U0001f441&\U0001f441 \U0001f193
Billy Bostickson 🏴👁&👁 ...
@BillyBostickson
1. Project 1742 (EcoHealth/DTRA)
Risks of bat-borne zoonotic diseases in Western Asia

Duration: 24/10/2018-23 /10/2019

Funding: $71,500
@dgaytandzhieva
https://t.co/680CdD8uug


2. Bat Virus Database
Access to the database is limited only to those scientists participating in our ‘Bats and Coronaviruses’ project
Our intention is to eventually open up this database to the larger scientific community
https://t.co/mPn7b9HM48


3. EcoHealth Alliance & DTRA Asking for Trouble
One Health research project focused on characterizing bat diversity, bat coronavirus diversity and the risk of bat-borne zoonotic disease emergence in the region.
https://t.co/u6aUeWBGEN


4. Phelps, Olival, Epstein, Karesh - EcoHealth/DTRA


5, Methods and Expected Outcomes
(Unexpected Outcome = New Coronavirus Pandemic)
ALL
Anu Satheesh \U0001f1ee\U0001f1f3
Anu Satheesh 🇮🇳...
@AnuSatheesh5
Agastya Muni & Kaveri River
#story
This is a story which describes how River Kaveri was brought on earth by Agastya muni. There was a king named Kavera lived in the Brahmagiri hills who prayed to Brahma for a child. He was blessed with a daughter whom he named Kaveri.


Agastya muni married her. A demon, named Shoorapadma, wanted to trouble people so he prevented rain from reaching South India. As a result famine occurred in South India.
Agastya Muni who came that way was very sad seeing this. He started to pray Mahadeva for a solution.


Shiva gave him small amount of Ganga water in his Kamandalu (small pot) and said wherever you spill this water the river will flow from there. Agastya Muni travelled lot of places to find a suitable place to pour water. Feeling tired he kept his Kamandalu and took rest.


At that time Ganesha took a form of crow and perched on the Kamadalu and made a hole that water began to flow as river Kaveri. This place is now called as Talakaveri (Karnataka), located in the Brahmagiri hill.


Tala Kaveri has temple for Agastheeswara, which denotes the story between Kaveri and Agasthya muni. Kaveri is a part of Ganga, thus, also called Dakshina Ganga.
🙏🕉🙏
ALL