mrrobot071 / filmes

https://mrrobot071.github.io/filmes/

filmes's Issues

Melhorias

1. Responsividade:
   Certifique-se de que seu site seja responsivo, ou seja, que ele seja exibido adequadamente em dispositivos de diferentes tamanhos, como smartphones e tablets. Isso pode ser alcançado usando media queries no seu CSS.

2. Acessibilidade:
   Garanta que seu site seja acessível para pessoas com deficiências. Adicione atributos alt adequados para as imagens, use uma estrutura semântica apropriada e verifique se o site é navegável usando apenas o teclado.

3. Animações:
   Adicione transições ou animações para tornar a experiência do usuário mais agradável. Por exemplo, você pode adicionar uma transição suave quando o menu é exibido ou oculto.

4. Carregamento Assíncrono:
   Considere carregar seus scripts JavaScript de forma assíncrona para melhorar o desempenho do carregamento da página.

5. Estilo Adicional:
   Adicione mais estilo ao seu site. Por exemplo, você pode experimentar diferentes fontes, cores ou layouts para tornar o design mais atraente.

6. Validação HTML e CSS:
   Valide seu código usando ferramentas online para garantir que ele esteja correto e siga as melhores práticas.

7. Comentários no Código:
   Adicione comentários ao seu código para explicar partes importantes, especialmente se outras pessoas (ou você mesmo no futuro) precisarem entender ou modificar o código.

8. Melhorias de SEO:
   Considere adicionar meta tags adequadas para melhorar a otimização de mecanismos de pesquisa (SEO). Por exemplo, meta tags de descrição e palavras-chave.

9. Testes Cruzados de Navegadores:
   Verifique se o seu site funciona corretamente em diferentes navegadores para garantir uma experiência consistente para os usuários.

10. Gestão de Erros:
    Implemente uma página de erro personalizada para lidar com situações em que o conteúdo do vídeo não pode ser carregado ou outros erros.

Melhorias

1. Semântica HTML:

   • Use elementos semânticos HTML5, como <nav>, <article>, <section>, etc., para tornar a estrutura mais semântica.

2. Redundância no JavaScript:

   • Você tem dois elementos com o mesmo ID (frameContainer). Os IDs devem ser únicos. Considere usar classes ou IDs distintos.

3. Estilos Inline e Externos:

   • Evite estilos inline sempre que possível. Mova-os para um arquivo externo ou coloque-os na tag <style> no head.

4. Repetição de Código:

   • Se houver repetição de código, considere encapsular a lógica em funções para promover a reutilização.

5. Carregamento Assíncrono:

   • Considere carregar recursos como scripts ou folhas de estilo de forma assíncrona ou adie a execução para melhorar o desempenho da página.

6. Responsividade:

   • Certifique-se de que a página seja totalmente responsiva para diferentes tamanhos de tela.

7. Acessibilidade:

   • Verifique se a página é acessível, usando tags semânticas, rótulos para formulários, e certifique-se de que todos os elementos sejam navegáveis e utilizáveis por pessoas com deficiência.

8. Comentários no Código:

   • Adicione comentários no código para explicar seções complexas ou lógica específica.

series

<title>Sua Página</title> <style> body { margin: 0; padding: 0; }

    .index-container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        background-color: #f0f0f0; /* Cor de fundo opcional para a tela de índice */
    }

    section {
        text-align: center;
    }

    #overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.8);
        justify-content: center;
        align-items: center;
        z-index: 1; /* Garante que o overlay esteja acima do conteúdo anterior */
    }

    #episodeList {
        list-style: none;
        padding: 20px;
        background-color: #fff;
        border-radius: 10px;
        text-align: left;
    }

    #episodeList li {
        margin-bottom: 10px;
    }

    #episodeList a {
        text-decoration: none;
        color: #333;
        display: block;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 5px;
    }
</style>

• Episódio 1
• Episódio 2
• Episódio 3
• Episódio 4
• Episódio 5
• Episódio 6
• Episódio 7
• Episódio 8

<script> function toggleEpisodeOptions(event) { var episodeList = document.getElementById("episodeList"); var overlay = document.getElementById("overlay"); episodeList.style.display = (episodeList.style.display === 'none' || episodeList.style.display === '') ? 'block' : 'none'; overlay.style.display = (overlay.style.display === 'none' || overlay.style.display === '') ? 'flex' : 'none'; } </script>

Upgrade

<title>LUCFLIX</title> <style> body { margin: 0; padding: 0; background-color: #31075e; color: white; font-family: Arial, sans-serif; } header { background-color: black; text-align: center; padding: 15px 0 5px; } .logo { font-size: 2em; font-weight: bold; letter-spacing: 2px; text-transform: uppercase; color: red; } /* Estilos padrão para .media */ .media { width: calc(20% - 20px); margin: 10px; box-sizing: border-box; cursor: pointer; } @media (max-width: 1024px) { /* Estilos para telas menores ou iguais a 1024px com quatro colunas */ .media { width: calc(25% - 20px); } } @media (max-width: 768px) { /* Estilos para telas menores ou iguais a 768px com três colunas */ .media { width: calc(33.33% - 20px); } } @media (max-width: 480px) { /* Estilos para telas menores ou iguais a 480px com duas colunas */ .media { width: calc(50% - 20px); } } section { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 10px; } .media img { width: 100%; height: auto; } .hidden { display: none; } .frame-container { background: #4b0082; color: white; font-family: Hanuman, Ruda, sans-serif; font-size: 15px; padding: 10px; position: relative; /* Adicionado para posicionar os botões */ } .container { position: fixed; top: 10px; right: 5%; z-index: 9996; } .reset-button { width: 40px; height: 40px; background-color: #001F3F; /* Add a semicolon here */ border: none; border-radius: 50%; position: fixed; top: 5%; right: 1.5%; z-index: 9999; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 15px; color: white; } } </style>

LucFlix

Filmes e Séries

Filmes Séries Animes

<style> /* Adicione estilos para os botões de categoria */ .category-buttons { display: flex; justify-content: center; margin-top: 14px; /* Espaçamento do topo */ }

.category-button {
  width: 95px;
  height: 40px;
  background-color: black;  
  border: none;
  border-radius: 20px;
  margin-right: 5px; /* Espaçamento entre os botões */
  cursor: pointer;
  font-size: 15px;
  color: white;
} 

#seriesSection,
#animationsSection {
display: none;
}
</style>

