fix: titels uniform
This commit is contained in:
		
							parent
							
								
									a59417b8f5
								
							
						
					
					
						commit
						0aefec28d7
					
				
					 7 changed files with 25 additions and 93 deletions
				
			
		
							
								
								
									
										14
									
								
								frontend/src/assets/common.css
									
										
									
									
									
										Normal file
									
								
							
							
						
						
									
										14
									
								
								frontend/src/assets/common.css
									
										
									
									
									
										Normal file
									
								
							|  | @ -0,0 +1,14 @@ | |||
| h1 { | ||||
|     color: #0e6942; | ||||
|     text-transform: uppercase; | ||||
|     font-weight: bolder; | ||||
|     font-size: 50px; | ||||
|     padding-left: 1%; | ||||
| } | ||||
| 
 | ||||
| @media screen and (max-width: 850px) { | ||||
|     h1 { | ||||
|         text-align: center; | ||||
|         padding-left: 0; | ||||
|     } | ||||
| } | ||||
|  | @ -96,7 +96,7 @@ | |||
| 
 | ||||
| <template> | ||||
|     <div class="main-container"> | ||||
|         <h1 class="title">{{ t("new-assignment") }}</h1> | ||||
|         <h1>{{ t("new-assignment") }}</h1> | ||||
|         <v-card class="form-card"> | ||||
|             <v-form | ||||
|                 ref="form" | ||||
|  |  | |||
|  | @ -9,6 +9,7 @@ | |||
|     import type { ClassDTO } from "@dwengo-1/common/interfaces/class"; | ||||
|     import { asyncComputed } from "@vueuse/core"; | ||||
|     import { useDeleteAssignmentMutation } from "@/queries/assignments.ts"; | ||||
|     import '../../assets/common.css' | ||||
| 
 | ||||
|     const { t } = useI18n(); | ||||
|     const router = useRouter(); | ||||
|  | @ -139,17 +140,9 @@ | |||
|     .assignments-container { | ||||
|         width: 100%; | ||||
|         margin: 0 auto; | ||||
|         padding: 2% 4%; | ||||
|         box-sizing: border-box; | ||||
|     } | ||||
| 
 | ||||
|     h1 { | ||||
|         color: #0e6942; | ||||
|         text-transform: uppercase; | ||||
|         font-weight: bolder; | ||||
|         font-size: 50px; | ||||
|     } | ||||
| 
 | ||||
|     .center-btn { | ||||
|         display: block; | ||||
|         margin-left: auto; | ||||
|  |  | |||
|  | @ -13,6 +13,7 @@ | |||
|     import { useCreateTeacherInvitationMutation } from "@/queries/teacher-invitations"; | ||||
|     import type { TeacherInvitationData } from "@dwengo-1/common/interfaces/teacher-invitation"; | ||||
|     import { useDisplay } from "vuetify"; | ||||
|     import '../../assets/common.css' | ||||
| 
 | ||||
|     const { t } = useI18n(); | ||||
| 
 | ||||
|  | @ -186,7 +187,7 @@ | |||
|             v-slot="classResponse: { data: ClassResponse }" | ||||
|         > | ||||
|             <div> | ||||
|                 <h1 class="title">{{ classResponse.data.class.displayName }}</h1> | ||||
|                 <h1>{{ classResponse.data.class.displayName }}</h1> | ||||
|                 <using-query-result | ||||
|                     :query-result="getStudents" | ||||
|                     v-slot="studentsResponse: { data: StudentsResponse }" | ||||
|  | @ -391,14 +392,6 @@ | |||
|         border-collapse: collapse; | ||||
|     } | ||||
| 
 | ||||
|     h1 { | ||||
|         color: #0e6942; | ||||
|         text-transform: uppercase; | ||||
|         font-weight: bolder; | ||||
|         padding-top: 2%; | ||||
|         font-size: 50px; | ||||
|     } | ||||
| 
 | ||||
|     h2 { | ||||
|         color: #0e6942; | ||||
|         font-size: 30px; | ||||
|  | @ -416,15 +409,7 @@ | |||
|         text-decoration: underline; | ||||
|     } | ||||
| 
 | ||||
|     main { | ||||
|         margin-left: 30px; | ||||
|     } | ||||
| 
 | ||||
