diff --git a/src/MainContent.vue b/src/MainContent.vue
index bc6c386..5ff5482 100644
--- a/src/MainContent.vue
+++ b/src/MainContent.vue
@@ -84,10 +84,17 @@ import { toRaw } from 'vue'
.imgStyle{
width:250px;
}
-
- #regenBtn{
- left:3.33%;
- bottom:3.33%;
+ @media (min-height:720px){
+ #regenBtn{
+ left:3.33%;
+ bottom:3.33%;
+ }
+ }
+ @media (max-height:720px){
+ #regenBtn{
+ left:3.33%;
+ bottom:6%;
+ }
}
/*Highlights size*/
diff --git a/src/TopBar.vue b/src/TopBar.vue
index 2190333..c95be12 100644
--- a/src/TopBar.vue
+++ b/src/TopBar.vue
@@ -21,7 +21,9 @@
alors voici quelques infos sur mes pratiques :
- je pense qu'il ya déjà assez de vêtements sur cette Terre (merci la fast-fashion...) et qu'en recyclant ceux déjà existant on pourrat s'habiller PENDANT DES SIÈCLES!
+ je pense qu'il ya déjà assez de vêtements sur cette Terre (merci la fast-fashion...) et qu'en recyclant ceux déjà existant on pourrat s'habiller
+
+ PENDANT DES SIÈCLES!
je travaille une esthétique punk, brutaliste
@@ -76,7 +78,7 @@
Your Contact Info (so i can reply ^^) :
Your Message :
- + @@ -178,14 +180,27 @@ } /*===============format large*/ @media (min-width:500px){ - #welcomeBtn{ - left:3.33%; - bottom:8.5%; - } + @media (min-height:720px){ + #welcomeBtn{ + left:3.33%; + bottom:8.5%; + } - #welcome_pannel{ - bottom:13.12%; - left:3.33%; + #welcome_pannel{ + bottom:13.12%; + left:3.33%; + } + } + @media (max-height:720px){ + #welcomeBtn{ + left:3.33%; + bottom:13%; + } + + #welcome_pannel{ + bottom:20%; + left:3.33%; + } } } @@ -218,7 +233,7 @@ border-width: thin; border-style: solid; color:var(--light-color); - width:94%; + width:300px; font-weight:lighter; border-radius: 30px; background-color: var(--dark-color); @@ -235,6 +250,10 @@ #your_message{ height: 150px; + width:290px; + padding-top:5px; + padding-right: 15px; + border-radius: 20px; } #sendMsg{ diff --git a/src/assets/main_pageStyle.css b/src/assets/main_pageStyle.css index 33e251a..563989a 100644 --- a/src/assets/main_pageStyle.css +++ b/src/assets/main_pageStyle.css @@ -87,6 +87,10 @@ a{ animation: float 1s ease-in-out infinite; } +.floating:hover{ + animation: none; +} + @keyframes float { 0% { transform: translateY(0px); } 35% { transform: translateY(1px); } @@ -313,7 +317,7 @@ header { #about{ position:fixed; background-color: var(--dark-color); - height: auto; + height: 500px; display: flex; flex-direction: column; justify-content: flex-end; @@ -345,6 +349,9 @@ header { font-size:16px; color: var(--light-color); font-weight: lighter; + padding-right: 10px; + overflow-y: scroll; + scroll-behavior: smooth; } /*===============format haut*/