Files
spestexnika/app/globals.css
2025-11-18 14:33:38 +05:00

99 lines
1.8 KiB
CSS

@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap");
@import "tailwindcss";
:root {
--background: #ffffff;
--foreground: #171717;
--primary: #0c1239;
--secondary: #f2a01c;
}
@theme inline {
--color-background: var(--background);
--color-foreground: var(--foreground);
--font-sans: var(--font-geist-sans);
--font-mono: var(--font-geist-mono);
--color-primary: var(--primary);
--color-secondary: var(--secondary);
}
@media (prefers-color-scheme: dark) {
:root {
--background: #0a0a0a;
--foreground: #ededed;
}
}
body {
font-family: Arial, Helvetica, sans-serif;
}
* {
transition: 0.3s ease-in-out all;
font-family: "Roboto", sans-serif;
}
/* 🟠 Sariq blok trapezoid shakl */
.clip-trapezoid {
clip-path: polygon(4% 0, 100% 0, 97% 100%, 0% 100%);
}
/* Input blokining shakli */
.clip-input {
clip-path: polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
}
/* Tugma blokining shakli */
.clip-button {
clip-path: polygon(7% 0, 100% 0, 94% 100%, 0% 100%);
}
.clip-part{
clip-path: polygon(100% 0, 55% 100%, 88% 100%);
}
/* footer ekxkavator icon animation */
@keyframes icon_animatsion_tool {
from{
box-shadow:none;
}to{
box-shadow: 0px 0px 15px 5px var(--secondary);
}
}
@keyframes icon_animatsion_tool2 {
from{
box-shadow:none;
}to{
box-shadow: 0px 0px 15px 5px var(--primary);
}
}
.icon_animation{
animation: icon_animatsion_tool 2s infinite alternate-reverse ;
}
.icon_animation2{
animation: icon_animatsion_tool2 0.9s infinite alternate-reverse ;
}
@media(max-width:640px){
/* 🟠 Sariq blok trapezoid shakl */
.clip-trapezoid {
clip-path: none;
}
/* Input blokining shakli */
.clip-input {
clip-path: none;
}
/* Tugma blokining shakli */
.clip-button {
clip-path: none;
}
.clip-part{
clip-path: none;
}
}