From 665d33ca7ccc9e70f4e4c3bdc8a537a861083655 Mon Sep 17 00:00:00 2001 From: "Nil Y. Ilba" Date: Fri, 31 May 2024 07:49:33 +0200 Subject: [PATCH] Text_updates --- website/src/App.css | 16 +++++++++ website/src/App.js | 70 ++++++++++++++++++------------------- website/src/BarChart.jsx | 17 +++++---- website/src/GraphTest.jsx | 18 +++++----- website/src/MapComponent.js | 18 +++++----- website/src/Summary.jsx | 23 ++++++------ 6 files changed, 89 insertions(+), 73 deletions(-) diff --git a/website/src/App.css b/website/src/App.css index cce70c7..0b4020c 100644 --- a/website/src/App.css +++ b/website/src/App.css @@ -137,4 +137,20 @@ body { .theme-toggle:hover { background-color: var(--link-color); color: var(--background-color); +} + +button { + font-size: 16px; /* Larger font size */ + text-align: center; /* Center text alignment */ + padding: 10px 20px; /* Comfortable padding around the text */ + margin: 5px; /* Space between buttons */ + border: none; + border-radius: 5px; + background-color: #4CAF50; /* A nice green background */ + color: white; /* White text */ + cursor: pointer; +} + +button:hover { + background-color: #45a049; /* Darker green on hover */ } \ No newline at end of file diff --git a/website/src/App.js b/website/src/App.js index b11481e..74a980f 100644 --- a/website/src/App.js +++ b/website/src/App.js @@ -52,34 +52,40 @@ function App() { How Are European Views on Politics and Society Changing?

-

- Across Europe, a quiet change is brewing. Inspired by an Economist - article on the growing divide between young men and women, this - project dives into the European Social Survey (ESS) to explore how - social norms and political attitudes vary by generation and gender. +

+ Inspired by an Economist article on the growing divide between young + men and women, this project dives into the European Social Survey + (ESS) to explore how beliefs, behavior, and life outcomes vary by + generation and gender. +

-

- We'll be looking beyond just education and politics, examining - everyday habits like media consumption and life situations like - financial stress to see if they create these differences. Our goal? - To create an accessible and informative visualization that sheds - light on these trends, sparking a conversation about where European - society might be headed. +

+ We'll be probing for trends in everything + from religious activity to financial stability. + Our goal? + To create accessible and informative visualizations + that distill a sprawling survey into valuable insights – and + hopefully spark a conversation about European society’s future + along the way. Throughout this page, we visualize indices for + seven different topics concerning the lives of Europeans. + Navigate your curser to the left to see possibilities. + Each topic’s index is created by scaling responses for a set + of similar ESS questions between 1 (low) and 6 (high) before + averaging by gender, age, and/or year. Hover over a topic + to see the set of survey questions. +

-

- 1. Bar Chart: Setting the Stage +

+ Setting the Stage: Exploring European Preferences by Age Group +

- Our journey starts with a Europe-wide snapshot. This bar chart shows - average levels of a chosen variable (like trust in institutions) for - four different age groups over time. This helps you get a feel for - overall trends before we explore how these trends differ for men and - women. + We begin with a Europe-wide snapshot. The bar chart below displays the average level of a chosen category’s index for four different age groups over time. It should help you orient yourself with overall trends before exploring differences between men and women.

@@ -87,15 +93,12 @@ function App() {
-

- 2. Gender Divide Across Europe +

+ Zooming In: Gender Comparison Within European Nations +

-

- Next, we zoom in to see how men and women compare across Europe. This - heatmap uses color to show where women or men report higher levels of a - chosen variable, like political participation. You can select an age - group and drag the year slider to see how these differences change over - time. Hover over a country to see a detailed breakdown by year. +

+ Next, we zoom in to see how men and women compare across Europe. This choropleth uses color to show where women or men report higher levels of a chosen category’s index. The darker the shade of blue, the higher the category’s index is for men relative to women (vice versa for orange and women relative to men). At the bottom, you can select an age group and drag the year slider to slice the index in different ways. Hover over a country to see a detailed breakdown by year

@@ -103,16 +106,11 @@ function App() {
-

- 3. Ranking the Gender Divide +

+ Ranking the Gender Divide Across Europe

-

- This final view lets you compare countries side-by-side. It shows a - ranked list of European nations based on the chosen variable's gender - gap in a specific year. Hover over a country to see the exact numbers - and how the gap breaks down by age group. This lets you see which - countries have the biggest differences in, for example, media - consumption habits between men and women. +

+ We hope you enjoyed this study of Europeans male, female, young, and old! Remember to select another category on the left and continue investigating!

diff --git a/website/src/BarChart.jsx b/website/src/BarChart.jsx index f470a4a..264b0e3 100644 --- a/website/src/BarChart.jsx +++ b/website/src/BarChart.jsx @@ -8,14 +8,13 @@ const BarChart = ({ variable }) => { const chartRef = useRef(null); const buttonTexts = { - wellbeing: "Wellbeing related text.", - internet: "Internet related text.", - relig: "Religion related text.", - social: "Social related text.", - finstab: "Financial stability related text.", - conservatism: "Conservatism related text.", - anti_imm: "Anti-immigration related text.", - trust: "Trust related text.", + wellbeing: "Throughout the past two decades, wellbeing (as measured by self-reported health, happiness, safety, and life satisfaction) and age have been negatively correlated. Even so, wellbeing has remained high relative to the other ESS indices we explore, and has even experienced a small increase since 2010. This increase was sustained for respondents aged 40 and above and, in 2020, saw a dip among younger respondents.", + internet: "Perhaps unsurprisingly, internet use has risen dramatically since 2002. Younger respondents saw their fastest usage increase in the aughts and have effectively topped the scales since 2016. Only the oldest respondents have not yet reported extremely frequent usage, though their uptake in the past two decades has been steady.", + relig: "Religious activity (as measured by levels of self-reported prayer and religious attendance) has seen a small but unmistakable decrease in average level since 2002. This decrease is seen across all age groups. While the oldest respondents report the largest decrease over time, the positive correlation between age and religious activity means the oldest respondents’ status as the most religious cohort is unthreatened across time.", + social: "There are two salient observations about respondents’ social activity (as measured by engagement in social activities and meetings with friends): (1) age and social participation are negatively correlated and (2) self-reported social activity has remained stable over time. The only cohort for which social activity may be trending downward is the youngest – though data from after the covid-era final survey may reflect a temporary dip. ", + finstab: "Financial stability, as measured by self-reported income levels and feelings about income levels, is one of the few indices that exhibits a sustained level shift during the measured time range. Specifically, all age groups see a boost in perceived financial stability between the 2012 and 2014 ESS rounds. This could be related to the quantitative easing from the ECB (note the ‘2014’ round collected data between 2014 and 2015) and emergence from the austerity of the early 2010s. Separately, most cohorts report similar levels of financial stability to one another in any given year; only the oldest cohort, which reports more financial vulnerability, stands apart.", + conservatism: "One of the more surprising observations across all views present in this figure is that Europe does not report any noticeable trends at all in self-reported levels of conservatism. Neither age cohort nor time intra-age-cohort exhibit a relationship with the index. In one sense, this pours cold water over the notion that Europe has been becoming more conservative since the mid-2010s (or, indeed, any sweeping statements about the average European’s political view). That said, it’s important to remember that this a self-reported metric, and that respondents may wish to be perceived as more moderate than they really are. ", + trust: "Trust in the legal system, police, and parliament saw a drawn-out if minor dip across all age cohorts between 2002 and 2012. From the 2014 round and onward, this dip was swiftly reversed. While the youngest cohort reached new highs in trust in the later period, other generations reached but did not surpass levels of trust seen when the ESS was launched.", }; const [text, setText] = useState(buttonTexts["wellbeing"]); // State to hold the text @@ -124,7 +123,7 @@ const BarChart = ({ variable }) => { .append("div") .attr("class", "tooltip") .style("position", "absolute") - .style("background", "rgba(128, 128, 128, 0.7)") // Gray transparent background + .style("background", "rgba(128, 128, 128, 0.9)") // Gray transparent background .style("color", "white") // White text .style("border", "1px solid #fff") // White border .style("padding", "10px") diff --git a/website/src/GraphTest.jsx b/website/src/GraphTest.jsx index 99b86e3..213077f 100644 --- a/website/src/GraphTest.jsx +++ b/website/src/GraphTest.jsx @@ -11,14 +11,14 @@ const GraphTest = ({ variable }) => { const [selectedYear, setSelectedYear] = useState("2002"); const buttonTexts = { - wellbeing: "Wellbeing related text.", - internet: "Internet related text.", - relig: "Religion related text.", - social: "Social related text.", - finstab: "Financial stability related text.", - conservatism: "Conservatism related text.", - anti_imm: "Anti-immigration related text.", - trust: "Trust related text.", + wellbeing: "We find aggregate wellbeing oscillating for both women and men, though the gap does slim as the years proceed. Meanwhile, variance in wellbeing is relatively higher between 2004 and 2012, but after this period, different countries start to converge in level if not gender gap.", + internet: "By the end of the time range, the gender gap in internet usage is almost completely erased, the number of countries in which men report more internet usage is about equal to the number of countries in which women report more internet usage, and country-level gender gaps in internet usage become much smaller. This shift is speedy; even comparing 2018 and 2020 we find a marked pullback in average size of internet-usage-based gender gaps.", + relig: "Both men and women report lower average levels of religious activity over time. However, rather than manifest as a gradual trend, there appears to be a level shift around 2012-2014 and stability since. This is one of the few indices where the country level gender gaps are large and remain so even at the end of the time range. Furthermore, the gender gap is strong whether the country as a whole is particularly religious or not.", + social: "The slim gap between average male and female levels confirms the lack of a striking gender-based difference in average social activity. However, it is worth noting that the gender-based gap is typically higher when men report more social activity than women versus when women report more social activity than men. The distribution of gaps, meanwhile, appears stable, meaning there is scant evidence of overall convergence toward equality in this domain.", + finstab: "While the gender gap in financial stability is persistent, both genders benefit from the level positive shift in financial stability seen after 2012. There doesn’t appear to be a relationship between a country’s aggregate reported financial stability and the gender gap in reported financial stability except in individual years. For example, 2014 and 2016 see countries with the lowest aggregate financial stability exhibiting the highest gender differentials.", + conservatism: "While average levels of conservatism hover around the same place and even decrease through the timeframe, there is a small but steady widening of the gender gap after 2012. We find both a widening of the average gap in conservatism between men and women and a growing number of countries for which male-reported conservatism is higher than female-reported conservatism.", + trust: "An interesting trend emerges when viewing the earliest years in the time range: in countries where men have more trust in institutions than women, trust in institutions is higher overall. Equally interesting is the fact that this correlation dissipates after 2010-2012, after which neither the gender gaps nor averages differ in distribution." + }; const [text, setText] = useState(buttonTexts["wellbeing"]); // State to hold the text @@ -145,7 +145,7 @@ const GraphTest = ({ variable }) => { .append("div") .attr("class", "tooltip") .style("position", "absolute") - .style("background", "rgba(128, 128, 128, 0.7)") // Gray transparent background + .style("background", "rgba(128, 128, 128, 0.9)") // Gray transparent background .style("color", "white") // White text .style("border", "1px solid #fff") // White border .style("padding", "5px") diff --git a/website/src/MapComponent.js b/website/src/MapComponent.js index 228334c..8b3a524 100644 --- a/website/src/MapComponent.js +++ b/website/src/MapComponent.js @@ -51,14 +51,16 @@ const MapComponent = ({ variable }) => { const [filteredData, setFilteredData] = useState({}); const buttonTexts = { - wellbeing: "Wellbeing related text.", - internet: "Internet related text.", - relig: "Religion related text.", - social: "Social related text.", - finstab: "Financial stability related text.", - conservatism: "Conservatism related text.", - anti_imm: "Anti-immigration related text.", - trust: "Trust related text.", + + wellbeing: "Men report higher levels of wellbeing than women almost across the board. In recent years, this difference appears to have been more pronounced in Western and Northern Europe than in Eastern Europe; one country-year data point drawing attention to this trend is Lithuania in 2018, home to the single year in which women report higher wellbeing than men. Another country of interest is France, in which men consistently report outsized wellbeing relative to women when compared to other countries on the map.", + internet: "Men tend to report more internet usage than woman, especially in the earliest years of the ESS. However, in northern and eastern European countries, the gender difference lessens and even reverses in the most recent years. One country of interest is Ireland, where women exclusively report more internet usage than men following the break in data availability between 2012 and 2014.", + relig: "Female respondents consistently report more religious activity than male respondents in every country save two: Turkey and Israel. The standard gender differential in this domain is more pronounced in the south and east, where time does not appear to be bringing the two genders closer together (see Portugal, for example).", + social: "Gender-based trends in social activity are less visible than those seen for other indices. That said, in northern Europe, women tend to be more social than men. Analysis elsewhere is perhaps best conducted at the country level. For example, in France and Germany, the more social gender is not consistent, while in Slovenia, men reported noticeably more social activity than women up until recent years.", + finstab: "Financial stability is another domain in which men tend to report higher values than women. It is also another domain where regional trends are not particularly pronounced. Country-level analysis is most compelling in this case. For example, we might ask ourselves why the financial stability gender gap in France experienced a sustained widening between 2014 and 2018 while in Belgium this gap slimmed.", + conservatism: "Men tend to report higher levels of conservatism, but it is by no means a universal rule. Indeed, in all years, we find 2-3 countries in which women report higher levels of conservatism than men. Portugal is most often one such country while Spain and Hungary are not far behind. Temporal analysis yields some interesting results: for example, Poland, Sweden, Germany, and France all experience their highest gap between male and female conservatism at the tail end of the time range, perhaps indicating the beginning of a new dynamic between gender and politics.", + trust: "Rarely is this particular gender differential pronounced, and rarely do we see either gender clearly exhibiting more trust on the continent in a given year. To report one trend, higher trust among women than men appears to be a more stable gap in eastern Europe than in the West - though this does not imply stability in the level of trust itself (see Poland’s recent dip).", + + }; const [text, setText] = useState(buttonTexts["wellbeing"]); // State to hold the text diff --git a/website/src/Summary.jsx b/website/src/Summary.jsx index 2d6acbb..2b4480d 100644 --- a/website/src/Summary.jsx +++ b/website/src/Summary.jsx @@ -1,40 +1,41 @@ import React, { useEffect, useRef, useState } from "react"; import * as d3 from "d3"; + const Summary = ({ variable }) => { return (
-

Summary of Categories

+

Highlights

-
+

Wellbeing

-

Exploring the overall happiness and life satisfaction of individuals.

+

Wellbeing levels have shown resilience over two decades, with notable increases among older Europeans contrasted by recent declines among the youth.

Internet

-

Understanding internet usage patterns and its impact on daily life.

+

Internet usage has surged across all demographics, reaching near parity between genders by 2020, especially in Northern and Eastern Europe.

-
+

Religion

-

Analyzing the role of religion in modern society.

+

Religious activity has consistently declined across Europe, yet remains deeply gendered, with women persistently more devout than men.

-
+

Social

-

Examining social interactions and community involvement.

+

Social activities display minimal gender discrepancies, though regional variations suggest a complex interplay of social behaviors across Europe.

Financial Stability

-

Assessing financial health and stability of households.

+

Financial stability perceptions have improved post-2012, revealing subtle yet significant shifts without a clear correlation to gender disparities.

Conservatism

-

Investigating political conservatism and its influence on policies.

+

Despite general stability in self-reported conservatism, the last decade has seen a subtle but steady expansion in gender differences, particularly in specific European countries.

Trust

-

Measuring trust in institutions and interpersonal trust.

+

Trust in institutions has recovered from a mid-range dip, with Eastern Europe showing a more pronounced and stable gender gap favoring women's higher trust levels.