diff --git a/agents_indicators/static/css/agents-indicators.css b/agents_indicators/static/css/agents-indicators.css new file mode 100644 index 0000000..6240ffa --- /dev/null +++ b/agents_indicators/static/css/agents-indicators.css @@ -0,0 +1,4 @@ +#pie-chart-agents{ + max-width: 45%; + margin: auto +} diff --git a/agents_indicators/static/css/agentsIndicators.css b/agents_indicators/static/css/agentsIndicators.css deleted file mode 100644 index 650b7fa..0000000 --- a/agents_indicators/static/css/agentsIndicators.css +++ /dev/null @@ -1,87 +0,0 @@ -.chart-container-month{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.chart-container-agents{ - position: relative; - height:70%; - width:70%; - padding-left: 5%; - padding-right: 5%; -} - -.chart-container-area{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.chart-container-time{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.text-chart{ - position: relative; - padding-left: 5%; - padding-right: 5%; - padding-top: 2%; -} - -.text-chart h3{ - border: 2px; - padding: 10px; - background: #dddddd; - border-top-right-radius:2em; -} - -.text-chart-init h3{ - border: 2px; - padding: 10px; - background: #dddddd; - border-top-right-radius:2em; -} - -.indicators_navbar{ - background-color: green; - margin-bottom: 5%; - text-align: center; -} - -.indicators_navbar ul{ - display: inline; - float: left; - margin-top: 2%; -} - -.indicators_navbar li{ - display: inline-block; - float: left; - border: 2px solid blue; - padding: 10px; - cursor: pointer; -} - -.indicators_navbar li:first-child { - border-radius: 15px 0px 0px 15px; - border: 2px solid blue; - -} - -.indicators_navbar li:last-child { - border-radius: 0px 15px 15px 0px; - border: 2px solid blue; -} - -.indicators_navbar li:hover { - background-color: #87CEFF; -} diff --git a/agents_indicators/static/js/agents_indicators.js b/agents_indicators/static/js/agents_indicators.js deleted file mode 100644 index deb87bc..0000000 --- a/agents_indicators/static/js/agents_indicators.js +++ /dev/null @@ -1,36 +0,0 @@ -$("#quantitativo_mensal").show(); -$("#agentes_tipo").hide(); -$("#agentes_area").hide(); -$("#crescimento").hide(); - -//Aparece quantitativo_mensal -$("#quantitativo_mensal_button" ).click(function() { - $("#quantitativo_mensal").show(); - $("#agentes_tipo").hide(); - $("#agentes_area").hide(); - $("#crescimento").hide(); -}); - -//Aparece agentes_tipo -$("#agentes_tipo_button" ).click(function() { - $("#quantitativo_mensal").hide(); - $("#agentes_tipo").show(); - $("#agentes_area").hide(); - $("#crescimento").hide(); -}); - -//Aparece agentes_area -$("#agentes_area_button" ).click(function() { - $("#quantitativo_mensal").hide(); - $("#agentes_tipo").hide(); - $("#agentes_area").show(); - $("#crescimento").hide(); -}); - -//Aparece crescimento -$("#crescimento_button" ).click(function() { - $("#quantitativo_mensal").hide(); - $("#agentes_tipo").hide(); - $("#agentes_area").hide(); - $("#crescimento").show(); -}); diff --git a/agents_indicators/templates/agents_indicators/agents-indicators.html b/agents_indicators/templates/agents_indicators/agents-indicators.html new file mode 100644 index 0000000..605aa8c --- /dev/null +++ b/agents_indicators/templates/agents_indicators/agents-indicators.html @@ -0,0 +1,91 @@ +{% extends 'quero_cultura/base.html' %} +{% load static %} + + {% block content %} + + + + + + + +
+
+ + + + + + + + + + + + +
+
+ + +
+
+
+ +
+ +
+

Este gráfico refere-se à quantidade de Agentes que se cadastraram por mês na plataforma "Mapas Culturais" ao longo de sua existência.

+
+
+ +
+
+ +
+ +
+

Este gráfico refere-se à porcentagem de agentes que se declaram "Individuais" ou "Coletivos". Agentes individuais são os perfis que representam apenas uma pessoa, enquanto os coletivos podem representar uma empresa, ong, grupo cultural, entre outras entidades coletivas.

