made mobile layout for bio

This commit is contained in:
Fedor Katurov 2022-11-10 14:12:45 +06:00
parent a8dd169087
commit 1499203b21
8 changed files with 145 additions and 48 deletions

View file

@ -18,6 +18,10 @@
display: flex;
flex-direction: column;
padding-top: 40px;
@include desktop {
padding-top: 10px;
}
}
.content {
@ -36,6 +40,7 @@
right: 20px;
stroke: currentColor;
stroke-width: 0.5px;
z-index: 12;
@include tablet {
stroke-width: 1.5px;

View file

@ -92,6 +92,7 @@ export default defineComponent({
z-index: 1;
display: flex;
flex-direction: column;
height: 100%;
@include container;
}

View file

@ -12,18 +12,32 @@
</div>
</template>
<script lang="ts" setup></script>
<style lang="scss" module>
@import "@/assets/css/mixins";
.header_container {
position: sticky;
top: 0;
background: var(--color-background);
z-index: 10;
backdrop-filter: blur(5px);
&::after {
content: "";
position: absolute;
inset: 0;
background: var(--color-background);
z-index: 0;
opacity: 0.95;
@supports (backdrop-filter: blur(5px)) {
opacity: 0.85;
}
}
}
.header_content {
@include container;
position: relative;
z-index: 1;
}
</style>