|     @media screen and (max-width: 800px) { | ||||
|         h1 { | ||||
|             text-align: center; | ||||
|             padding-left: 0; | ||||
|         } | ||||
| 
 | ||||
|         .join { | ||||
|             text-align: center; | ||||
|  |  | |||
|  | @ -12,6 +12,7 @@ | |||
|     import { useClassStudentsQuery, useClassTeachersQuery } from "@/queries/classes"; | ||||
|     import type { StudentsResponse } from "@/controllers/students"; | ||||
|     import type { TeachersResponse } from "@/controllers/teachers"; | ||||
|     import '../../assets/common.css' | ||||
| 
 | ||||
|     const { t } = useI18n(); | ||||
| 
 | ||||
|  | @ -135,7 +136,7 @@ | |||
|             ></v-empty-state> | ||||
|         </div> | ||||
|         <div v-else> | ||||
|             <h1 class="title">{{ t("classes") }}</h1> | ||||
|             <h1>{{ t("classes") }}</h1> | ||||
|             <using-query-result | ||||
|                 :query-result="classesQuery" | ||||
|                 v-slot="classResponse: { data: ClassesResponse }" | ||||
|  | @ -306,14 +307,6 @@ | |||
|         border-collapse: collapse; | ||||
|     } | ||||
| 
 | ||||
|     h1 { | ||||
|         color: #0e6942; | ||||
|         text-transform: uppercase; | ||||
|         font-weight: bolder; | ||||
|         padding-top: 2%; | ||||
|         font-size: 50px; | ||||
|     } | ||||
| 
 | ||||
|     h2 { | ||||
|         color: #0e6942; | ||||
|         font-size: 30px; | ||||
|  | @ -331,16 +324,7 @@ | |||
|         text-decoration: underline; | ||||
|     } | ||||
| 
 | ||||
|     main { | ||||
|         margin-left: 30px; | ||||
|     } | ||||
| 
 | ||||
|     @media screen and (max-width: 800px) { | ||||
|         h1 { | ||||
|             text-align: center; | ||||
|             padding-left: 0; | ||||
|         } | ||||
| 
 | ||||
|         .join { | ||||
|             text-align: center; | ||||
|             align-items: center; | ||||
|  |  | |||
|  | @ -15,6 +15,7 @@ | |||
|         useTeacherInvitationsReceivedQuery, | ||||
|     } from "@/queries/teacher-invitations"; | ||||
|     import { useDisplay } from "vuetify"; | ||||
|     import '../../assets/common.css' | ||||
| 
 | ||||
|     const { t } = useI18n(); | ||||
| 
 | ||||
|  | @ -183,7 +184,7 @@ | |||
|             ></v-empty-state> | ||||
|         </div> | ||||
|         <div v-else> | ||||
|             <h1 class="title">{{ t("classes") }}</h1> | ||||
|             <h1>{{ t("classes") }}</h1> | ||||
|             <using-query-result | ||||
|                 :query-result="classesQuery" | ||||
|                 v-slot="classesResponse: { data: ClassesResponse }" | ||||
|  | @ -318,7 +319,7 @@ | |||
|                 </v-container> | ||||
|             </using-query-result> | ||||
| 
 | ||||
|             <h1 class="title"> | ||||
|             <h1> | ||||
|                 {{ t("invitations") }} | ||||
|             </h1> | ||||
|             <v-container | ||||
|  | @ -484,14 +485,6 @@ | |||
|         border-collapse: collapse; | ||||
|     } | ||||
| 
 | ||||
|     h1 { | ||||
|         color: #0e6942; | ||||
|         text-transform: uppercase; | ||||
|         font-weight: bolder; | ||||
|         padding-top: 2%; | ||||
|         font-size: 50px; | ||||
|     } | ||||
| 
 | ||||
|     h2 { | ||||
|         color: #0e6942; | ||||
|         font-size: 30px; | ||||
|  | @ -509,15 +502,7 @@ | |||
|         text-decoration: underline; | ||||
|     } | ||||
| 
 | ||||
|     main { | ||||
|         margin-left: 30px; | ||||
|     } | ||||
| 
 | ||||
|     @media screen and (max-width: 850px) { | ||||
|         h1 { | ||||
|             text-align: center; | ||||
|             padding-left: 0; | ||||
|         } | ||||
| 
 | ||||
|         .join { | ||||
|             text-align: center; | ||||
|  |  | |||
|  | @ -3,6 +3,7 @@ | |||
|     import { useI18n } from "vue-i18n"; | ||||
|     import { THEMESITEMS, AGE_TO_THEMES } from "@/utils/constants.ts"; | ||||
|     import BrowseThemes from "@/components/BrowseThemes.vue"; | ||||
|     import '../../assets/common.css' | ||||
| 
 | ||||
|     const { t, locale } = useI18n(); | ||||
| 
 | ||||
|  | @ -46,7 +47,7 @@ | |||
| 
 | ||||
| <template> | ||||
|     <div class="main-container"> | ||||
|         <h1 class="title">{{ t("themes") }}</h1> | ||||
|         <h1>{{ t("themes") }}</h1> | ||||
|         <v-container class="dropdowns"> | ||||
|             <v-select | ||||
|                 class="v-select" | ||||
|  | @ -77,30 +78,6 @@ | |||
| </template> | ||||
| 
 | ||||
| <style scoped> | ||||
|     .main-container { | ||||
|         min-height: 100vh; | ||||
|         min-width: 100vw; | ||||
|         display: flex; | ||||
|         flex-direction: column; | ||||
|         align-items: flex-start; | ||||
|         justify-content: flex-start; | ||||
|     } | ||||
| 
 | ||||
|     .title { | ||||
|         max-width: 50rem; | ||||
|         margin-left: 1rem; | ||||
|         margin-top: 1rem; | ||||
|         text-align: center; | ||||
|         display: flex; | ||||
|         justify-content: center; | ||||
|     } | ||||
| 
 | ||||
|     h1 { | ||||
|         color: #0e6942; | ||||
|         text-transform: uppercase; | ||||
|         font-weight: bolder; | ||||
|         font-size: 50px; | ||||
|     } | ||||
| 
 | ||||
|     .dropdowns { | ||||
|         display: flex; | ||||
|  | @ -114,12 +91,6 @@ | |||
|         min-width: 100px; | ||||
|     } | ||||
| 
 | ||||
|     @media (max-width: 768px) { | ||||
|         .main-container { | ||||
|             padding: 1rem; | ||||
|         } | ||||
|     } | ||||
| 
 | ||||
|     @media (max-width: 700px) { | ||||
|         .dropdowns { | ||||
|             flex-direction: column; | ||||
|  |  | |||
		Reference in a new issue
	
	 laurejablonski
						laurejablonski