+
+
+ +
+
+ +
+ +
+

Este gráfico refere-se à quantidade de agentes cadastrados que declaram ter afinidade ou efetivamente atuar em determinada área de contibuição cultural."

+
+
+ +
+
+ +
+ +
+

Este gráfico ilustra o crescimento da plataforma "Mapas culturais" em relação ao total de registros de agentes ao longo de sua existência.

+
+
+
+ + + + + + + +{% endblock %} diff --git a/agents_indicators/templates/agents_indicators/agents_indicators.html b/agents_indicators/templates/agents_indicators/agents_indicators.html deleted file mode 100644 index 4841f32..0000000 --- a/agents_indicators/templates/agents_indicators/agents_indicators.html +++ /dev/null @@ -1,67 +0,0 @@ -{% extends 'quero_cultura/base.html' %} - - {% block content %} - - - -
- -
- -
-
-

Quantitativo Mensal

-

Este gráfico refere-se à quantidade de Agentes que se cadastraram por mês na plataforma "Mapas Culturais" ao longo de sua existência.

-
- -
- -
-
- -
-
-

Porcentagem de Agentes por Tipo

-

Este gráfico refere-se à porcentagem de agentes que se declaram "Individuais" ou "Coletivos". Agentes individuais são os perfis que representam apenas uma pessoa, enquanto os coletivos podem representar uma empresa, ong, grupo cultural, entre outras entidades coletivas.

-
- -
- -
-
- -
-
-

Quantitativo de Agentes por Área de Atuação

-

Este gráfico refere-se à quantidade de agentes cadastrados que declaram ter afinidade ou efetivamente atuar em determinada área de contibuição cultural."

-
- -
- -
-
- -
-
-

Crescimento da Plataforma "Mapas Culturais"

-

Este gráfico ilustra o crescimento da plataforma "Mapas culturais" em relação ao total de registros de agentes ao longo de sua existência.

-
-
- -
-
- - - - -{% endblock %} diff --git a/agents_indicators/views.py b/agents_indicators/views.py index 3a41c30..e5d7afc 100644 --- a/agents_indicators/views.py +++ b/agents_indicators/views.py @@ -73,7 +73,7 @@ def index(request): } # Renderiza pagina e envia dicionario para apresentação dos graficos - return render(request, 'agents_indicators/agents_indicators.html', context) + return render(request, 'agents_indicators/agents-indicators.html', context) def build_type_indicator(new_data): diff --git a/events_indicators/static/css/events_indicators.css b/events_indicators/static/css/events_indicators.css deleted file mode 100644 index f178db7..0000000 --- a/events_indicators/static/css/events_indicators.css +++ /dev/null @@ -1,87 +0,0 @@ -.chart-container-month{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.chart-container-events{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.chart-container-language{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.chart-container-time{ - position: relative; - height:100%; - width:100%; - padding-left: 5%; - padding-right: 5%; -} - -.text-chart{ - position: relative; - padding-left: 5%; - padding-right: 5%; - padding-top: 2%; -} - -.text-chart h3{ - border: 2px; - padding: 10px; - background: #dddddd; - border-top-right-radius:2em; -} - -.text-chart-init h3{ - border: 2px; - padding: 10px; - background: #dddddd; - border-top-right-radius:2em; -} - -.indicators_navbar{ - background-color: green; - margin-bottom: 5%; - text-align: center; -} - -.indicators_navbar ul{ - display: inline; - float: left; - margin-top: 2%; -} - -.indicators_navbar li{ - display: inline-block; - float: left; - border: 2px solid blue; - padding: 10px; - cursor: pointer; -} - -.indicators_navbar li:first-child { - border-radius: 15px 0px 0px 15px; - border: 2px solid blue; - -} - -.indicators_navbar li:last-child { - border-radius: 0px 15px 15px 0px; - border: 2px solid blue; -} - -.indicators_navbar li:hover { - background-color: #87CEFF; -} diff --git a/events_indicators/static/js/events_indicators.js b/events_indicators/static/js/events_indicators.js deleted file mode 100644 index 8363893..0000000 --- a/events_indicators/static/js/events_indicators.js +++ /dev/null @@ -1,36 +0,0 @@ -$("#quantitativo_mensal").show(); -$("#events_type").hide(); -$("#events_language").hide(); -$("#crescimento").hide(); - -//Aparece quantitativo_mensal -$("#quantitativo_mensal_button" ).click(function() { - $("#quantitativo_mensal").show(); - $("#events_type").hide(); - $("#events_language").hide(); - $("#crescimento").hide(); -}); - -//Aparece agentes_tipo -$("#agentes_tipo_button" ).click(function() { - $("#quantitativo_mensal").hide(); - $("#events_type").show(); - $("#events_language").hide(); - $("#crescimento").hide(); -}); - -//Aparece agentes_area -$("#agentes_area_button" ).click(function() { - $("#quantitativo_mensal").hide(); - $("#events_type").hide(); - $("#events_language").show(); - $("#crescimento").hide(); -}); - -//Aparece crescimento -$("#crescimento_button" ).click(function() { - $("#quantitativo_mensal").hide(); - $("#events_type").hide(); - $("#events_language").hide(); - $("#crescimento").show(); -}); diff --git a/events_indicators/templates/events_indicators/events_indicators.html b/events_indicators/templates/events_indicators/events_indicators.html index 483a92c..df60e8d 100644 --- a/events_indicators/templates/events_indicators/events_indicators.html +++ b/events_indicators/templates/events_indicators/events_indicators.html @@ -1,63 +1,87 @@ {% extends 'quero_cultura/base.html' %} +{% load static %} {% block content %} - + + + -
- -
+ +
+
+ + + + -
-
-

