first commit
This commit is contained in:
@@ -0,0 +1,182 @@
|
||||
@import url("https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
|
||||
|
||||
:root {
|
||||
--background: #ffffff;
|
||||
--foreground: #171717;
|
||||
--loading-background: rgba(51, 51, 51, 0.3);
|
||||
--sub-status-active: rgba(85, 212, 0, 1);
|
||||
--sub-status-inactive: rgb(255, 42, 42);
|
||||
--organization-card: rgba(85, 212, 0, 1);
|
||||
--organization-flag: rgb(22, 170, 22);
|
||||
--no-organization-header: rgba(253, 228, 84, 0.897);
|
||||
--no-organization-header-border: rgba(104, 90, 12, 0.897);
|
||||
--wine-red: #ff2a7f;
|
||||
--wine-lighter: rgba(204, 170, 255, 1);
|
||||
--wine-light: rgba(179, 128, 255, 1);
|
||||
--wine-dark: rgb(127, 42, 255);
|
||||
--wine-darkest: rgba(51, 0, 128, 1);
|
||||
--wine-superdark: rgba(16, 0, 39, 1);
|
||||
--gray-dark: rgb(118, 115, 121);
|
||||
--gray-light: rgb(175, 171, 179);
|
||||
--gray-lighter: rgb(222, 222, 222);
|
||||
--black: #3e3748;
|
||||
--black-light: #5f6368;
|
||||
--black-dark: rgba(51, 51, 51, 1);
|
||||
--white: #ffffff;
|
||||
--white-dark: rgba(236, 236, 236, 1);
|
||||
--white-darkest: rgb(216, 216, 216);
|
||||
--green: rgb(42, 255, 42);
|
||||
--green-darkest: rgb(0, 128, 17);
|
||||
--green-light: rgb(139, 212, 139);
|
||||
--red: rgb(255, 74, 42);
|
||||
--error: rgb(255, 42, 42);
|
||||
--red-darkest: rgb(128, 15, 0);
|
||||
--orange: rgb(255, 152, 42);
|
||||
--yellow: rgba(253, 228, 84, 1);
|
||||
--yellow-light: rgba(253, 228, 84, 0.197);
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
max-width: 100vw;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain; /* Quita la actualizacion de la pagina en el scroll cuando se ve en un telefono */
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: linear-gradient(180deg, var(--wine-darkest) 0%, var(--wine-dark) 100%);
|
||||
}
|
||||
|
||||
body {
|
||||
/*background: var(--wine-darkest);
|
||||
background: linear-gradient(180deg, var(--wine-darkest) 0%, var(--wine-dark) 100%);*/
|
||||
color: var(--foreground);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-family: "Kanit", serif;
|
||||
}
|
||||
|
||||
.card-working {
|
||||
width: 80vw;
|
||||
height: 80vh;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
background-image: url("../images/working.png");
|
||||
background-size: 70%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center 100px;
|
||||
}
|
||||
|
||||
.noSelection {
|
||||
-webkit-user-select: none; /* Chrome, Safari */
|
||||
-moz-user-select: none; /* Firefox */
|
||||
-ms-user-select: none; /* Internet Explorer */
|
||||
user-select: none; /* Estándar */
|
||||
}
|
||||
|
||||
.homeContainer {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
bottom: 0px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
input:focus {
|
||||
outline: none; /* Quita el contorno */
|
||||
box-shadow: none; /* Quita cualquier sombra */
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: var(--wine-red);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
color: var(--wine-red);
|
||||
}
|
||||
|
||||
.centered {
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.icon24px {
|
||||
font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
|
||||
}
|
||||
|
||||
.homeCentered {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 1200px;
|
||||
overflow-x: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mainSectionWhite {
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding-bottom: 0px;
|
||||
padding-top: 0px;
|
||||
margin-top: 60px;
|
||||
background: var(--wine-darkest);
|
||||
background: linear-gradient(180deg, var(--white-darkest) 0%, white 10%);
|
||||
}
|
||||
|
||||
.homeTitleHeader {
|
||||
text-align: center;
|
||||
color: var(--wine-red);
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.homeResumeHeader {
|
||||
text-align: center;
|
||||
color: var(--gray-dark);
|
||||
margin-top: 30px;
|
||||
padding-left: 30px;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
.card {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 30px;
|
||||
background-color: var(--white);
|
||||
-webkit-box-shadow: 0px 2px 24px -4px var(--gray-dark);
|
||||
-moz-box-shadow: 0px 2px 24px -4px var(--gray-dark);
|
||||
box-shadow: 0px 2px 24px -4px var(--gray-dark);
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 30px;
|
||||
max-width: 600px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
.card-base {
|
||||
background-color: var(--white);
|
||||
border-radius: 10px;
|
||||
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
|
||||
border: solid 1px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
Reference in New Issue
Block a user