<script> // Adicione a função para selecionar a categoria function selectCategory(category) { // Lógica para selecionar a categoria e realizar a ação desejada // Pode adicionar mais lógica conforme necessário console.log(`Categoria selecionada: ${category}`); } </script>

<iframe id="EmbedderContainer" width="100%" height="100%" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

<!-- Adicione um ícone de recarregar ao botão -->

<iframe id="EmbedderContainer" width="100%" height="100%" allowfullscreen="allowfullscreen" frameborder="0"></iframe>

<script> function resetPage() { // Redirecionar para o site de filmes window.location.href = 'https://mrrobot071.github.io/filmes/'; } function showFrame(src) { const frameContainer = document.getElementById("frameContainer"); const embedderContainer = document.getElementById("EmbedderContainer"); // Adicione estilos ao iframe embedderContainer.style.width = "740px"; embedderContainer.style.height = "360px"; embedderContainer.style.background = "#4b0082"; embedderContainer.style.color = "white"; embedderContainer.style.fontFamily = "Hanuman, Ruda, sans-serif"; embedderContainer.style.fontSize = "15px"; // Centralize o frameContainer na tela frameContainer.style.display = "flex"; frameContainer.style.alignItems = "center"; frameContainer.style.justifyContent = "center"; frameContainer.style.position = "fixed"; frameContainer.style.top = "0"; frameContainer.style.left = "0"; frameContainer.style.width = "100%"; frameContainer.style.height = "100%"; frameContainer.style.backgroundColor = "rgba(0, 0, 0, 0.8)"; // Remover a classe 'hidden' frameContainer.classList.remove("hidden"); embedderContainer.src = src; } function selectCategory(categoria) { // Ocultar todas as seções document.getElementById("moviesSection").style.display = "none"; document.getElementById("seriesSection").style.display = "none"; document.getElementById("animationsSection").style.display = "none"; // Mostrar a seção selecionada document.getElementById(`${categoria}Section`).style.display = "flex"; } </script> <style> footer { background-color: black; color: white; text-align: center; padding: 10px; /* Ajuste conforme necessário */ } </style>

Desenvolvido por Lucas Nathan © 2023

Menu + créditos

<style> .menu-button { position: fixed; top: 20px; right: 20px; background-color: white; padding: 10px; border: 1px solid #000000; border-radius: 50%; cursor: pointer; z-index: 9999; }

    .menu-options {
        display: none;
        position: absolute;
        top: 70px;
        right: 20px;
        background-color: silver;
        border: 1px solid #000000;
        padding: 10px;
        z-index: 9999;
    }

    .menu-options a {
        display: block;
        margin-bottom: 10px;
        text-decoration: none;
        z-index: 9999;
    }

    .credits {
        position: absolute;
        bottom: 10px;
        right: 10px;
        font-family: Arial, sans-serif;
        font-size: 10px;
        color: black;
    }
</style>
<script>
    function toggleMenu() {
        var menu = document.getElementById("menu");
        if (menu.style.display === "block") {
            menu.style.display = "none";
        } else {
            menu.style.display = "block";
        }
    }
</script>

<div class="menu-button" onclick="toggleMenu()">☰</div>
<div class="menu-options" id="menu">
    <a href="https://mrrobot071.github.io/0/">Site</a>
    <a href="https://www.instagram.com/071lkz/">Instagram</a>
    <a href="https://wa.me/557192920032">WhatsApp</a>
    <a href="https://github.com/Mrrobot071">GitHub</a>
</div>

<div class="credits">
    By: Lucas Nathan | Insta: <a href="https://instagram.com/071lkz" style="color: red; text-decoration: underline;">instagram.com/071lkz</a>
</div>

Créditos + Redes

<title>Sua Página</title> <style> body { margin: 0; padding: 0; }

footer {
  background-color: black;
  color: white;
  text-align: center;
  padding: 10px;
}

.social-icons a {
  color: white;
  margin: 0 10px;
  text-decoration: none;
}

</style>

Desenvolvido por Lucas Nathan © 2023

Inframe

<iframe allowfullscreen="" frameborder="0" height="400" name="Player" scrolling="no" src="https://embed.warezcdn.net/filme/tt0133093" style="background-attachment: initial; background-clip: initial; background-image: initial; background-origin: initial; background-position: 0px 0px; background-repeat: initial; background-size: initial; border-style: initial; border-width: 0px; color: white; font-family: Hanuman, Ruda, sans-serif; font-size: 15px; font-weight: 400; max-width: 100%; outline: 0px; padding: 0px; text-align: start; vertical-align: baseline;" width="640"></iframe>