Quantitativo Mensal

-

Este gráfico refere-se à quantidade de Eventos cadastrados por mês na plataforma "Mapas Culturais" ao longo de sua existência.

-
+ -
- -
-
+ -
-
-

Porcentagem de Eventos por Faixa Etaria

-

Este gráfico refere-se à quantidade de eventos que se encaixam em determinada faixa etaria.

-
+ -
- -
-
- -
-
-

Quantitativo de Eventos por Linguagem

-

Este gráfico refere-se à quantidade de eventos cadastrados que declaram ter afinidade ou efetivamente atuar em determinada linguagem cultural."

+ +
-
- -
-
+ +
+
+
+ +
-
-
-

Crescimento da Plataforma "Mapas Culturais"

-

Este gráfico ilustra o crescimento da plataforma "Mapas culturais" em relação ao total de registros de eventos ao longo de sua existência.

-
-
- +
+

Este gráfico refere-se à quantidade de Eventos cadastrados por mês na plataforma "Mapas Culturais" ao longo de sua existência.

+
+
+ +
+
+ +
+ +
+

Este gráfico refere-se à quantidade de eventos que se encaixam em determinada faixa etária.

+
+
+ +
+
+ +
+ +
+

Este gráfico refere-se à quantidade de eventos cadastrados que declaram ter afinidade ou efetivamente atuar em determinada linguagem cultural."

+
+
+ +
+
+ +
+ +
+

Este gráfico ilustra o crescimento da plataforma "Mapas culturais" em relação ao total de registros de eventos ao longo de sua existência.

+
+
-
+ + + + + - - + + + + + -
- -
+ +
+
+ + + + + -
- -
+ -
- -
+ -
- -
+ -
- -
+ - - + +
+
+
+ +
-{% endblock %} +
+

Este gráfico refere-se à porcentagem dos tipos de bibliotecas cadastradas.

+
+
+ +
+
+ +
+ +
+

Este gráfico refere-se à quantidade das bibliotecas por área de atuação.

+
+
+ + +
+
+ +
+ +
+

Este gráfico refere-se à quantidade das bibliotecas por tipo de esfera.

+
+
+ +
+
+ +
+ +
+

Este gráfico refere-se aos cadastros de bibliotecas por mês.

+
+
+ + +
+
+ +
+ +
+

Este gráfico refere-se aos cadastros de bibliotecas por ano.

