Downloads · 30 days
0
ORGANICER
F1N2G6/ORGANICER
ORGANICER is a text classification model from F1N2G6. Use it when you need a label for a piece of text. The card lists the license as bigscience-openrail-m.
<!DOCTYPE html <html lang="es" data-color-scheme="light" <head <meta charset="UTF-8" / <meta name="viewport" content="width=device-width, initial-scale=1.0" / <titlePlanificador Mensual de Hábitos</title <style / ====…
Access
Public
Updated Jan 10, 2026
Repo size
—
Likes
0
Public
Repo makeup
Click a slice to open those files.
.md25 KB · 94%
At a glance
- Task
- Text Classification
- License
- bigscience-openrail-m
- Access
- Public
- Created
- Jan 10, 2026
- Updated
- Jan 10, 2026
- SHA
- b26ff218
Try a prompt
Base models
Datasets
Model card
From the Hugging Face model README
<!DOCTYPE html>
<html lang="es" data-color-scheme="light">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Planificador Mensual de Hábitos</title>
<style>
/* ===== PERPLEXITY DESIGN SYSTEM (recortado a lo necesario) ===== */
:root {
--color-white: rgba(255, 255, 255, 1);
--color-cream-50: rgba(252, 252, 249, 1);
--color-cream-100: rgba(255, 255, 253, 1);
--color-gray-200: rgba(245, 245, 245, 1);
--color-gray-300: rgba(167, 169, 169, 1);
--color-gray-400: rgba(119, 124, 124, 1);
--color-slate-500: rgba(98, 108, 113, 1);
--color-brown-600: rgba(94, 82, 64, 1);
--color-charcoal-700: rgba(31, 33, 33, 1);
--color-charcoal-800: rgba(38, 40, 40, 1);
--color-slate-900: rgba(19, 52, 59, 1);
--color-teal-300: rgba(50, 184, 198, 1);
--color-teal-400: rgba(45, 166, 178, 1);
--color-teal-500: rgba(33, 128, 141, 1);
--color-teal-600: rgba(29, 116, 128, 1);
--color-teal-700: rgba(26, 104, 115, 1);
--color-red-400: rgba(255, 84, 89, 1);
--color-orange-400: rgba(230, 129, 97, 1);
--color-brown-600-rgb: 94, 82, 64;
--color-teal-500-rgb: 33, 128, 141;
--color-slate-900-rgb: 19, 52, 59;
--color-slate-500-rgb: 98, 108, 113;
--color-background: var(--color-cream-50);
--color-surface: var(--color-cream-100);
--color-text: var(--color-slate-900);
--color-text-secondary: var(--color-slate-500);
--color-primary: var(--color-teal-500);
--color-primary-hover: var(--color-teal-600);
--color-primary-active: var(--color-teal-700);
--color-secondary: rgba(var(--color-brown-600-rgb), 0.12);
--color-secondary-hover: rgba(var(--color-brown-600-rgb), 0.2);
--color-secondary-active: rgba(var(--color-brown-600-rgb), 0.25);
--color-border: rgba(var(--color-brown-600-rgb), 0.2);
--color-btn-primary-text: var(--color-cream-50);
--color-card-border: rgba(var(--color-brown-600-rgb), 0.12);
--color-card-border-inner: rgba(var(--color-brown-600-rgb), 0.12);
--color-focus-ring: rgba(var(--color-teal-500-rgb), 0.4);
--font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
--font-family-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
--font-size-sm: 12px;
--font-size-base: 14px;
--font-size-lg: 16px;
--font-size-2xl: 20px;
--font-weight-medium: 500;
--font-weight-semibold: 550;
--space-4: 4px;
--space-8: 8px;
--space-12: 12px;
--space-16: 16px;
--space-20: 20px;
--space-24: 24px;
--space-32: 32px;
--radius-sm: 6px;
--radius-base: 8px;
--radius-lg: 12px;
--shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.04),
0 2px 4px -1px rgba(0, 0, 0, 0.02);
--duration-fast: 150ms;
--duration-normal: 250ms;
--ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
}
html {
font-size: var(--font-size-base);
font-family: var(--font-family-base);
color: var(--color-text);
background-color: var(--color-background);
-webkit-font-smoothing: antialiased;
box-sizing: border-box;
}
*, *::before, *::after { box-sizing: inherit; }
body { margin: 0; }
h1, h2, h3 {
margin: 0;
font-weight: var(--font-weight-semibold);
}
h1 { font-size: 24px; }
h2 { font-size: 20px; }
h3 { font-size: 16px; }
.container {
max-width: 1200px;
margin: 0 auto;
padding: var(--space-16);
}
.card {
background-color: var(--color-surface);
border-radius: var(--radius-lg);
border: 1px solid var(--color-card-border);
box-shadow: var(--shadow-sm);
padding: var(--space-16);
margin-bottom: var(--space-16);
}
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
padding: var(--space-8) var(--space-16);
border-radius: var(--radius-base);
font-size: var(--font-size-base);
font-weight: var(--font-weight-medium);
cursor: pointer;
border: none;
transition: all var(--duration-normal) var(--ease-standard);
}
.btn-primary {
background: var(--color-primary);
color: var(--color-btn-primary-text);
}
.btn-primary:hover { background: var(--color-primary-hover); }
.btn-secondary {
background: var(--color-secondary);
color: var(--color-text);
}
.btn-secondary:hover { background: var(--color-secondary-hover); }
.form-group { margin-bottom: var(--space-12); }
.form-label {
display: block;
margin-bottom: var(--space-4);
font-size: var(--font-size-sm);
color: var(--color-text-secondary);
}
.form-control {
width: 100%;
padding: var(--space-8) var(--space-12);
border-radius: var(--radius-base);
border: 1px solid var(--color-border);
background-color: var(--color-surface);
font-size: var(--font-size-base);
}
.form-control:focus {
outline: 2px solid var(--color-primary);
outline-offset: 1px;
}
textarea.form-control {
min-height: 120px;
resize: vertical;
}
.layout-main {
display: grid;
grid-template-columns: 260px minmax(260px, 1fr) 300px;
gap: var(--space-16);
}
@media (max-width: 1024px) {
.layout-main {
grid-template-columns: 1fr;
}
}
.habit-list-item {
display: grid;
grid-template-columns: auto 1fr auto;
gap: var(--space-8);
align-items: center;
padding: var(--space-8);
border-radius: var(--radius-base);
border: 1px solid rgba(0,0,0,0.03);
margin-bottom: var(--space-8);
background-color: rgba(0,0,0,0.01);
}
.habit-number {
font-weight: var(--font-weight-semibold);
font-size: var(--font-size-sm);
color: var(--color-text-secondary);
width: 24px;
text-align: right;
}
.habit-name-input {
border-radius: var(--radius-sm);
border: 1px solid var(--color-border);
padding: var(--space-4) var(--space-8);
font-size: var(--font-size-sm);
width: 100%;
}
.habit-meta {
display: flex;
flex-direction: column;
gap: var(--space-4);
align-items: flex-end;
}
.habit-toggle-row {
display: flex;
align-items: center;
gap: var(--space-4);
font-size: var(--font-size-sm);
}
.habit-toggle-row input[type="checkbox"] {
width: 16px;
height: 16px;
}
.habit-color-input {
width: 24px;
height: 24px;
padding: 0;
border-radius: var(--radius-sm);
border: 1px solid var(--color-border);
background: transparent;
cursor: pointer;
}
.month-header {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--space-12);
margin-bottom: var(--space-16);
}
.month-header > * {
flex: 0 0 auto;
}
.month-header-title {
font-size: var(--font-size-2xl);
font-weight: var(--font-weight-semibold);
}
.month-select-row {
display: flex;
gap: var(--space-8);
flex-wrap: wrap;
margin-bottom: var(--space-12);
}
.month-list {
display: flex;
flex-wrap: wrap;
gap: var(--space-8);
}
.month-pill {
padding: var(--space-4) var(--space-12);
border-radius: 999px;
border: 1px solid var(--color-border);
font-size: var(--font-size-sm);
cursor: pointer;
background-color: var(--color-surface);
}
.month-pill.active {
background-color: var(--color-primary);
color: var(--color-btn-primary-text);
border-color: var(--color-primary);
}
/* ===== CÍRCULO MENSUAL ===== */
.circle-container-card {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.circle-wrapper {
position: relative;
width: min(420px, 90vw);
height: min(420px, 90vw);
}
.circle-svg {
width: 100%;
height: 100%;
display: block;
}
.circle-legend {
margin-top: var(--space-12);
display: flex;
flex-wrap: wrap;
gap: var(--space-8);
justify-content: center;
font-size: var(--font-size-sm);
}
.circle-legend-item {
display: inline-flex;
align-items: center;
gap: var(--space-4);
padding: 2px 8px;
border-radius: 999px;
background-color: rgba(0,0,0,0.02);
}
.circle-legend-color {
width: 10px;
height: 10px;
border-radius: 999px;
border: 1px solid rgba(0,0,0,0.1);
}
.circle-center-label {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
font-size: var(--font-size-sm);
pointer-events: none;
}
/* Tooltip simple para día/hábito */
.tooltip {
position: fixed;
background: var(--color-charcoal-800);
color: white;
padding: 4px 8px;
border-radius: 4px;
font-size: 11px;
pointer-events: none;
z-index: 1000;
display: none;
white-space: nowrap;
}
<!-- Selección de mes -->
<div class="card">
<div class="month-select-row">
<div class="form-group" style="min-width: 160px;">
<label class="form-label" for="select-mes-num">Mes</label>
<select id="select-mes-num" class="form-control">
<option value="1">01 - Enero</option>
<option value="2">02 - Febrero</option>
<option value="3">03 - Marzo</option>
<option value="4">04 - Abril</option>
<option value="5">05 - Mayo</option>
<option value="6">06 - Junio</option>
<option value="7">07 - Julio</option>
<option value="8">08 - Agosto</option>
<option value="9">09 - Septiembre</option>
<option value="10">10 - Octubre</option>
<option value="11">11 - Noviembre</option>
<option value="12">12 - Diciembre</option>
</select>
</div>
<div class="form-group" style="min-width: 120px;">
<label class="form-label" for="input-anio">Año</label>
<input type="number" id="input-anio" class="form-control" value="2026" />
</div>
<div class="form-group" style="align-self: flex-end;">
<button id="btn-nuevo-mes" class="btn btn-primary">+ Nuevo mes</button>
</div>
</div>
<div class="form-group">
<label class="form-label">Meses creados</label>
<div id="lista-meses" class="month-list"></div>
</div>
</div>
<!-- Pantalla principal Mes -->
<div class="card">
<div id="mes-activo-header" class="month-header" style="margin-bottom: 0;">
<div class="month-header-title" id="titulo-mes-visual">Sin mes seleccionado</div>
</div>
<div class="layout-main" style="margin-top: var(--space-16);">
<!-- Zona izquierda: hábitos -->
<div>
<h3 style="margin-bottom: var(--space-8);">Hábitos (1–8)</h3>
<div id="lista-habitos"></div>
</div>
<!-- Zona central: círculo mensual -->
<div class="circle-container-card">
<div class="circle-wrapper">
<svg id="habit-circle" class="circle-svg" viewBox="0 0 400 400"></svg>
<div class="circle-center-label" id="circle-center-label"></div>
</div>
<div class="circle-legend" id="circle-legend"></div>
</div>
<!-- Zona derecha: observaciones -->
<div>
<h3 style="margin-bottom: var(--space-8);">Observaciones</h3>
<textarea id="textarea-observaciones" class="form-control" placeholder="Notas, reflexiones, objetivos del mes..."></textarea>
</div>
</div>
</div>
- Task
- Text Classification
- License
- bigscience-openrail-m
- Languages
- es
- Created
- Jan 10, 2026
- Updated
- Jan 10, 2026