Style : Converted % into rem

joyguptaa · joyguptaa · commit f9249759eaf7 · 2024-02-06T00:16:46.000+05:30
diff --git a/app/styles/tasks.css b/app/styles/tasks.css
@@ -183,16 +183,21 @@
   align-items: center;
 }
 .task-details__title-container a {
-  max-width: 66%;
+  max-width: 18.5rem;
 }
 @media screen and (min-width: 900px) {
   .task-details__title-container a {
-    max-width: 66%;
+    max-width: 18.3rem;
   }
 }
-@media screen and (max-width: 900px) {
+@media screen and ((max-width: 900px) and (min-width: 720px)) {
   .task-details__title-container a {
-    max-width: 50%;
+    max-width: 18.3rem;
+  }
+}
+@media screen and (max-width: 720px) {
+  .task-details__title-container a {
+    max-width: 100%;
   }
 }
 

Original file line number	Diff line number	Diff line change
`@@ -183,16 +183,21 @@`
`183`	`183`	`align-items: center;`
`184`	`184`	`}`
`185`	`185`	`.task-details__title-container a {`
`186`		`- max-width: 66%;`
	`186`	`+ max-width: 18.5rem;`
`187`	`187`	`}`
`188`	`188`	`@media screen and (min-width: 900px) {`
`189`	`189`	`.task-details__title-container a {`
`190`		`- max-width: 66%;`
	`190`	`+ max-width: 18.3rem;`
`191`	`191`	`}`
`192`	`192`	`}`
`193`		`-@media screen and (max-width: 900px) {`
	`193`	`+@media screen and ((max-width: 900px) and (min-width: 720px)) {`
`194`	`194`	`.task-details__title-container a {`
`195`		`- max-width: 50%;`
	`195`	`+ max-width: 18.3rem;`
	`196`	`+ }`
	`197`	`+}`
	`198`	`+@media screen and (max-width: 720px) {`
	`199`	`+ .task-details__title-container a {`
	`200`	`+ max-width: 100%;`
`196`	`201`	`}`
`197`	`202`	`}`
`198`	`203`