+
+
+
+ + + + + + + + + + {% endblock %} diff --git a/quero_cultura/settings.py b/quero_cultura/settings.py index ecce54b..954102f 100644 --- a/quero_cultura/settings.py +++ b/quero_cultura/settings.py @@ -135,3 +135,6 @@ # https://docs.djangoproject.com/en/1.11/howto/static-files/ STATIC_URL = '/static/' +STATIC_ROOT = '/static/' +STATICFILES_DIRS = ['quero_cultura/static/', + 'agents_indicators/static/'] diff --git a/quero_cultura/static/css/indicators/indicators-container.css b/quero_cultura/static/css/indicators/indicators-container.css new file mode 100644 index 0000000..2d662c0 --- /dev/null +++ b/quero_cultura/static/css/indicators/indicators-container.css @@ -0,0 +1,29 @@ +.container-indicators{ + margin-top: 5%; + margin-left: 5%; + margin-right: 5%; + margin-bottom: 10%; + text-align: center; + position: relative; +} + +.chart-container{ + position: relative; + height: 70%; + width: 70%; + margin-left: auto; + margin-right: auto; +} + +.text-chart-init{ + position: relative; + padding-top: 2%; +} + +.container-indicators{ + visibility: visible; +} + +#mia{ + background-color: green; +} diff --git a/quero_cultura/static/css/indicators/indicators-navbar.css b/quero_cultura/static/css/indicators/indicators-navbar.css new file mode 100644 index 0000000..55cbf19 --- /dev/null +++ b/quero_cultura/static/css/indicators/indicators-navbar.css @@ -0,0 +1,261 @@ +.segmented-control { + width: 100%; + height: 50px; + color: #343a40; + font-size: 17px; + position: relative; + display: inline-block; + border: 1px solid currentColor; + font-style: normal; + font-weight: normal; + text-decoration: none; + overflow: hidden; + margin: .8em auto; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + border-radius: 2px; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + -moz-user-select: -moz-none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + -moz-transition-duration: 0.8s; + -o-transition-duration: 0.8s; + -webkit-transition-duration: 0.8s; + transition-duration: 0.8s; + -moz-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); + -o-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); + -webkit-transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); + transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); + -webkit-tap-highlight-color: transparent; +} +.segmented-control > input { + position: absolute; + left: -10000px; + opacity: 0; +} +.segmented-control > input[type='checkbox'] ~ label { + -moz-transition-duration: 0; + -o-transition-duration: 0; + -webkit-transition-duration: 0; + transition-duration: 0; +} +.segmented-control > input[type='checkbox'] ~ label:before { + opacity: 0; +} +.segmented-control > input:disabled:nth-child(1) ~ label:nth-of-type(1) { + opacity: 0.3; + cursor: not-allowed; +} +.segmented-control > input:nth-child(1):checked ~ label:nth-of-type(1):after, .segmented-control > input:nth-child(1):checked ~ label:nth-of-type(1):before { + opacity: 1; +} +.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(1) ~ label:before { + left: 0%; +} +.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:before { + left: 0%; +} +.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:before { + left: 0%; +} +.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { + left: 0%; +} +.segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(5):after, .segmented-control > input:nth-child(5):checked ~ label:first-of-type:nth-last-of-type(5):before, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:after, .segmented-control > input:nth-child(1):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:before { + left: 0%; +} + + +.segmented-control > input:disabled:nth-child(2) ~ label:nth-of-type(2) { + opacity: 0.3; + cursor: not-allowed; +} +.segmented-control > input:nth-child(2):checked ~ label:nth-of-type(2):after, .segmented-control > input:nth-child(2):checked ~ label:nth-of-type(2):before { + opacity: 1; +} +.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(2) ~ label:before { + left: 50%; +} +.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:before { + left: 33.33333%; +} +.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { + left: 25%; +} +.segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(5):after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(5):before, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:after, .segmented-control > input:nth-child(2):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:before { + left: 20%; +} + +.segmented-control > input:disabled:nth-child(3) ~ label:nth-of-type(3) { + opacity: 0.3; + cursor: not-allowed; +} +.segmented-control > input:nth-child(3):checked ~ label:nth-of-type(3):after, .segmented-control > input:nth-child(3):checked ~ label:nth-of-type(3):before { + opacity: 1; +} +.segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3):after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3):before, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(3) ~ label:before { + left: 66.66667%; +} +.segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { + left: 50%; +} +.segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(5):after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(5):before, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:after, .segmented-control > input:nth-child(3):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:before { + left: 40%; +} + + +.segmented-control > input:disabled:nth-child(4) ~ label:nth-of-type(4) { + opacity: 0.3; + cursor: not-allowed; +} +.segmented-control > input:nth-child(4):checked ~ label:nth-of-type(4):after, .segmented-control > input:nth-child(4):checked ~ label:nth-of-type(4):before { + opacity: 1; +} +.segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4):after, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4):before, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(4) ~ label:before { + left: 75%; +} +.segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(5):after, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(5):before, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:after, .segmented-control > input:nth-child(4):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:before { + left: 60%; +} + + + +.segmented-control > input:disabled:nth-child(5) ~ label:nth-of-type(5) { + opacity: 0.3; + cursor: not-allowed; +} +.segmented-control > input:nth-child(5):checked ~ label:nth-of-type(5):after, .segmented-control > input:nth-child(5):checked ~ label:nth-of-type(5):before { + opacity: 1; +} +.segmented-control > input:nth-child(5):checked ~ label:first-of-type:nth-last-of-type(5):after, .segmented-control > input:nth-child(5):checked ~ label:first-of-type:nth-last-of-type(5):before, .segmented-control > input:nth-child(5):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:after, .segmented-control > input:nth-child(5):checked ~ label:first-of-type:nth-last-of-type(5) ~ label:before { + left: 80%; +} + + + +.segmented-control > label { + display: inline-block; + padding: 0 .71em; + cursor: pointer; + float: left; + line-height: 3em; + font-style: inherit; + font-weight: inherit; + text-decoration: inherit; + -moz-transition-property: none; + -o-transition-property: none; + -webkit-transition-property: none; + transition-property: none; + -moz-transition-duration: inherit; + -o-transition-duration: inherit; + -webkit-transition-duration: inherit; + transition-duration: inherit; + -moz-transition-timing-function: inherit; + -o-transition-timing-function: inherit; + -webkit-transition-timing-function: inherit; + transition-timing-function: inherit; +} +.segmented-control > label:before, .segmented-control > label:after { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + pointer-events: none; +} +.segmented-control > label:after { + color: white; + content: attr(data-value); + text-align: center; + padding: inherit; + z-index: 10; + font-style: inherit; + text-decoration: inherit; + font-weight: inherit; + opacity: 0; + -moz-transition-property: opacity, left; + -o-transition-property: opacity, left; + -webkit-transition-property: opacity, left; + transition-property: opacity, left; + -moz-transition-duration: inherit; + -o-transition-duration: inherit; + -webkit-transition-duration: inherit; + transition-duration: inherit; + -moz-transition-timing-function: inherit; + -o-transition-timing-function: inherit; + -webkit-transition-timing-function: inherit; + transition-timing-function: inherit; +} +.segmented-control > label:after, .segmented-control > label { + text-align: center; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; +} +.segmented-control > label:before { + content: ''; + color: inherit; + background: currentColor; + -moz-transition-property: left; + -o-transition-property: left; + -webkit-transition-property: left; + transition-property: left; + -moz-transition-duration: inherit; + -o-transition-duration: inherit; + -webkit-transition-duration: inherit; + transition-duration: inherit; + -moz-transition-timing-function: inherit; + -o-transition-timing-function: inherit; + -webkit-transition-timing-function: inherit; + transition-timing-function: inherit; +} +.segmented-control > label:first-of-type:nth-last-of-type(1), .segmented-control > label:first-of-type:nth-last-of-type(1):after, .segmented-control > label:first-of-type:nth-last-of-type(1):before, .segmented-control > label:first-of-type:nth-last-of-type(1) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(1) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(1) ~ label:before { + width: 100%; +} +.segmented-control > label:first-of-type:nth-last-of-type(2), .segmented-control > label:first-of-type:nth-last-of-type(2):after, .segmented-control > label:first-of-type:nth-last-of-type(2):before, .segmented-control > label:first-of-type:nth-last-of-type(2) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(2) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(2) ~ label:before { + width: 50%; +} +.segmented-control > label:first-of-type:nth-last-of-type(3), .segmented-control > label:first-of-type:nth-last-of-type(3):after, .segmented-control > label:first-of-type:nth-last-of-type(3):before, .segmented-control > label:first-of-type:nth-last-of-type(3) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(3) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(3) ~ label:before { + width: 33.33333%; +} +.segmented-control > label:first-of-type:nth-last-of-type(4), .segmented-control > label:first-of-type:nth-last-of-type(4):after, .segmented-control > label:first-of-type:nth-last-of-type(4):before, .segmented-control > label:first-of-type:nth-last-of-type(4) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(4) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(4) ~ label:before { + width: 25%; +} +.segmented-control > label:first-of-type:nth-last-of-type(5), .segmented-control > label:first-of-type:nth-last-of-type(5):after, .segmented-control > label:first-of-type:nth-last-of-type(5):before, .segmented-control > label:first-of-type:nth-last-of-type(5) ~ label, .segmented-control > label:first-of-type:nth-last-of-type(5) ~ label:after, .segmented-control > label:first-of-type:nth-last-of-type(5) ~ label:before { + width: 20%; +} + +.segmented-control.italic, .segmented-control .italic { + font-style: italic; +} +.segmented-control.bold, .segmented-control .bold { + font-weight: bold; +} +.segmented-control.underline, .segmented-control .underline { + text-decoration: underline; +} +.segmented-control.line-through, .segmented-control .line-through { + text-decoration: line-through; +} + +.container { + margin: auto; + max-width: 100%; + min-width: 100%; + text-align: center; + padding: 0 6em; + position: absolute; +} + +@media (max-width: 991px) { + .container { + position: relative; + font-size: 10px; + } +} diff --git a/quero_cultura/static/css/sb-admin.css b/quero_cultura/static/css/sb-admin.css index b8a45ac..290f6f1 100644 --- a/quero_cultura/static/css/sb-admin.css +++ b/quero_cultura/static/css/sb-admin.css @@ -5,9 +5,11 @@ */ html { position: relative; - min-height: 100%; } + min-height: 100%; + } body { + font-family: 'Saira Semi Condensed', sans-serif; overflow-x: hidden; } body.sticky-footer { @@ -52,6 +54,10 @@ body.fixed-nav { .z-1 { z-index: 1; } +#navbarResponsive{ + font-size: 18px; +} + #mainNav .navbar-collapse { overflow: auto; max-height: 75vh; } diff --git a/quero_cultura/static/js/indicators/indicators-nav-jquery.js b/quero_cultura/static/js/indicators/indicators-nav-jquery.js new file mode 100644 index 0000000..e2bbcf3 --- /dev/null +++ b/quero_cultura/static/js/indicators/indicators-nav-jquery.js @@ -0,0 +1,37 @@ +//Essa função é chamada assim que a página carrega +//afim de mostrar apenas o primeiro gráfico na tela. +$(document).ready(function() { + var options_list = create_option_list(); + + for (var i = 0; i < options_list.length; i++) { + $(options_list[i]).hide(); + } + + $(options_list[0]).fadeIn(1700); + $('.container-indicators').css({visibility:'visible'}) +}); + +//Executa sempre que ocorre mudança na barra de seleção +//fazendo com que a opção clicada seja a aparecer na tela. +$("input[name='sc-1-1']").on('change',function() { + var option_clicked = $("input[name='sc-1-1']:checked").val(); + var options_list = create_option_list(); + + for (var i = 0; i < options_list.length; i++) { + $(options_list[i]).hide(); + } + + $(option_clicked).fadeIn(1500); +}); + +//Esse método retorna os possíveis valores de seleção na barra +//de navegação da página +function create_option_list() { + var options_list = []; + $(":radio").each(function(){ + var current_option = $(this).val(); + options_list.push(current_option); + }); + + return options_list; +} diff --git a/quero_cultura/templates/quero_cultura/base.html b/quero_cultura/templates/quero_cultura/base.html index 7b3278c..ea651c7 100644 --- a/quero_cultura/templates/quero_cultura/base.html +++ b/quero_cultura/templates/quero_cultura/base.html @@ -22,10 +22,7 @@ - - - - + diff --git a/specRunner.html b/specRunner.html index e8ca732..12d45d1 100644 --- a/specRunner.html +++ b/specRunner.html @@ -50,6 +50,7 @@ +