diff --git a/examples/example-godel.md b/examples/example-godel.md index 4cedeff..9ea6ec6 100644 --- a/examples/example-godel.md +++ b/examples/example-godel.md @@ -82,7 +82,7 @@ theme : godel --- -# Is Algebraic Graph Knowledge **Possible**? +# Is Algebraic Graph Knowledge a **Possibility**? Research has been conducted in order to evaluate the possibility of reaching meaningful knowledge from Algebraic Graph transformations. diff --git a/examples/presentation-ai/img/architecture.png b/examples/presentation-ai/img/architecture.png new file mode 100644 index 0000000..91d579f Binary files /dev/null and b/examples/presentation-ai/img/architecture.png differ diff --git a/examples/presentation-ai/img/filosofia.jpg b/examples/presentation-ai/img/filosofia.jpg new file mode 100644 index 0000000..ae91898 Binary files /dev/null and b/examples/presentation-ai/img/filosofia.jpg differ diff --git a/examples/presentation-ai/img/gpt-work00.png b/examples/presentation-ai/img/gpt-work00.png new file mode 100644 index 0000000..5f831f8 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work00.png differ diff --git a/examples/presentation-ai/img/gpt-work01.png b/examples/presentation-ai/img/gpt-work01.png new file mode 100644 index 0000000..83a9e1c Binary files /dev/null and b/examples/presentation-ai/img/gpt-work01.png differ diff --git a/examples/presentation-ai/img/gpt-work02.png b/examples/presentation-ai/img/gpt-work02.png new file mode 100644 index 0000000..be82543 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work02.png differ diff --git a/examples/presentation-ai/img/gpt-work02a.png b/examples/presentation-ai/img/gpt-work02a.png new file mode 100644 index 0000000..6bbde8e Binary files /dev/null and b/examples/presentation-ai/img/gpt-work02a.png differ diff --git a/examples/presentation-ai/img/gpt-work03a.png b/examples/presentation-ai/img/gpt-work03a.png new file mode 100644 index 0000000..e3a6a99 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03a.png differ diff --git a/examples/presentation-ai/img/gpt-work03b.png b/examples/presentation-ai/img/gpt-work03b.png new file mode 100644 index 0000000..ae91536 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03b.png differ diff --git a/examples/presentation-ai/img/gpt-work03c.png b/examples/presentation-ai/img/gpt-work03c.png new file mode 100644 index 0000000..d5dc3d6 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03c.png differ diff --git a/examples/presentation-ai/img/gpt-work03d.png b/examples/presentation-ai/img/gpt-work03d.png new file mode 100644 index 0000000..c5fe53d Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03d.png differ diff --git a/examples/presentation-ai/img/gpt-work03e.png b/examples/presentation-ai/img/gpt-work03e.png new file mode 100644 index 0000000..c4dfbc7 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03e.png differ diff --git a/examples/presentation-ai/img/gpt-work03f.png b/examples/presentation-ai/img/gpt-work03f.png new file mode 100644 index 0000000..fab6b24 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03f.png differ diff --git a/examples/presentation-ai/img/gpt-work03g.png b/examples/presentation-ai/img/gpt-work03g.png new file mode 100644 index 0000000..29e56a0 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03g.png differ diff --git a/examples/presentation-ai/img/gpt-work03h.png b/examples/presentation-ai/img/gpt-work03h.png new file mode 100644 index 0000000..a55632d Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03h.png differ diff --git a/examples/presentation-ai/img/gpt-work03i.png b/examples/presentation-ai/img/gpt-work03i.png new file mode 100644 index 0000000..7869901 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work03i.png differ diff --git a/examples/presentation-ai/img/gpt-work04a.png b/examples/presentation-ai/img/gpt-work04a.png new file mode 100644 index 0000000..3f52e76 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work04a.png differ diff --git a/examples/presentation-ai/img/gpt-work04b.png b/examples/presentation-ai/img/gpt-work04b.png new file mode 100644 index 0000000..c61f761 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work04b.png differ diff --git a/examples/presentation-ai/img/gpt-work04c.png b/examples/presentation-ai/img/gpt-work04c.png new file mode 100644 index 0000000..9d9a194 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work04c.png differ diff --git a/examples/presentation-ai/img/gpt-work04d.png b/examples/presentation-ai/img/gpt-work04d.png new file mode 100644 index 0000000..993ed7a Binary files /dev/null and b/examples/presentation-ai/img/gpt-work04d.png differ diff --git a/examples/presentation-ai/img/gpt-work04e.png b/examples/presentation-ai/img/gpt-work04e.png new file mode 100644 index 0000000..62ad414 Binary files /dev/null and b/examples/presentation-ai/img/gpt-work04e.png differ diff --git a/examples/presentation-ai/img/gpt-work04f.png b/examples/presentation-ai/img/gpt-work04f.png new file mode 100644 index 0000000..a34d05d Binary files /dev/null and b/examples/presentation-ai/img/gpt-work04f.png differ diff --git a/examples/presentation-ai/img/gpt00.png b/examples/presentation-ai/img/gpt00.png new file mode 100644 index 0000000..fef1b3b Binary files /dev/null and b/examples/presentation-ai/img/gpt00.png differ diff --git a/examples/presentation-ai/img/gpt00a.png b/examples/presentation-ai/img/gpt00a.png new file mode 100644 index 0000000..5c2d33d Binary files /dev/null and b/examples/presentation-ai/img/gpt00a.png differ diff --git a/examples/presentation-ai/img/gpt01.png b/examples/presentation-ai/img/gpt01.png new file mode 100644 index 0000000..3424ed1 Binary files /dev/null and b/examples/presentation-ai/img/gpt01.png differ diff --git a/examples/presentation-ai/img/gpt02.png b/examples/presentation-ai/img/gpt02.png new file mode 100644 index 0000000..3b7bf4c Binary files /dev/null and b/examples/presentation-ai/img/gpt02.png differ diff --git a/examples/presentation-ai/img/gpt03.png b/examples/presentation-ai/img/gpt03.png new file mode 100644 index 0000000..8be7049 Binary files /dev/null and b/examples/presentation-ai/img/gpt03.png differ diff --git a/examples/presentation-ai/img/gpt04.png b/examples/presentation-ai/img/gpt04.png new file mode 100644 index 0000000..dd0e2e1 Binary files /dev/null and b/examples/presentation-ai/img/gpt04.png differ diff --git a/examples/presentation-ai/img/gpt05.png b/examples/presentation-ai/img/gpt05.png new file mode 100644 index 0000000..235ddef Binary files /dev/null and b/examples/presentation-ai/img/gpt05.png differ diff --git a/examples/presentation-ai/img/gpt06.png b/examples/presentation-ai/img/gpt06.png new file mode 100644 index 0000000..49e98f7 Binary files /dev/null and b/examples/presentation-ai/img/gpt06.png differ diff --git a/examples/presentation-ai/img/gpt07.png b/examples/presentation-ai/img/gpt07.png new file mode 100644 index 0000000..11ff49e Binary files /dev/null and b/examples/presentation-ai/img/gpt07.png differ diff --git a/examples/presentation-ai/img/gpt08.png b/examples/presentation-ai/img/gpt08.png new file mode 100644 index 0000000..abfbbdf Binary files /dev/null and b/examples/presentation-ai/img/gpt08.png differ diff --git a/examples/presentation-ai/img/gpt09.png b/examples/presentation-ai/img/gpt09.png new file mode 100644 index 0000000..e50e0cb Binary files /dev/null and b/examples/presentation-ai/img/gpt09.png differ diff --git a/examples/presentation-ai/img/gpt10.png b/examples/presentation-ai/img/gpt10.png new file mode 100644 index 0000000..9a282d1 Binary files /dev/null and b/examples/presentation-ai/img/gpt10.png differ diff --git a/examples/presentation-ai/img/gpt11.png b/examples/presentation-ai/img/gpt11.png new file mode 100644 index 0000000..e1921f5 Binary files /dev/null and b/examples/presentation-ai/img/gpt11.png differ diff --git a/examples/presentation-ai/img/gpt12.png b/examples/presentation-ai/img/gpt12.png new file mode 100644 index 0000000..7b7c6a4 Binary files /dev/null and b/examples/presentation-ai/img/gpt12.png differ diff --git a/examples/presentation-ai/img/gpt13.png b/examples/presentation-ai/img/gpt13.png new file mode 100644 index 0000000..7bf981f Binary files /dev/null and b/examples/presentation-ai/img/gpt13.png differ diff --git a/examples/presentation-ai/img/gpt14.png b/examples/presentation-ai/img/gpt14.png new file mode 100644 index 0000000..fc3d1dd Binary files /dev/null and b/examples/presentation-ai/img/gpt14.png differ diff --git a/examples/presentation-ai/img/gpt15a.png b/examples/presentation-ai/img/gpt15a.png new file mode 100644 index 0000000..a5310ee Binary files /dev/null and b/examples/presentation-ai/img/gpt15a.png differ diff --git a/examples/presentation-ai/img/gpt15b.png b/examples/presentation-ai/img/gpt15b.png new file mode 100644 index 0000000..bdb3b8a Binary files /dev/null and b/examples/presentation-ai/img/gpt15b.png differ diff --git a/examples/presentation-ai/img/gpt16a.png b/examples/presentation-ai/img/gpt16a.png new file mode 100644 index 0000000..bd9563a Binary files /dev/null and b/examples/presentation-ai/img/gpt16a.png differ diff --git a/examples/presentation-ai/img/gpt16b.png b/examples/presentation-ai/img/gpt16b.png new file mode 100644 index 0000000..5a8f1a9 Binary files /dev/null and b/examples/presentation-ai/img/gpt16b.png differ diff --git a/examples/presentation-ai/img/gpt16c.png b/examples/presentation-ai/img/gpt16c.png new file mode 100644 index 0000000..45bd05f Binary files /dev/null and b/examples/presentation-ai/img/gpt16c.png differ diff --git a/examples/presentation-ai/img/gpt17.png b/examples/presentation-ai/img/gpt17.png new file mode 100644 index 0000000..416d7b6 Binary files /dev/null and b/examples/presentation-ai/img/gpt17.png differ diff --git a/examples/presentation-ai/img/gpt17b.png b/examples/presentation-ai/img/gpt17b.png new file mode 100644 index 0000000..da91e7f Binary files /dev/null and b/examples/presentation-ai/img/gpt17b.png differ diff --git a/examples/presentation-ai/img/gpt17c.png b/examples/presentation-ai/img/gpt17c.png new file mode 100644 index 0000000..7df62fb Binary files /dev/null and b/examples/presentation-ai/img/gpt17c.png differ diff --git a/examples/presentation-ai/img/gpt17d.png b/examples/presentation-ai/img/gpt17d.png new file mode 100644 index 0000000..dc1b534 Binary files /dev/null and b/examples/presentation-ai/img/gpt17d.png differ diff --git a/examples/presentation-ai/img/gpt17e.png b/examples/presentation-ai/img/gpt17e.png new file mode 100644 index 0000000..071c36e Binary files /dev/null and b/examples/presentation-ai/img/gpt17e.png differ diff --git a/examples/presentation-ai/img/obrigado.jpg b/examples/presentation-ai/img/obrigado.jpg new file mode 100644 index 0000000..59293e6 Binary files /dev/null and b/examples/presentation-ai/img/obrigado.jpg differ diff --git a/examples/presentation-ai/img/paulo3.jpeg b/examples/presentation-ai/img/paulo3.jpeg new file mode 100644 index 0000000..fd689d8 Binary files /dev/null and b/examples/presentation-ai/img/paulo3.jpeg differ diff --git a/examples/presentation-ai/index.html b/examples/presentation-ai/index.html new file mode 100644 index 0000000..1435b81 --- /dev/null +++ b/examples/presentation-ai/index.html @@ -0,0 +1,1200 @@ +Inteligência Artificial e Chat-GPT
Inteligência Artificial e o Chat-GPT
+
Uma apresentação introdutória.
+
Paulo Roberto Martins Cunha
+
15 de junho de 2023
+
GFT Talks - Grupo de Filosofia Temática (GFT)
+
+
+
+

