bravo68web-portfolio-nextjs/styles/globals.css

85 lines
1.6 KiB
CSS

@import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@200;300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro");
:root {
--color1: #11052c;
--color2: #3d087b;
--color3: #f43b86;
--color4: #ffe459;
--color5: #16b2fa;
--color6: #0ff558;
--color7: #f4f4f4;
--color8: #f58a0f;
--color9: #f5a80f;
--color10: #0ffaac;
--font: "Source Code Pro", monospace;
--color-cursor: 220, 90, 90;
--cursor-outline-shade: 0.3;
--cursor-size: 10px;
--cursor-outline-size: 12px;
}
* {
margin: 0;
padding: 0;
}
html,
body {
overflow: hidden;
background: var(--color2);
padding: 0;
margin: 0;
font-family: var(--font), -apple-system, BlinkMacSystemFont, Segoe UI, Roboto,
Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
height: 100vh;
width: 100vw;
/* color:var(--color3) */
color: var(--color7);
/* cursor: none; */
}
a {
color: inherit;
text-decoration: none;
}
* {
box-sizing: border-box;
}
/* .cursor {
width: 20px;
height: 20px;
border: 1px solid white;
border-radius: 50%;
position: absolute;
pointer-events: none;
z-index: 100;
}
.cursor::after {
content: "";
width: 20px;
height: 20px;
position: absolute;
border: 2px solid blue;
border-radius: 50%;
opacity: .5;
top: -8px;
left: -8px;
}
@keyframes cursorAnim {
0% {
transform: scale(1);
}
50% {
transform: scale(5);
}
100% {
transform: scale(1);
opacity: 0;
}
}
.expand {
animation: cursorAnim .5s forwards;
} */