+
Plan Básico
-
-
$100.000
-
- Lorem ipsum dolor sit amet, consectetur adipisicing
- elit. Repudiandae sapiente optio, quisquam ea
- placeat architecto dicta, suscipit quasi
- necessitatibus neque.
-
+
+
$100.000 COP
+
+ Todo lo esencial para administrar tu negocio
+ desde un solo lugar, con control de clientes,
+ ventas y operaciones diarias.
+
+
+
+
+
Este plan incluye:
+
+
+ - Roles y permisos
+ - Administración de Clientes
+ - Administración de Proveedores
+ - Productos/Servicios
+ - Contabilidad
+
+
+
+ Ver más características
+
+ - Informes contables
+ - Ventas
+ - Informes de ventas
+ - Compras
+ - Agenda
+ - Liquidación de profesionales
+
+
+
-
-
Características
-
- - Característica #1 del plan
- - Característica #2 del plan
- - Característica #3 del plan
- - Característica #4 del plan
- - Característica #5 del plan
-
-
+
-
Tipo de plan
+
+
Plan Avanzado
-
-
$500.000
-
- Lorem ipsum dolor sit amet, consectetur adipisicing
- elit. Repudiandae sapiente optio, quisquam ea
- placeat architecto dicta, suscipit quasi
- necessitatibus neque.
-
+
+
$500.000 COP
+
+ Lorem ipsum dolor sit amet, consectetur
+ adipisicing elit. Repudiandae sapiente optio,
+ quisquam ea placeat architecto dicta, suscipit
+ quasi necessitatibus neque.
+
+
+
+
+
Características
+
+ - Característica #1 del plan
+ - Característica #2 del plan
+ - Característica #3 del plan
+ - Característica #4 del plan
+ - Característica #5 del plan
+
+
-
-
Características
-
- - Característica #1 del plan
- - Característica #2 del plan
- - Característica #3 del plan
- - Característica #4 del plan
- - Característica #5 del plan
-
-
+
-
Tipo de plan
+
+
Plan Intermedio
-
-
$300.000
-
- Lorem ipsum dolor sit amet, consectetur adipisicing
- elit. Repudiandae sapiente optio, quisquam ea
- placeat architecto dicta, suscipit quasi
- necessitatibus neque.
-
+
+
$300.000 COP
+
+ Lorem ipsum dolor sit amet, consectetur
+ adipisicing elit. Repudiandae sapiente optio,
+ quisquam ea placeat architecto dicta, suscipit
+ quasi necessitatibus neque.
+
+
+
+
+
Características
+
+ - Característica #1 del plan
+ - Característica #2 del plan
+ - Característica #3 del plan
+ - Característica #4 del plan
+ - Característica #5 del plan
+
+
-
-
Características
-
- - Característica #1 del plan
- - Característica #2 del plan
- - Característica #3 del plan
- - Característica #4 del plan
- - Característica #5 del plan
-
-
+
diff --git a/src/styles/index.css b/src/styles/index.css
index 089c605..5daffc4 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -2,7 +2,7 @@
display: flex;
overflow-x: hidden;
flex-direction: column;
- gap: 220px;
+ gap: 140px;
background-color: transparent;
}
@@ -78,16 +78,33 @@
display: flex;
flex-direction: column;
+ justify-content: space-between;
gap: var(--space-2xl-48px);
- height: 600px;
+ min-height: 650px;
+ width: 380px;
box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.1);
background-color: #363636;
}
+.pricing-card-content {
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-2xl-48px);
+}
+
+.more-details {
+ font-size: var(--font-desktop-base);
+ line-height: var(--line-height-desktop-base);
+ color: white;
+ text-align: left;
+ cursor: pointer;
+ text-decoration: underline;
+}
+
.best-plan-card {
border: 4px solid #e54c75;
- height: 620px;
+ height: 680px;
}
.pricing-card .plan-type {
@@ -119,9 +136,16 @@
}
}
+.button-and-link-container {
+ display: flex;
+ flex-direction: column;
+ gap: var(--space-md-16px);
+ align-items: center;
+}
+
.select-plan-button {
height: 42px;
- width: auto;
+ width: 100%;
padding: var(--space-sm-8px) var(--space-md-16px);
border: none;
border-radius: 16px;
@@ -134,3 +158,13 @@
display: flex;
justify-content: center;
}
+
+.button-and-link-container a {
+ font-size: var(--font-desktop-sm);
+ font-weight: normal;
+ line-height: var(--line-height-desktop-sm);
+ color: white;
+ text-align: center;
+ cursor: pointer;
+ text-decoration: underline;
+}