+
+
+

Paulo Roberto Martins Cunha

+
    +
  • Engenheiro Eletricista - UFPA (1992);
    • +
  • Bacharel em Direito - UFPA (2020);
    • +
  • Bacharelando em Filosofia - UFPA.
    • +
+

Interesses:

+
    +
  • Ética, Idealismo alemão, Filosofia da tecnologia.
    • +
+

Contatos:

+ +
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Agenda (Desejada)

+
+
+
    +
  1. +

    Raizes da ideia de uma inteligência artificial

    +
      +
    1. Mitologia, literatura, teatro, cinema.
      2. +
    +
    2. +
  2. +

    O que é Inteligência Artificial?

    +
      +
    1. O que é Computação?
      2. +
    2. Métodos de implementação de Inteligência Artificial.
      3. +
    +
    3. +
+
+
+
    +
  1. +

    O Sistema GPT-3

    +
      +
    1. O que é inteligência artificial generativa?
      2. +
    +
    2. +
  2. +

    Problematizações.

    +
      +
    1. Ética do uso acadêmico do GPT-3;
      2. +
    2. A questão dos empregos humanos ameaçados pela IA.
      3. +
    +
    3. +
+
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Parte 1:
Raízes da Ideia de uma
Inteligência Artificial

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

MITOLOGIA

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Mitologia - Grécia

+
+
+
    +
  • Talos - autômato criado por Hefestos, era um robô gigante de bronze presenteado por Zeus a Minos para guardar sua ilha.

    • +
  • Pandora - criatura de Hefestos a mando de Zeus, com o concurso de todos os deuses, para vingança contra a humanidade após Prometeu ter dado o segredo do fogo ao homem. Sua curiosidade a fez abrir o jarro de todos os males.
    • +
+
+
+
    +
  • Donzelas Douradas - também criadas por Hefestos como assistentes femininas, podiam antecipar e responder às necessidades de seu criador, com características humanas: consciência, inteligência, aprendi-zado, razão e fala.

    A criação de máquinas inteligentes e automatizadas tem motivação de economia de trabalho humano.
    • +
+
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

LITERATURA

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Literatura - Golem (Praga, séc. XIV)

+
    +
  • +

    Associado à tradição mistica do judaísmo (Cabala);

    +
    • +
  • +

    O Golem é um ser artificial (animado de matéria inanimada) e teria sido feito com a argila (silício) do rio Moldava que banha Praga, por um processo divino (programação);

    +
    • +
  • +

    O rabino (programador) construiu o Golem e, seguindo orações específicas (programação), fez com que ele ganhasse vida (inteli-gência artificial);

    +
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Literatura - Golem

+
    +
  • +

    recitando um hino especial (programação) em hebraico (linguagem de programação) e escrevendo na sua testa a palavra Emet (אמת), que em hebraico significa verdade.

    +
    • +
  • +

    O Golem deveria obedecer ao rabino (programação ética), ajudando e protegendo (programação) o gueto judaico dos ataques anti-semitas;

    +
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Literatura - Golem

+
    +
  • Porém, o Golem cresceu e se tornou violento e começou a matar pessoas espalhando o medo (erro de programação-treino).
    • +
  • O rabino concordou em destruir o Golem apagando a primeira letra da palavra Emet que formaria a palavra Met que significa "morto" em hebraico (mecanismo de segurança).
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Literatura - Frankenstein (1818)

+
    +
  • Mary Shelley - "Frankenstein ou o Prometeu Moderno"
    • +
  • Considerada a primeira obra de Ficção Científica;
    • +
  • Victor von Frankenstein era o criador, não a criatura;

    • +
  • Avaliação: 🌟🌟🌟🌟🌟
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

TEATRO

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

R.U.R.

1920

+
Rossum's Universal Robots (Robôs Universais de Rossum) é uma peça teatral de ficção científica escrita pelo tcheco Karel Čapek - Praga, Tchecoslo-váquia.
+
.
+
+
+

R.U.R.

+ +

A palavra robô, do tcheco robota (trabalho forçado), foi mencionada pela primeira vez na peça. O nome Rossum é uma alusão à palavra checa rozum, que significa razão.

+
.
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+ + +

Resta apenas um último homem vivo com a tarefa, imposta pelos robôs, de de criar uma formula para aumentar seu tempo máximo de vida, que era de 20 anos.

+
.
+
+
+

CINEMA

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

O Golem

+

1920

+
+


Cena do filme "O Golem - Como veio ao mundo" (Der Golem, wie er in die Welt kam), do diretor Paul Wegener. Alemanha.

+
+
.
+
+
+

Cinema - Metropolis (1927)

+
    +
  • A desumanização do ser humano pelas máquinas;

    • +
  • Avaliação: 🌟🌟🌟🌟🌟
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Cinema - 2001 Uma Odisseia no Espaço (1968)

+
    +
  • HAL 9000;
    • +
  • Quais os perigos de uma inteligência não humana tomando decisões autônomas?

    • +
  • Avaliação: 🌟🌟🌟🌟🌟
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Cinema - Blade Runner (1982)

+ +
    +
  • Philip K. Dick - Ridley Scott.
    • +
  • Replicantes: organismos biológicos artificiais.
    • +
  • Existe necessidade uma ética no trato com criaturas artificiais?

    • +
  • Avaliação: 🌟🌟🌟🌟🌟(🌟)
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Cinema - O Exterminador do Futuro (1984)

+
    +
  • A Skynet como metáfora dos riscos à sobrevivência da humanidade em presença de uma inteligência artifical autônoma.

    • +
  • Avaliação: 🌟🌟🌟
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Parte 2:
O que é Inteligência Artificial?

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

O que é computação?

+
    +
  • +

    Computar, originalmente, significava calcular.

    +
    • +
  • +

    Computação é a formalização do conceito que descreve a execução de etapas finitas para realização de um cálculo.

    +
    • +
  • +

    Calcular é um processo passível de mecanização!
    Ou seja, pode ser automatizável ou com o auxílio
    de máquinas (mecânicas, eletrônicas, quanticas, etc.) .

    +
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Computação Inteligência ?

