responsive logo in header

Neeraj Sharma
1 parent 736b03ee4b
Showing 4 changed files with 28 additions and 22 deletions Show diff stats
src/components/pageHeader/AppDrawer.vue
src/pages/Authentication/Login.vue
src/pages/Authentication/forgetpassword.vue
static/css/custom.css
@@ -151,8 +151,8 @@ export default {
     font-size: 14px;
 }
 .imgLogo{
-  height: 22px;
-  width:  20px;;
+  height: 32px;
+  width:  120px;;
 }
 }
 </style>
@@ -173,10 +173,9 @@ a {
   margin-left:18px;
 }  
 img{
-top: 21px;
 left: 10px;
-height: 24px;
-width: 33px;
+height: 34px;
+width: 120px;
 }
 .logoSchool{
 font-size: 18px;
@@ -246,9 +246,9 @@ export default {
     z-index: 0;
   }
 img{
-position:absolute;
-top:13px;
-left:8px;
+    position:absolute;
+    top:13px;
+    left:8px;
 }
 .v-btn--large {
     padding: 0px 74px;
@@ -269,12 +269,6 @@ h5 {
 .theme--light .v-btn, .application .theme--light.v-btn {
     color: white !important;
 }
-img{
-top: 21px;
-left: 10px;
-height: 24px;
-width: 33px;
-}
 .logoSchool{
 font-size: 18px;
 margin-top: 20px !important;
@@ -2,15 +2,19 @@
     text-align: center !important;
     width: 100% !important;
 }
+
 .custom-input-align input {
     text-align: center !important;
 }
+
 .fixcolor {
-    background:linear-gradient(90deg,#f58753 30%,#f15e5f 110%)
+    background: linear-gradient(90deg, #f58753 30%, #f15e5f 110%)
 }
-.fixcolors{
-    background:#39b982 !important; 
+
+.fixcolors {
+    background: #39b982 !important;
 }
+
 .loader {
     width: 100%;
     height: 100%;
@@ -20,10 +24,19 @@
     text-align: center;
     background-color: rgba(0, 0, 0, 0.5);
     z-index: 999;
-  }
-  
-  .loader>div {
+}
+
+.loader>div {
     position: relative;
     top: calc(50% - 16px);
-  }
-  
 \ No newline at end of file
+}
+
+@media screen and (max-width: 600px) {
+    img {
+        position: absolute;
+        top: 13px;
+        left: 10px;
+        height: 34px;
+        width: 120px;
+    }
+}
 \ No newline at end of file
...	...	@@ -151,8 +151,8 @@ export default {
151	151	font-size: 14px;
152	152	}
153	153	.imgLogo{
154		- height: 22px;
155		- width: 20px;;
	154	+ height: 32px;
	155	+ width: 120px;;
156	156	}
157	157	}
158	158	</style>
...	...
...	...	@@ -173,10 +173,9 @@ a {
173	173	margin-left:18px;
174	174	}
175	175	img{
176		-top: 21px;
177	176	left: 10px;
178		-height: 24px;
179		-width: 33px;
	177	+height: 34px;
	178	+width: 120px;
180	179	}
181	180	.logoSchool{
182	181	font-size: 18px;
...	...
...	...	@@ -246,9 +246,9 @@ export default {
246	246	z-index: 0;
247	247	}
248	248	img{
249		-position:absolute;
250		-top:13px;
251		-left:8px;
	249	+ position:absolute;
	250	+ top:13px;
	251	+ left:8px;
252	252	}
253	253	.v-btn--large {
254	254	padding: 0px 74px;
...	...	@@ -269,12 +269,6 @@ h5 {
269	269	.theme--light .v-btn, .application .theme--light.v-btn {
270	270	color: white !important;
271	271	}
272		-img{
273		-top: 21px;
274		-left: 10px;
275		-height: 24px;
276		-width: 33px;
277		-}
278	272	.logoSchool{
279	273	font-size: 18px;
280	274	margin-top: 20px !important;
...	...
...	...	@@ -2,15 +2,19 @@
2	2	text-align: center !important;
3	3	width: 100% !important;
4	4	}
	5	+
5	6	.custom-input-align input {
6	7	text-align: center !important;
7	8	}
	9	+
8	10	.fixcolor {
9		- background:linear-gradient(90deg,#f58753 30%,#f15e5f 110%)
	11	+ background: linear-gradient(90deg, #f58753 30%, #f15e5f 110%)
10	12	}
11		-.fixcolors{
12		- background:#39b982 !important;
	13	+
	14	+.fixcolors {
	15	+ background: #39b982 !important;
13	16	}
	17	+
14	18	.loader {
15	19	width: 100%;
16	20	height: 100%;
...	...	@@ -20,10 +24,19 @@
20	24	text-align: center;
21	25	background-color: rgba(0, 0, 0, 0.5);
22	26	z-index: 999;
23		- }
24		-
25		- .loader>div {
	27	+}
	28	+
	29	+.loader>div {
26	30	position: relative;
27	31	top: calc(50% - 16px);
28		- }
29		-
30	32	\ No newline at end of file
	33	+}
	34	+
	35	+@media screen and (max-width: 600px) {
	36	+ img {
	37	+ position: absolute;
	38	+ top: 13px;
	39	+ left: 10px;
	40	+ height: 34px;
	41	+ width: 120px;
	42	+ }
	43	+}
31	44	\ No newline at end of file
...	...