+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Computação Inteligência?

+
+
+

Cálcular refere-se à manipulação ordenada de símbolos em geral (números, letras, etc.), em uma sequência finita bem definida, em busca de um resultado esperado;

+
+
+

Exemplos:

+
    +
  • +

    +
    • +
  • +

    +
    • +
  • +

    +
    • +
  • +

    +
    • +
  • +

    +
    • +
+
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Computação Inteligência?

+
+
+

Cálcular refere-se à manipulação ordenada de símbolos em geral (números, letras, etc.), em uma sequência finita bem definida, em busca de um resultado esperado;

+
+
+

Calculando:

+
    +
  • +

    +
    • +
  • +

    +
    • +
  • +

    +
    • +
  • +


    +
    • +
  • +


    (and)

    +
    • +
+
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Computação Inteligência?

+
+
+

PERGUNTA: A capacidade de realizar cálculos é uma definição do que seja inteligência?

+

+
+
+

Exemplos:

+
    +
  • +

    +
    • +
  • +

    +
    • +
  • +

    +
    • +
  • +


    +
    • +
  • +


    (and)

    +
    • +
+
+
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Computação Inteligência?

+
    +
  • +

    O ato de calcular em si não é necessariamente um indicador de inteligência.

    +
    • +
  • +

    O cálculo é uma habilidade específica, também relacionada à matemática, que pode ser aprendido e realizado através de métodos e algoritmos pré-estabelecidos.

    +
    • +
  • +

    No homem, o calcular é sim uma forma de pensar. Na máquina é a expressão do automatismo com que foi criada pela inteligência humana.

    +
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+

Computação Inteligência?

+
    +
  • +

    Cálculo pode ser visto como uma forma específica de pensamento relacionada à matemática,

    +
    • +
  • +

    É importante lembrar que o pensamento humano abrange uma ampla gama de atividades cognitivas, como: raciocínio lógico, resolução de problemas, tomada de decisões, criatividade, memória e compreensão.

    +
    • +
  • +

    O cálculo é apenas uma faceta desse processo mais amplo de pensamento humano.

    +
    • +
+
GFT Talks: Inteligência Artificial e o GPT-3
+
+
+














+

+
.
+
+
+

O que é Inteligência Artificial?

+
.
+
+
+

O que é "Inteligência Artificial"?

+

A "Inteligência Artificial" é um ramo de pesquisas dentro da computação, cujo objetivo é criar serviços, plataformas, programas e robôs que possam imitar, se igualar ou substituir decisões e ações equivalente à inteligência humana (natural).

+
.
+
+
+
+

Inteligência Artificial

+
    +
  1. +

    habilidades
    UMA por vez

    +
    2. +
  2. +

    melhor em
    AUTOMAÇÃO

    +
    3. +
  3. +

    melhor em análise por
    VOLUME

    +
    4. +
  4. +

    processamento
    VELOCIDADE

    +
    5. +
  5. +

    natureza
    RAZÃO

    +
    6. +
+
+
+

Inteligência Humana

+
    +
  1. +

    habilidades
    MÚLTIPLAS simultâneas

    +
    2. +
  2. +

    melhor em
    AUTONOMIA

    +
    3. +
  3. +

    melhor em análise de
    AMBIGUIDADES

    +
    4. +
  4. +

    processamento
    PENSAMENTO CRÍTICO

    +
    5. +
  5. +

    natureza
    EMOÇÃO

    +
    6. +
+
+
+
.
+
+
+

"Inteligência" Artificial

+
    +
  • +

    O termo inteligência deve ser pensado como um atributo da criatura (computador) ou do seu criador?

    +
    • +
  • +

    A "Inteligência" Artificial é uma imitação da Inteligência Humana.

    +
    • +
  • +

    Faz parte dos processos humanos a projeção de sua humanidade em seres e coisas.

    +
    • +
+
+

As máquinas podem pensar?

+
+
.
+
+
+
+

Já descrito como o "robô humanoide mais avançado do mundo",

+

Ameca é uma criação da startup Engineered Arts.

+
+
+
+
+
+
+
.
+
+
.
+
+
.
+
+
.
+
+
.
+
+
.
+
+
.
+
+
+

OpenAI GPT-3

+
.
+
+
+

OpenAI GPT-3

+
+
+
    +
  • +

    Público em novembro de 2022;

    +
    • +
  • +

    GPT-3 incorpora mais conhecimento do que qualquer ser humano jamais conheceu;

    +
    • +
  • +

    Ele pode gerar músicas, poemas e ensaios sobre os mais diversos temas;

    +
    • +
+
+
+
    +
  • +

    Aprovado em exames para ingresso em carreiras de direito e medicina nos EUA.

    +
    • +
  • +

    GPT-3 é um tipo de IA generativo chamado modelo de linguagem ampla (Large Language Model).

    +
    • +
+
+
+
+

GPT é Processamento de Linguagem Natural

+
+
.
+
+
+

OpenAI GPT-3

+
+
+
    +
  • Capacidades atuais dessa AI iniciam em 2010 com as técnicas de "Deep Learning";
    • +
  • Derivam da disponibilidade de colossais conjuntos de dados e disponibilidade de vasta capacidade computacional via Unidades de Processamento Gráfico (GPUs);
    • +
+
+
+
    +
  • Melhorou a capacidade da IA de reconhecer imagens, processar audio e aprender jogos.
    • +
  • Aberta ao público, o GPT-3 apresentou melhorias assustadora em atividades antes exclusivas do domínio da inteligência humana.
    • +
  • Na verdade, LLM é um gigantesco exercício de estatística.
    • +
+
+
+
.
+
+
+

GPT-3

+

Como funciona?
(linhas gerais)

+
.
+
+
+

1º passo: Tokenização

+
+
+
    +
  • Converte PALAVRAS em um conjunto representativo de NÚMEROS identificados e categorizadas como TOKENS;

    • +
  • GPT-3 tem um dicionário de 50.257 tokens;
    • +
  • O GPT-3 processa no máximo 2.048 tokens por vez (pequeno artigo).
    • +
  • GPT-4 é capaz de processar
    32.000 tokens (uma novela).
    • +
+
+
+

Uma frase escrita para que o ChatGPT a complete:

+

Ex.:

+

The promise of large language models is that they _

+

será transformada em um conjunto de números.

+
+
+
.
+
+
+

Tokenização

+
+

+

+
+
.
+
+
+

2º passo: Contextualização

+
    +
  • +

    Os TOKENS recebem o equivalente a DEFINIÇÕES;

    +
    • +
  • +

    São colocando-os em um "espaço de significado";

    +
    • +
  • +

    Palavras com significados semelhantes estão localizadas em áreas próximas.

    +
    • +
+
.
+
+
+

Contextualização

+

+

+
.
+
+
+

Contextualização

+

+

+
.
+
+
+

3º passo: Aplicação da “Attention Network”

+
+
+
    +
  • A rede de atenção codifica lentamente a estrutura da linguagem que vê como números (chamados de "pesos");
    +
    • +
  • Um ser humano letrado realiza essa associação e compreende "naturalmente" a relação entre as palavras;
    • +
+
+
+
    +
  • O LLM precisa aprender essas associações durante sua fase de treinamento;
    +
    • +
  • São bilhões de interações de treinamento para codificar a estrutura da linguagem ("weights") - na rede neuronal!
    • +
+
+
+
.
+
+
+
+
.
+
+
+
+
.
+
+
+
+
.
+
+
+
+
.
+
+
+


+

+

+
.
+
+
+
+
.
+
+
+
    +
  • Embora seja possível escrever as regras de como eles funcionam, os resultados dos LLMS não são totalmente previsíveis;
    • +
  • Os LLMs conseguem sínteses de maneiras que surpreendem até mesmo as pessoas que os criam.
    • +
  • Jason Wei, pesquisador da Openai, contabilizou 137 das chamadas habilidades "emergentes" em uma variedade de LLMs diferentes.
    • +
+
.
+
+
+

Redes Neurais

+

Uma Visão Geral

+
.
+
+
+

Modelo de um neurônio orgânica (natural)

+
.
+
+
+

Modelo de um neurônio orgânico (natural)

+
.
+
+
+

Nos cérebro, existem cerca de 100 bilhões de neurônios interconectados entre si, formando uma espécie de rede neuronal.

+
.
+
+
.
+
+
.
+
+
.
+
+
+

Este é um modelo abstrato de uma rede neuronal que pode ser implementada por meio de um programa de computador.

+
.
+
+
+

LLM e Redes Neurais

+
    +
  • +

    Um exemplo de Rede Neural (ou neuronal) como modelo baseado em neurônios e no cérebro humano.

    +
    • +
  • +

    Esta rede prevê chuva (probabilidade) com base temperatura e umidade.

    +
    • +
+
+
    +
  1. Large Language Models: modelos de redes neuronais baseados em "deep learning".
    2. +
+
+
.
+
+
+

LLM e Redes Neurais

+

Esta é a rede anterior, mais complexa e mais precisa em predizer a probabilidade de chuva

+
.
+
+
+

+ +

+
+
+
+
+
+
+
.
+
+
+

Interações com o Chat-GP

+

Limitações da v.3

+
.
+
+
+

1. Algumas limitações

+
+

+
+
.
+
+
+

2. Falta de conhecimento atualizado

+
    +
  • +

    Treinamento concluído em setembro de 2021. A base de conhecimento está atualizada até essa data.

    +
    • +
  • +

    Não possui informações sobre eventos recentes ou desenvolvimentos que ocorreram após esse período.

    +
    • +
+
.
+
+
+

3. Sensibilidade ao contexto

+
    +
  • +

    Embora consiga compreender o contexto em uma determinada conversa ou texto, às vezes pode perder o contexto específico de uma pergunta anterior, o que pode levar a respostas incorretas ou fora de contexto.

    +
    • +
+
.
+
+
+

4. Propensão à oferecer respostas incorretas

+
    +
  • +

    Não possui capacidade de verificação ou validação externa. Portanto, pode gerar respostas que parecem plausíveis, mas que podem não ser necessariamente precisas ou corretas.

    +
    • +
+
.
+
+
+

5. Dificuldades com perguntas amplas ou vagas

+
    +
  • +

    Quando as perguntas são muito amplas, vagas ou mal formuladas, o GPT-3 pode ter dificuldade em fornecer uma resposta útil. Perguntas mais específicas e bem definidas geralmente produzem resultados melhores.

    +
    • +
+
.
+
+
+

6. Risco de vieses e informações incorretas

+
    +
  • +

    O treinamento do GPT-3 é baseado em grandes conjuntos de dados da internet, o que pode incluir informações enviesadas ou incorretas.

    +
    • +
  • +

    Embora tenham sido feitos esforços para minimizar esses problemas, eles ainda podem estar presentes nas respostas fornecidas.

    +
    • +
+
.
+
+
+

Interações com o GPT-3

+

Lógica

+
.
+
+
+

1. Primeira Pergunta (O que é modus ponens?)

+
+

+
+
.
+
+
+

2. Pergunta sobre o tema (resposta correta)

+
+

+
+
.
+
+
+

3. Segunda pergunta (resposta equivocada)

+
+

+
+
.
+
+
+

4. Provocação (pista sobre o que se quer)

+
+

+
+
.
+
+
+

5. Novamente (resposta correta)

+
+

+
+
.
+
+
+
+
+
+

😂

+
+
+

¡Correcto,
pero no
no mucho!

+
+
+
.
+
+
+

6. Terceira pergunta (Silogismo aristotélico)

+
+

+
+
.
+
+
+

Interações com o Chat-GP

+

Artigos acadêmicos

+
.
+
+
+

1. Artigos Acadêmicos

+
+

+
+
.
+
+
+

2. Artigos Acadêmicos

+
+

+
+
.
+
+
+

3. Artigos Acadêmicos

+
+

+
+
.
+
+
+

4. Artigos Acadêmicos

+
+

+
+
.
+
+
+

Interações com o GPT-3

+

Ética

+
.
+
+
+

1. Questões éticas - viés ("bias")

+
+

+
+
.
+
+
+

2. Questões éticas - escolhas

+
+

+
+
.
+
+
+

3. Questões éticas - ética contextual

+
+

+
+
.
+
+
+

4. Ética ou salvaguardas?

+
+

+
+
.
+
+
+

5. Questões éticas

+
+

+
+
.
+
+
+

Interações com o GPT-3

+

Peças Profissionais

+
.
+
+
+

1. Advocacia

+
    +
  • Peças processuais.
    • +
+
.
+
+
+
+
.
+
+
+

2. Educação

+
    +
  • Planos de aula.
    • +
+
.
+
+
+
+
.
+
+
+

Bibliografia sugerida para esta aula

+
.
+
+
+
+
.
+
+
+

Bibliografia em português

+
.
+
+
+
+
.
+
+
+

+
+
.
+
+
+

Para Pensar a Respeito

+

O que pode dar errado?

+
.
+
+
+

PROBLEMAS:

+
    +
  • As máquinas terão direitos algum dia?
    • +
  • As máquinas podem cometer crimes?
    • +
  • Elas são imputáveis pelos resultados de suas ações?
    • +
  • Quando as máquinas construirem outras máquinas, será reprodução?
    • +
+
.
+
+
+

PROBLEMAS:

+
    +
  • Perda de postos de trabalho;
    • +
  • Implicações legais do uso do Chat-GPT;
    • +
  • Autonomia das IAs;
    • +
  • O uso da IA para construir armas de destruição em massa;
    • +
  • O uso da IA para hackear sistemas de defesa de países;
    • +
  • Acesso público à IA.
    • +
+
.
+
+
+

A regulação é a solução ?

+
+
.
+
+
+

Salvaguardas - Isaac Asimov

+
    +
  • Primeira Lei: Um robô não pode causar mal a um ser humano ou, por inação, permitir que um ser humano sofra algum mal;
    • +
  • Segunda Lei: Um robô deve obedecer às ordens dadas por seres humanos, exceto nos casos em que tais ordens entrem em conflito com a Primeira Lei;
    • +
  • Terceira Lei: Um robô deve proteger sua própria existência, desde que tal proteção não entre em conflito com a Primeira ou a Segunda Lei.
    • +
+
.
+
+
+

+
+
.
+
+

----------------------------

----------------------------

----------------------------

----------------------------

![bg invert:100% opacity:.2](https://s.zst.com.br/cms-assets/2020/10/mitologia-grega-livros.jpg)

![bg invert:6100% opacity:.2](https://upload.wikimedia.org/wikipedia/commons/0/0b/Guido_Reni_-_L%27Aurora_di_Guido_Reni_nelle_arti_decorative.jpg)

----------------------------

----------------------------

![bg](https://qph.cf2.quoracdn.net/main-qimg-cb30ada2c967b52473de933ee68bf5cc-lq)

----------------------------

![bg invert:100% opacity:.2](https://s5.static.brasilescola.uol.com.br/be/2022/07/livros-antigos.jpg)

![bg invert:100% opacity:.2](https://ichef.bbci.co.uk/news/640/cpsprodpb/4EEC/production/_104140202_literature.jpg)

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

#### fit **Rossum's Universal Robots**

----------------------------

#### fit **Rossum's Universal Robots**

----------------------------

![bg invert:0% opacity:.125 sepia:1.0](https://s2.static.brasilescola.uol.com.br/be/2021/06/cinema.jpg)

![bg invert:90% opacity:.25 blur:3px sepia:1.0](https://telaviva.com.br/wp-content/uploads/2022/09/Cinema-e1672802229493.jpg)

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

1. Star Wars 2. AI 3. Eu ,Robô 4. Ex Machina

----------------------------

----------------------------

----------------------------

![bg](https://d1o6h00a1h5k7q.cloudfront.net/imagens/img_m/15336/7009673_5.jpg)

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

![bg](https://www.ibirapuera.br/wp-content/uploads/2018/06/alan-turing.jpg)

![bg](https://static.wixstatic.com/media/7d39a7_c933edfcd9064292aeb377862a4b4739~mv2.jpg/v1/fill/w_640,h_426,al_c,q_80,usm_0.66_1.00_0.01,enc_auto/7d39a7_c933edfcd9064292aeb377862a4b4739~mv2.jpg)

----------------------------

----------------------------

![bg left:33%](https://dplnews.com/wp-content/uploads/2019/05/dplnews_inteligencia_artificial_jb010519.jpg)

----------------------------

----------------------------

----------------------------

-------------------------------------------------------------------------------

-------------------------------------------------------------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

(https://www.researchgate.net/publication/329216193/figure/fig3/AS:697582816870406@1543328112943/Architecture-of-multilayer-artificial-neural-network-with-error-backpropagation.png)

----------------------------

----------------------------

----------------------------

-------------------------------------------------------------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

----------------------------

\ No newline at end of file diff --git a/examples/presentation-ai/main.png b/examples/presentation-ai/main.png new file mode 100644 index 0000000..11b24f5 Binary files /dev/null and b/examples/presentation-ai/main.png differ diff --git a/examples/presentation-ai/style/descartes.css b/examples/presentation-ai/style/descartes.css new file mode 100644 index 0000000..41c2450 --- /dev/null +++ b/examples/presentation-ai/style/descartes.css @@ -0,0 +1,91 @@ +/* @theme descartes */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 04.dez.2022 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: 'Fira Sans Light'; + font-weight: initial; + --italic-background-color : rgba(214, 25, 66, 0.144); + --italic-background-color : rgba(8, 140, 255, 0.236); + --italic-background-color : rgba(255, 16, 8, 0.075); + --italic-background-color : rgba(201, 255, 8, 0.753); + --italic-background-color : rgba(8, 226, 255, 0.521); + --italic-background-color : rgb(169, 255, 8); + background-color: rgb(238, 244, 237); +} + +h1 { + color:rgb(23, 86, 118); + color:rgb(11, 37, 69); + color:rgb(53, 80, 112); + color:rgb(53, 80, 112); + padding-bottom: 2mm; + margin-bottom: 12mm; +} + +p { + font-size: 26pt; + font-weight: 600; + color:rgba(78, 78, 80, 0.814) +} + +section.titlepage .title { + border-bottom: 1px solid orangered; +} + + +section.cite { + --strong-color : rgba(255, 5, 5, 0.795); +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} + +section strong { + color:rgb(141, 169, 196) ; + color:rgb(181, 101, 118) ; + color:rgb(229, 107, 111) ; + color:rgba(23, 86, 118) ; + color:rgb(0, 53, 199) ; + color:rgb(186, 50, 79) ; + color:rgb(179, 31, 63) ; + padding-left: 1px; + padding-right: 1px; + font-weight: 600; +} + +section.transition em{ + background-color: rgb(255, 166, 0) !important; +} + + +section.transition strong { + color: rgba(230, 250, 6, 0.905); + font-weight: 1000; + text-shadow: 2px 2px 10px rgb(101, 45, 3); +} + + +section.transition2 strong { + + color: rgb(10, 100, 235); + color: rgb(161, 240, 3); + +} \ No newline at end of file diff --git a/examples/presentation-ai/style/freud.css b/examples/presentation-ai/style/freud.css new file mode 100644 index 0000000..7a8765c --- /dev/null +++ b/examples/presentation-ai/style/freud.css @@ -0,0 +1,112 @@ +/* @theme freud */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 02.jan.2022 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: "Fira Sans Light"; + font-weight: initial; + + color: #6c6c6c; + color: #2b3446; + + background-color: #727d8b; + background-color: #f8b13d; + background-color: #435160; + background-color: #f5eee6; + background-color: #d9dee6; + background-color: #f4f4ed; + + --h1-color : #3d09ae; + --h1-color : #06858e; + + --border-color : #a0660387; + + --bold-color : rgb(21, 105, 201); + --bold-color : #0d2d58; + + --italic-color : rgb(38, 48, 71); + --italic-background-color : rgba(172, 215, 255, 0.713); + + /* --background-color : #fdf6e3; */ + --list-item-color : rgb(255, 212, 95); + --after-color : rgb(51, 48, 48); + + --table-font-color : black; + --table-header-color : rgb(0, 132, 255); + + --main-color : rgb(207, 77, 17); + --darker-color : #246; + --lighter-color : #080a0a; + --extra-back-color : rgb(42, 45, 53); + + --letter-spacing : 0.125px; + + --cool-list-color : rgb(255, 68, 0); + + --author-align : right; + +} + + +/* ------------------- TITLEPAGE -----------------------------*/ + +section.titlepage .title { + border-bottom: 1px solid orangered; +} + +section.titlepage .subtitle { + font-weight: 300; +} + + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} +section.titlepage h1 { + border-bottom: 1px solid orangered; +} + +section.titlepage h2 { + font-weight: 300; +} + +section.titlepage h3, +section.titlepage h4, +section.titlepage h5 { + text-align: right; +} + +/* -------------------- TRANSITION ---------------------------------*/ +section.transition { + --transitionpage-color: #1c103d; +} + +/* ------------------- CITE -----------------------------*/ +section.cite { + --background-color: #49454f; + --strong-color: rgb(182, 112, 27); +} + +section.cite p { + color: #fffbfe; +} + +section.cite strong { + color: #f87ca1; +} diff --git a/examples/presentation-ai/style/hegel.css b/examples/presentation-ai/style/hegel.css new file mode 100644 index 0000000..86e487f --- /dev/null +++ b/examples/presentation-ai/style/hegel.css @@ -0,0 +1,28 @@ +/* @theme hegel */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 30.dez.2021 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: ; + font-weight: initial; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} \ No newline at end of file diff --git a/examples/presentation-ai/style/heidegger.css b/examples/presentation-ai/style/heidegger.css new file mode 100644 index 0000000..82b6922 --- /dev/null +++ b/examples/presentation-ai/style/heidegger.css @@ -0,0 +1,148 @@ +/* @theme heidegger */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 30.dez.2021 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: "Fira Sans Light"; + /* font-family: Cochin, Georgia; */ + font-weight: initial; + + color: #030303; + + background-color : #f5eee6; + background-color : #d9dee6; + background-color : #727d8b; + background-color : #435160; + background-color : #dedfde; + background-color : #FFCC00; + background-color : #f7a600; + background-color : #f8b632; + background-color : #fbc30a; + + --h1-color : #33404d; + --h1-color : #a57825; + --h1-color : #386b2b; + --h1-color : #1f1e1c; + + + --border-color : #014385; + + --bold-color : rgb(247, 247, 248); + --bold-color : red; + + --italic-color : rgb(18, 19, 22); + --italic-background-color : rgba(211, 76, 13, 0.713); + + /* --background-color : #fdf6e3; */ + --list-item-color : rgb(255, 212, 95); + --after-color : rgb(201, 198, 198); + + --table-font-color : black; + --table-header-color : rgb(0, 132, 255); + + --main-color : rgb(207, 77, 17); + --darker-color : #246; + --lighter-color : #080a0a; + --extra-back-color : rgb(71, 69, 69); + + --letter-spacing : 0.125px; + + --cool-list-color : rgb(255, 68, 0); + + --author-align : right; + + +} + +:root h1 { + color: #d9dee6; + background-color: #080a0a; + padding-top: 10pt; + padding-left: 60pt; + + margin-left: -60pt; + margin-right: -60pt; +} + +:root h1 strong { + color: rgb(255, 52, 52); +} + +/* ------------------- TITLEPAGE -----------------------------*/ + +section.titlepage .title strong { + color: rgb(255, 52, 52); +} + +section.titlepage .title { + border-bottom: 1px solid orangered; +} + + +section.titlepage .subtitle { + font-weight: 300; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} + +section.titlepage h1 { + border-bottom: 1px solid orangered; + color: #00254b; + background-color: initial; + + padding-top: 0pt; + padding-left: 0pt; + + margin-left: 0pt; + margin-right: 0pt; +} + +section.titlepage h2 { + font-weight: 300; +} + +section.titlepage h3, +section.titlepage h4, +section.titlepage h5 { + text-align: right; +} + +/* -------------------- TRANSITION ---------------------------------*/ +section.transition { + --transitionpage-color: #341e72; + --transitionpage-color: rgb(207, 24, 24); + font-weight: bold; + text-shadow: 4px 4px 0 rgb(53, 38, 38); +} + +/* ------------------- CITE -----------------------------*/ +section.cite { + --background-color: #49454f; + --strong-color: rgb(182, 112, 27); +} + +section.cite p { + color: #fffbfe; +} + +section.cite strong { + color: #f87ca1; +} diff --git a/examples/presentation-ai/style/husserl.css b/examples/presentation-ai/style/husserl.css new file mode 100644 index 0000000..2579b7e --- /dev/null +++ b/examples/presentation-ai/style/husserl.css @@ -0,0 +1,135 @@ +/* @theme husserl */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 08.nov.2022 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: 'Fira Sans Light'; + font-weight: initial; + --italic-background-color : rgba(8, 206, 255, 0.3); + --italic-background-color : rgba(214, 25, 66, 0.144); + --italic-background-color : rgba(122, 191, 252, 0.839); + --italic-background-color : rgba(8, 140, 255, 0.236); + /* background-color: rgb(205, 203, 216); */ + background-color: rgb(219, 223, 227); +} + + +h1 { + font-family: 'Montserrat Alternates'; + font-family: 'Raleway'; + font-family: 'Fira Sans Light'; + font-family: 'Lora'; + + + font-weight: 600; + letter-spacing: -1.25px; + color:rgb(11, 37, 69); + color:rgb(23, 86, 118); + color:rgb(53, 80, 112); + padding-bottom: 2mm; + margin-bottom: 9mm; +} + +h2 { + font-family: 'Lora'; + font-family: 'Montserrat Alternates'; + font-family: 'Fira Sans Light'; + font-family: 'Raleway'; + + font-weight: 700; + letter-spacing: -1.25px; + color:rgb(11, 37, 69); + color:rgb(23, 86, 118); + color:rgb(53, 80, 112); + color:rgb(39, 89, 149); + padding-bottom: 2mm; + margin-bottom: 2mm; +} + +p { + font-family: 'Lora'; + font-size: 26pt; + font-size: 115%; + font-weight: 600; + color:rgba(78, 78, 80, 0.814); + color:rgba(0, 0, 0, 0.814); + letter-spacing: -0.75px; +} + +section strong { + color:rgb(141, 169, 196) ; + color:rgba(23, 86, 118) ; + color:rgb(229, 107, 111) ; + color:rgb(181, 101, 118) ; + color:rgb(186, 50, 79) ; + padding-left: 0.5px; + padding-right: 0.5px; + font-weight: 600; +} + +section.cite { + --strong-color : rgba(255, 5, 5, 0.795); +} + +section.cite p { + font-family: 'Lora'; + letter-spacing: -0.5px; + font-style: italic; +} + +section.titlepage .title, +section.titlepage h1 { + font-family: 'Lora'; + border-bottom: 1px solid orangered; + padding-right : 0px; + letter-spacing: -.85px; +} + +section.titlepage .subtitle, +section.titlepage h2 { + font-family: 'Lora'; + font-weight: 100; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + font-family: 'Lora'; + font-weight: 100; + text-align: left; +} + +section.titlepage h3, +section.titlepage h4, +section.titlepage h5 { + font-family: 'Lora'; + font-weight: 100; +} + +section.transition p { + font-family: 'Fira Sans Light'; + font-weight: 600; +} + +section.transition2 p { + font-family: 'Fira Sans Light'; + font-weight: 600; +} + +section.biblio { + background-color: rgb(26, 75, 113); +} diff --git a/examples/presentation-ai/style/jobs.css b/examples/presentation-ai/style/jobs.css new file mode 100644 index 0000000..e6c2ae1 --- /dev/null +++ b/examples/presentation-ai/style/jobs.css @@ -0,0 +1,182 @@ +/* @theme jobs */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 27.fev.2022 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + /* font-family: "Fira Sans Light"; */ + /* font-family: Cochin, Georgia; */ + /* font-family: 'Times New Roman', Times, serif; */ + + font-family: 'Tahoma'; + font-family: 'Open Sans'; + font-family: 'Segoe UI'; + font-weight: initial; + + /* -- Bodytext FONT color */ + color: #494545; + + /* -- Slides BACKGROUND color */ + background-color : white; + + /* -- BOLD font color */ + --bold-color : rgb(105, 120, 151); + --bold-color : rgb(71, 111, 184); + --bold-color : rgb(71, 107, 184); + + --italic-color : rgb(96, 89, 89); + --italic-background-color : rgba(142, 145, 146, 0.172); + + /* --background-color : #fdf6e3; */ + --list-item-color : rgb(255, 212, 95); + + --after-color : rgb(201, 198, 198); + + --table-font-color : black; + + --table-header-color : rgb(0, 132, 255); + + --border-color : #014385; + + --main-color : rgb(207, 77, 17); + + --darker-color : #246; + + --lighter-color : #080a0a; + + --extra-back-color : rgb(71, 69, 69); + + --letter-spacing : 0.125px; + + --cool-list-color : rgb(255, 68, 0); + + --author-align : right; +} + +:root h1 { + + /* background-color: #1098db2d; */ + + --border-color : rgb(209, 193, 193); + + color: #2b2c2e; + + font-weight: 600; + + padding-top: 10pt; + padding-left: 60pt; + + margin-left: -60pt; + margin-right: -60pt; + + letter-spacing: -0.5px; + +} + +:root h1 strong { + color: rgb(255, 52, 52); +} + +:root p { + font-size: 34px; + font-family: 'Open Sans'; + letter-spacing: -0.3px; +} +/* ------------------- TITLEPAGE -----------------------------*/ + +/* Titlepage made with */ +section.titlepage .title strong { + color: rgb(255, 52, 52); +} + +section.titlepage .title { + /* border-bottom: 1px solid rgb(179, 176, 176); */ + border-bottom: 1px solid rgb(29, 107, 209); + letter-spacing: -0.3px; +} + + + +section.titlepage .subtitle { + font-weight: 300; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} + + +/* Titlepage made with # */ +section.titlepage h1 { + + border-bottom: 1px solid rgb(179, 176, 176); + + /* color: #3878b8; */ + /* background-color: initial; */ + + padding-top: 0pt; + padding-left: 0pt; + + margin-left: 0pt; + margin-right: 0pt; +} + +section.titlepage h2 { + font-weight: 300; +} + +section.titlepage h3, +section.titlepage h4, +section.titlepage h5 { + text-align: right; +} + +/* -------------------- TRANSITION ---------------------------------*/ +section.transition { + + --transitionpage-color: rgb(23, 148, 197); + --transitionpage-color: rgb(129, 127, 127); + + + font-weight: bold; + /* font-size: 200%; */ + /* text-shadow: 4px 4px 0 rgb(77, 61, 61); */ +} + +/* ------------------- CITE -----------------------------*/ + +section.cite p { + color: #fffbfe; + font-size: 36px; + font-family: "Libre Baskerville", serif; + font-style: italic; + line-height: 140%; + +} + +section.cite { + + --background-color: rgb(92, 121, 163); + --strong-color: #c4ee0b; +} + +section.cite strong{ + + font-weight: 100; + +} diff --git a/examples/presentation-ai/style/kant.css b/examples/presentation-ai/style/kant.css new file mode 100644 index 0000000..5798d25 --- /dev/null +++ b/examples/presentation-ai/style/kant.css @@ -0,0 +1,28 @@ +/* @theme kant */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 30.dez.2021 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: 'Fira Sans Light'; + font-weight: initial; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} \ No newline at end of file diff --git a/examples/presentation-ai/style/leibniz.css b/examples/presentation-ai/style/leibniz.css new file mode 100644 index 0000000..cee2f19 --- /dev/null +++ b/examples/presentation-ai/style/leibniz.css @@ -0,0 +1,66 @@ +/* @theme leibniz */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 30.dez.2021 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + + +/***************** COMMON STRUCTURE **********************/ + +:root { + /* font-family: Georgia, Serif; */ + font-family: Cochin, Georgia, Times, 'Times New Roman'; + font-weight: initial; + --bold-color : blue; +} + +h1 { + color: var(--h1-color); + font-weight: var(--title-font-weight); + border-bottom: 1px solid var(--border-color); +} + +table { + font-family: sans-serif; + /* empty-cells: hide; */ +} + +section.titlepage { + + /* fonts sizes */ + --title-size : 150%; + --subtitle-size : 110%; + --author-size : 105%; + --date-size : 105%; + --institute-size : 90%; + + --letter-spacing : 0.125px; + + /* font weights */ + --title-font-weight : 300; + --subtitle-font-weight : 300; + +} + +section.biblio p { + color: var(--text-color); + font-size: 80%; + font-weight: 300; + padding-left: 5px; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} \ No newline at end of file diff --git a/examples/presentation-ai/style/orwell.css b/examples/presentation-ai/style/orwell.css new file mode 100644 index 0000000..18b9043 --- /dev/null +++ b/examples/presentation-ai/style/orwell.css @@ -0,0 +1,80 @@ +/* @theme orwell */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 12.mai.2022 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: 'Fira Sans Light'; + font-weight: initial; + color: #030303; + color: #070707d2; + +} + +h1 { + color: #012a53; + color: #00254b; + border-color: rgb(0, 140, 255); + border-color: orangered; + margin-bottom: 3.5%; + +} + +section.titlepage .title, .subtitle, .author, .date, .organization { + color: rgb(255, 255, 255) !important; + font-kerning: auto; + text-align: left !important; +} + +section.titlepage h1{ + border-color: orangered; +} + +section.titlepage strong{ + color: rgb(141, 194, 230); +} + +section strong { + color:rgb(209, 18, 18); + color:rgb(38, 44, 56); + color:rgb(255, 0, 0); + color:rgb(68, 86, 145); + color:rgb(90, 120, 216); + color:rgb(182, 98, 98); + color:rgb(223, 51, 39); +} + +section.transition a { + font-size: 19pt; + font-size: 170% !important; + font-weight: 900 !important; + font-kerning: auto; +} + +section.transition em { + + /* text-shadow: 6px 6px 0 rgb(207, 143, 4);*/ + +} +section.transition strong { + + /* text-shadow: 6px 6px 0 rgb(207, 143, 4);*/ + color: yellow; /*rgb(247, 76, 9);*/ + font-size: 110% !important; + font-weight: 900 !important; + /* text-shadow: 4px 4px 0 rgb(51, 50, 49);*/ + +} diff --git a/examples/presentation-ai/style/plato.css b/examples/presentation-ai/style/plato.css new file mode 100644 index 0000000..bcac123 --- /dev/null +++ b/examples/presentation-ai/style/plato.css @@ -0,0 +1,54 @@ +/* @theme plato */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 30.dez.2021 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: 'Fira Sans Light'; + font-weight: initial; + --italic-background-color : rgba(214, 25, 66, 0.144); + --italic-background-color : rgba(255, 86, 8, 0.185); + +} + +section.titlepage .title { + border-bottom: 1px solid orangered; +} + +section.cite { + --strong-color : rgba(255, 5, 5, 0.795); +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} + +section strong { + color:rgba(5, 51, 255, 0.534) ; + color:rgba(5, 43, 255, 0.979) ; + padding-left: 2px; + padding-right: 2px; + font-weight: 600; +} + +section.transition2 strong { + + color: rgb(10, 100, 235); + color: rgb(161, 240, 3); + +} diff --git a/examples/presentation-ai/style/schema.css b/examples/presentation-ai/style/schema.css new file mode 100644 index 0000000..cacce6e --- /dev/null +++ b/examples/presentation-ai/style/schema.css @@ -0,0 +1,87 @@ +/* @theme schema */ + +/* Last update: 30.dez.2021 */ + +/* -------------------- ROOT ----------------------------------*/ +:root { + + --h1-color : black; + --border-color : #e99211; + --bold-color : orangered; + --italic-color : black; + --italic-background-color : rgba(255, 210, 8, 0.713); + + + --background-color : #fdf6e3; + --list-item-color : rgb(50, 56, 56); + --after-color : rgb(255, 39, 1); + + --table-header-color : rgb(0, 132, 255); + + --main-color : rgb(207, 77, 17); + --darker-color : #246; + --lighter-color : #080a0a; + --extra-back-color : rgb(175, 172, 173); + + --letter-spacing : 0.125px; + + --cool-list-color : orangered; + + --author-align : right; + +} + +/* -------------------- TRANSITION ---------------------------------*/ +section.transition { + --transitionpage-color : orangered; +} + +/* -------------------- BIBLIO -------------------------------*/ +section.biblio { + --text-color : white; + --background-color : rgb(11, 50, 175); + --border-color : darkorange; + --bold-color : orange; +} + +/* ------------------- TITLEPAGE -----------------------------*/ +section.titlepage { + + /* fonts sizes */ + --title-size : 150%; + --subtitle-size : 110%; + --author-size : 110%; + --date-size : 110%; + --institute-size : 90%; + + --letter-spacing : 0.125px; + + /* font weights */ + --title-font-weight : 600; + --subtitle-font-weight : 600; + + /* colors in style */ + --title-color : #ee0d0d; + --title-color : #4d7baf; + --title-color : #0a67f1; + --title-color : #002b36; + + --subtitle-color : #586e75; + --subtitle-color : #93a1a1; + + --titlepage-color : #242d31; + --background-color : #faf7f7; + + --border-color : #f0cf9e; + --border-color : #b5c9ee; + --border-color : #8aa6da; + --border-color : #6c71c4; + --border-color : #e99211; + +} + +/* ------------------- CITE -----------------------------*/ +section.cite { + --background-color : #fdf6e3;; + --strong-color : rgb(182, 112, 27); +} diff --git a/examples/presentation-ai/style/simple.css b/examples/presentation-ai/style/simple.css new file mode 100644 index 0000000..1f46b56 --- /dev/null +++ b/examples/presentation-ai/style/simple.css @@ -0,0 +1,59 @@ +/* @theme simple */ + +@import "default"; + +/* Add "Page" prefix and total page number */ +section::after { + content: "pág. " attr(data-marpit-pagination) " / " attr(data-marpit-pagination-total); + color: rgba(207, 201, 201, 0.952); + + } + +section p { + margin-bottom: 0.6em; + line-height: 1.2em; +} + +section li { + margin-top: 0.6em; + margin-bottom: 0.6em; + line-height: 1.2em; + font-size:100%; + color: rgba(128, 128, 128, 0.959); +} + +h1 { + text-align: center; + color: darkslateblue; + +} + +.columns { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1rem; + justify-content: center !important; +} + + +/******************* lead *****************************/ + +/* lead class: first slide in a section. Use h1 as header. +Use: */ +section.lead { + background-color: orangered; + text-align: center; + color: white; + padding-top: auto; + padding-buttom: auto; +} +section.lead h1, section.lead h2, section.lead p, section.lead a { + color: white; + font-size: 200% +} +section.lead footer, section.lead header, section.lead:after { + /* hide header, footer and pagination */ + display: none; +} + + diff --git a/examples/presentation-ai/style/socrates.css b/examples/presentation-ai/style/socrates.css new file mode 100644 index 0000000..4f88ff6 --- /dev/null +++ b/examples/presentation-ai/style/socrates.css @@ -0,0 +1,75 @@ +/* @theme socrates */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.0 + last update: 30.dez.2021 + ============================================ +*/ + +/* Importing COLOR SCHEMA */ + +@import "default"; +@import "schema"; +@import "structure"; + +/***************** COMMON STRUCTURE **********************/ + +:root { + font-family: "Lato"; + font-weight: initial; + --cool-list-color : rgb(168, 12, 85); + +} + +/* ------------------- TITLEPAGE -----------------------------*/ +section.titlepage { + --title-color : #1d395a; +} + +section.titlepage .title { + border-bottom: 0px solid var(--border-color); +} + +section.titlepage .subtitle { + font-weight: 300; +} + +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + text-align: left; +} +section.titlepage h1 { + border-bottom: 0px solid var(--border-color); +} + +section.titlepage h2 { + font-weight: 300; +} + +section.titlepage h3, +section.titlepage h4, +section.titlepage h5 { + text-align: right; +} + +/* -------------------- TRANSITION ---------------------------------*/ +section.transition { + --transitionpage-color : #6750a4; +} + +/* ------------------- CITE -----------------------------*/ +section.cite { + --background-color : #49454f; + --strong-color : rgb(182, 112, 27); +} + +section.cite p { + color: #fffbfe; +} + +section.cite strong { + color: #f87ca1; +} \ No newline at end of file diff --git a/examples/presentation-ai/style/structure.css b/examples/presentation-ai/style/structure.css new file mode 100644 index 0000000..75adc9a --- /dev/null +++ b/examples/presentation-ai/style/structure.css @@ -0,0 +1,656 @@ +/* @theme structure */ + +/* + ============================================ + Created by Paulo Cunha + version: 1.7 + last update: 12.mai.2022 + update: 30.dez.2021 + ============================================ + + You may use freely (MIT license) provided + due credits are granted to the authors. + + CLASSES: + + + + + + + + + + + + + + + Credits: https://catalin.red/css3-ordered-list-styles/ + for cool-list anda cool-list2. + +*/ + +/***************** COMMON STRUCTURE **********************/ + +h1 { + color: var(--h1-color); + border-bottom: 1px solid var(--border-color); +} + +section p { + margin-top: 0.5em; + margin-bottom: 0.25em; + line-height: 1.3em; + font-size: 32px; +} + +section li { + margin-top: 0.5em; + margin-bottom: 0.25em; + line-height: 1.2em; + font-size: 105%; + color: val(--list-item-color); +} + +/* Definition for emphasis */ +section em { + color: var(--italic-color); + background: var(--italic-background-color); + font-style: normal; + font-weight: bold; + font-family: sans-serif; + padding-top: 6px; + padding-left: 6px; + padding-right: 6px; + padding-bottom: 6px; +} + +/* Definition for bold text */ +section strong { + color: var(--bold-color); + padding-left: 5px; + padding-right: 5px; + font-weight: 600; +} + +/* May append some string to page number */ +/* Uses format "page-number / total pages" */ + +section::after { + color: rgb(51, 59, 77); + font-size: 0.8em; + content: " " attr(data-marpit-pagination) "/" + attr(data-marpit-pagination-total) " "; +} + +.center { + text-align: center; +} + +.right { + text-align: right; +} + +.small { + font-size: 24px; +} + +/* + Tables are always centered. + Credits: Juan Vera del Campo + Loco: https://github.com/Juanvvc + +*/ +section table { + margin-right: auto; + margin-left: auto; + margin-top: 20px; + width: auto; + border: 0; +} +section table th { + background-color: var(--table-header-color); + color: white; + border: 0; + border-top: rgb(253, 74, 3) solid 2px; + border-top: rgb(255, 0, 0) solid 2px; +} +section table td { + border: 0; +} +section table tr:nth-child(2) { + background-color: #dedede; +} +section table tr:last-child { + border-bottom: rgb(253, 74, 3) solid 2px; +} + +tr:nth-child(even) { + background-color: #e8edf1 !important; +} +tr:hover { + color: rgb(36, 34, 34); + background-color: rgb(255,204,0); + font-weight: bold; +} + +/* + Block quote: used for footnote + substitution. Use as the last + element of a slide. +*/ +section blockquote { + color: rgb(66, 66, 66); + font-size: 20px; + border-top: 0.1em dashed var(--extra-back-color); + margin-top: auto; +} + +section blockquote strong { + color: rgb(68, 104, 151); + font-weight: bold; + font-size: 1.13em !important; +} + +section blockquote p { + font-size: 1.13em !important; +} +/* + Adds two-columns class +*/ +.columns { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1rem; + /* justify-content: center !important; */ +} + + +/************************* columns-center *****************************/ +/* +/* + Adds two-columns with centered contens class +*/ +.columns-center { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 1rem; + justify-items: center; + justify-content: center; + align-items: center; +} + + +/************************* columns3 *****************************/ +/* + Adds three-columns class +*/ +.columns3 { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1rem; + /* justify-content: center !important; */ +} + + + +/******************** columns3-center ***************************/ +/* +/* + Adds three-columns with centered contens class +*/ +.columns3-center { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 1rem; + justify-items: center; + justify-content: center; + align-items: center; +} + + +/******************* titlepage *************************/ +/* + Title Page Class: first slide in a deck. + + Use: + + + + # TTILE + ## SUBTITLE + ### AUTHOR + #### DATE + ##### INSTITUTION +*/ + +section.titlepage { + background-color: var(--background-color); +} + +/* + Titlepage informations +*/ +section.titlepage .title { + font-size: var(--title-size); + font-weight: var(--title-font-weight); + color: var(--title-color); + border-bottom: 1px solid var(--border-color); + line-height: 1.25; + padding-bottom: 15px; + padding-right: 10%; +} +section.titlepage .subtitle { + font-size: var(--subtitle-size); + font-weight: var(--subtitle-font-weight); + line-height: 1.2; + color: var(--subtitle-color); + padding-top: 10px; + padding-bottom: 120px; + letter-spacing: var(--letter-spacing); +} +section.titlepage .author { + font-size: var(--author-size); +} +section.titlepage .date { + font-size: var(--date-size); +} +section.titlepage .organization { + font-size: var(--institute-size); +} +section.titlepage .author, +section.titlepage .date, +section.titlepage .organization { + font-weight: 400; + text-align: right; + color: var(--titlepage-color); + line-height: 1.25; +} +section.titlepage h3, +section.titlepage h4, +section.titlepage h5 { + font-weight: 400; + text-align: right; + color: var(--titlepage-color); + line-height: 0; + letter-spacing: var(--letter-spacing); +} + +section.titlepage h1 { + font-size: var(--title-size); + font-weight: var(--title-font-weight); + text-align: left; + color: var(--title-color); + border-bottom: 1px solid var(--border-color); + line-height: 1.25; + padding-right: 20%; +} +section.titlepage h2 { + font-size: var(--subtitle-size); + font-weight: var(--subtitle-font-weight); + text-align: left; + color: var(--subtitle-color); + letter-spacing: var(--letter-spacing); + line-height: 1.2; + margin-top: -0.2em; + padding-bottom: 95px; +} +section.titlepage h3 { + font-size: var(--author-size); +} +section.titlepage h4 { + font-size: var(--date-size); +} +section.titlepage h5 { + font-size: var(--institute-size); +} + +/* Omits page number in Title Page Slide */ +section.titlepage footer, +section.titlepage header, +section.titlepage:after { + /* hide header, footer and pagination */ + display: none; +} + +/************************* transition *****************************/ +/* + transition class: first slide in a section. Use h1 as header. + Use: + + + + # Header + +*/ +section.transition { + background-color: var(--transitionpage-color); + text-align: center !important; + font-weight: bold !important; + color: white; + padding-top: auto; + padding-buttom: auto; +} +section.transition h1, +section.transition h2, +section.transition p, +section.transition a { + color: rgb(243, 229, 212); + font-size: 200%; + border-bottom: none; +} +section.transition footer, +section.transition header, +section.transition:after { + /* hide header, footer and pagination */ + display: none; +} + +/************************* transition *****************************/ +/* + transition class: first slide in a section. Use h1 as header. + Use: + + + + # Header + +*/ +section.transition2 { + background-color: rgb(137, 173, 207); + text-align: center !important; + font-weight: bold !important; + color: white; + padding-top: auto; + padding-buttom: auto; +} +section.transition2 h1, +section.transition2 h2, +section.transition2 p, +section.transition2 a { + color: rgb(217, 235, 247); + font-size: 200%; + border-bottom: none; +} + +section.transition2 em { + background-color: rgb(60, 255, 0) !important; +} + +section.transition2 footer, +section.transition2 header, +section.transition2:after { + /* hide header, footer and pagination */ + display: none; +} + +/************************* CITE *****************************/ +/* + cite class: slide containg a citation + + Use: + + + + Text + +*/ +section.cite { + background-color: var(--background-color); +} + +section.cite p { + color: black; + background-color: ; + letter-spacing: var(--letter-spacing); + font-size: 150%; + text-align: center; + line-height: 1.2em; + font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif; + /* font-style: oblique; */ + padding-top: auto; + padding-bottom: auto; + padding-left: 100px; + padding-right: 100px; +} + +section.cite strong { + color: var(--strong-color); +} + +/* Omits page number in Title Page Slide */ +section.cite footer, +section.cite header, +section.cite:after { + /* hide header, footer and pagination */ + display: none; +} + +/************************* biblio *****************************/ +/* + slides containg bibliography + Use: + + + # References + + 1. Item one + 2. Item two + +*/ + +section.biblio { + background-color: var(--background-color); +} + +section.biblio p { + color: var(--text-color); + font-size: 80%; + font-weight: 300; + padding-left: 5px; +} +section.biblio h1 { + font-size: 35px; + color: var(--text-color); + border-bottom: 1px solid var(--border-color); +} +section.biblio strong { + color: var(--bold-color); +} +section.biblio a { + font-size: 31px; + font-weight: bold; + color: var(--bold-color); +} +section.biblio li { + color: var(--text-color); +} +section.biblio footer, +section.biblio header, +section.biblio:after { + /* hide header, footer and pagination */ + display: none; +} + +/******************* cool-list *****************************/ +/* + + Credits: https://catalin.red/css3-ordered-list-styles/ + + Use: + + + + 1. *Item One* + 1. *Item two* + 1. *Item two.one* + 1. *Item two.two* + 1. *Item two.three* + 1. *Item Three* + +*/ + +section.cool-list ol { + counter-reset: li; /* Initiate a counter */ + list-style: none; /* Remove default numbering */ + padding: 0; + /*text-shadow: 0 1px 0 rgba(255,255,255,.5);*/ +} +section.cool-list li { + margin-bottom: 0.1em !important; + margin-top: 0.1em !important; +} +section.cool-list ol > li > em, +section.cool-list > ol > li > a { + position: relative; + display: block; + padding: 0.4em 0.4em 0.4em 2em; + margin: 0.5em 0; + background: #ddd; + color: #444; + text-decoration: none; + border-radius: 0.3em; + transition: all 0.3s ease-out; + font-style: normal; +} +section.cool-list ol > li > em:before, +section.cool-list > ol > li > a:before { + content: counter(li); + counter-increment: li; + position: absolute; + left: -1.3em; + top: 50%; + margin-top: -1.3em; + background: var(--cool-list-color); + height: 2em; + width: 2em; + line-height: 2em; + border: 0.3em solid #fff; + text-align: center; + font-weight: normal; + border-radius: 2em; + transition: all 0.3s ease-out; + color: white; +} +section.cool-list > ol > li > em:hover, +section.cool-list > ol > li > a:hover { + background: #eee; + font-weight: bolder; +} +/* Rotating effect */ +/* +section.cool-list ol > li > em:hover:before,section.cool-list ol > li > a:hover:before{ + transform: rotate(360deg); +}*/ +/* Lists inside lists */ +section.cool-list > ol ol { + margin: 0 0 0 2em; /* Add some left margin for inner lists */ + font-size: 75%; + counter-reset: li2; /* Initiate a counter */ +} +section.cool-list > ol ol > li > em:before, +section.cool-list > ol ol > li > a:before { + content: counter(li2); + counter-increment: li2; +} +section.cool-list > ol > li > ul { + list-style-type: disc; + margin: 0 0 0 1em; + font-size: 75%; +} +section.cool-list > ol ol > li > em { + background: #efefef; +} + +/******************* cool-list2 *****************************/ +/* + + Credits: https://catalin.red/css3-ordered-list-styles/ + + Use: + + + + 1. *Item One* + 1. *Item two* + 1. *Item two.one* + 1. *Item two.two* + 1. *Item two.three* + 1. *Item Three* + +*/ + +section.cool-list2 ol { + counter-reset: li; /* Initiate a counter */ + list-style: none; /* Remove default numbering */ + padding: 0; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); +} +section.cool-list2 ol ol { + margin: 0 0 0 2em; /* Add some left margin for inner lists */ +} +section.cool-list2 ol li em { + position: relative; + display: block; + padding: 0.4em 0.4em 0.4em 0.8em; + margin: 0.5em 0 0.5em 2.5em; + background: #ddd; + color: #444; + text-decoration: none; + transition: all 0.3s ease-out; + font-style: normal; +} +section.cool-list2 ol li em:hover { + background: #eee; + font-weight: bolder; +} +section.cool-list2 ol li em:before { + content: counter(li); + counter-increment: li; + position: absolute; + left: -2.5em; + top: 50%; + margin-top: -1em; + /* background: #fa8072; */ + background: var(--lighter-color); + height: 2em; + width: 2em; + line-height: 2em; + text-align: center; + font-weight: bold; +} +section.cool-list2 ol li em:after { + position: absolute; + content: ""; + border: 0.5em solid transparent; + left: -1em; + top: 50%; + margin-top: -0.5em; + transition: all 0.3s ease-out; +} +section.cool-list2 ol li em:hover:after { + left: -0.5em; + /* border-left-color: #fa8072; */ + border-left-color: var(--lighter-color); +} +/* Lists inside lists */ +section.cool-list2 ol ol { + margin: 0 0 0 2em; /* Add some left margin for inner lists */ + font-size: 75%; + counter-reset: li2; /* Initiate a counter */ +} +section.cool-list2 ol ol > li > em:before, +section.cool-list2 ol ol > li > a:before { + content: counter(li2); + counter-increment: li2; + background: lightgray; +} +section.cool-list2 ol ul { + list-style-type: disc; + margin: 0 0 0 1em; + font-size: 75%; +} +section.cool-list2 ol ol em { + background: #efefef; +}