[–] 2 points 1 month ago

For my server, secure enough. Just the basic recommendations, non-standard ssh port, default deny on firewall, fail2ban, etc. It doesn't need a lot of security because its just a static website. For most projects this is enough.

I will say, a honeypot can be useful and I'm getting one set up but its a low priority for me.

  • source
  • [–] [S] 2 points 8 months ago* (3 children)

    Yeah, its running a website. All ports are on default deny except 22, 80, 443, and 9050. 9050 is for the onion version of the site, and 80 auto-redirects to the https version of the site. 22 is rate limited to help protect against brute-force attacks. The requests are coming from multiple IPs, some of them are 117.72.47.192, 172.71.184.89, and 162.158.87.100. the one that sent that specific packet is 82.147.85.33 and no user agent is provided. Most of the malicious packets have user agents attached, but that specific one doesn't I also am seeing another weird one sent by 138.197.16.14

    "238\x00ll|'|'|SGFjS2VkX0Q3NUU2QUFB|'|'|WIN-QZN7FJ7D1O|'|'|Administrator|'|'|19-11-28|'|'||'|'|Win 10 Pro x64|'|'|No|'|'|S17|'|'|..|'|'|SW5ib3ggLSBPdXRsb29rIERhdGEgRmlsZSAtIE1pY3Jvc29mdCBPdXRsb29rAA==|'|'|" 400 166 "-" "-"
    
  • source
  • parent
  • context
  •  

    So I'm the server admin and web developer for my school's robotics team. I look through the servers access logs every once in a while just to check on things. I keep seeing requests that look like someone's scanning for vulns. But I'm seeing something I've never seen before. It looks like someone is sending requests in machine code and I have no idea why or what it would do???

    here's the request:

    "\x03\x00\x00\x13\x0E\xE0\x00\x00\x00\x00\x00\x01\x00\x08\x00\x02\x00\x00\x00" 400 166 "-" "-"
    
    [–] [S] 1 point 9 months ago (7 children)

    I got a piece of code from c/programming that works Using body:has(#theme-toggle:checked)

    I prefer doing it that way because I use a browser with anti-fingerprinting which hides the preferred theme so prefers-color-scheme doesn't work as well

  • source
  • parent
  • context
  • [–] [S] 2 points 9 months ago* (5 children)

    I already have a dark theme set, I'm using catppuccin's colors What I'm trying to have it do is when a button is pressed, it switches to the light version of it

    currently my code looks something like this:

    #theme-toggle:checked ~ body {
      background-color: #eff1f5;
      color: #fff;
    }
    
    #theme-toggle:checked ~ html {
      background-color: #eff1f5;
    }
    
    #theme-toggle:checked ~ .content {
      background-color: #eff1f5;
    }
    

    the button itself is a checkbox that has display set to none and the label set as an svg so when you click the icon, it gets checked.

    <input style="display: none;" type="checkbox" id="theme-toggle">
                    <label for="theme-toggle" class="theme-button">
                        <img class="theme-button-svg" src="./icons/half-moon.svg">
                    </label>
    

    I used a similar strategy when making the menu for the site so I know it should work

  • source
  • parent
  • context
  •  

    cross-posted from: https://lemmy.dbzer0.com/post/62659556

    Edit: I managed to get it working by using :has and nesting css classes!

    body:has(#theme-toggle:checked) {
      background-color: #eff1f5;
      .content {
        color: #4c4f69;
      }
      .header {
        color: #8839ef
      }
      .nav {
        background-color: #dce0e8;
        color: #4c4f69;
      }
    }
    

    I'm making a website for my school's robotics team and I'm trying to create a dark theme toggle but it's just not working. I'm trying to avoid javascript and I've seen this kind of thing done with only css and html before so I know it's possible. any advice?

    repo: https://github.com/WrenHavoc/JudgeMent-Call-Website

    edit: currently my code looks something like this:

    #theme-toggle:checked ~ body {
      background-color: #eff1f5;
      color: #fff;
    }
    
    #theme-toggle:checked ~ html {
      background-color: #eff1f5;
    }
    
    #theme-toggle:checked ~ .content {
      background-color: #eff1f5;
    }
    

    the button itself is a checkbox that has display set to none and the label set as an svg so when you click the icon, it gets checked.

    <input style="display: none;" type="checkbox" id="theme-toggle">
                    <label for="theme-toggle" class="theme-button">
                        <img class="theme-button-svg" src="./icons/half-moon.svg">
                    </label>
    

    I used a similar strategy when making the menu for the site so I know it should work

    .menu {
      position:absolute;
      margin:0%;
      right:20px;
      top:20px;
    }
    
    .menu-button {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 30px;
      height: 22px;
      cursor: pointer;
      z-index: 2; /* above menu */
    }
    
    .menu-button span {
      display: block;
      height: 4px;
      background-color: #cba6f7;
      border-radius: 2px;
      transition: all 0.3s ease;
    }
    
    .menu-items {
      top: 30px;
      right: -20px;
      width: 200px;
      background-color: #181825;
      position: absolute;
      display: none;
    }
    
    .menu-items li {
      margin: 20px 0;
    }
    
    .menu-items a {
      text-decoration: none;
      color: #cba6f7;
      font-size: 18px;
      padding:5px;
    }
    
    .menu-items a:hover {
      text-decoration: none;
      background-color: #cba6f7;
      color: #181825;
      font-size: 18px;
    }
    
    .menu-selected {
      text-decoration: underline;
      text-decoration-color: #cdd6f4;
      text-decoration-thickness: 3px;
    }
    
    .menu-selected:hover {
      text-decoration-color: #181825;
    }
    
    #menu:checked ~ .menu-items {
      display: inline;
    }
    
    #menu:checked + .menu-button span:nth-child(1) {
      transform: rotate(45deg) translate(5px, 7.5px);
    }
    #menu:checked + .menu-button span:nth-child(2) {
      opacity: 0;
    }
    #menu:checked + .menu-button span:nth-child(3) {
      transform: rotate(-45deg) translate(5px, -7.5px);
    }
    
    <input style="display: none;" type="checkbox" id="menu">
                    <label for="menu" class="menu-button">
                        <span></span>
                        <span></span>
                        <span></span>
                    </label>
    
     

    Edit: I managed to get it working by using :has and nesting css classes!

    body:has(#theme-toggle:checked) {
      background-color: #eff1f5;
      .content {
        color: #4c4f69;
      }
      .header {
        color: #8839ef
      }
      .nav {
        background-color: #dce0e8;
        color: #4c4f69;
      }
    }
    

    I'm making a website for my school's robotics team and I'm trying to create a dark theme toggle but it's just not working. I'm trying to avoid javascript and I've seen this kind of thing done with only css and html before so I know it's possible. any advice?

    repo: https://github.com/WrenHavoc/JudgeMent-Call-Website

    edit: currently my code looks something like this:

    #theme-toggle:checked ~ body {
      background-color: #eff1f5;
      color: #fff;
    }
    
    #theme-toggle:checked ~ html {
      background-color: #eff1f5;
    }
    
    #theme-toggle:checked ~ .content {
      background-color: #eff1f5;
    }
    

    the button itself is a checkbox that has display set to none and the label set as an svg so when you click the icon, it gets checked.

    <input style="display: none;" type="checkbox" id="theme-toggle">
                    <label for="theme-toggle" class="theme-button">
                        <img class="theme-button-svg" src="./icons/half-moon.svg">
                    </label>
    

    I used a similar strategy when making the menu for the site so I know it should work

    .menu {
      position:absolute;
      margin:0%;
      right:20px;
      top:20px;
    }
    
    .menu-button {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 30px;
      height: 22px;
      cursor: pointer;
      z-index: 2; /* above menu */
    }
    
    .menu-button span {
      display: block;
      height: 4px;
      background-color: #cba6f7;
      border-radius: 2px;
      transition: all 0.3s ease;
    }
    
    .menu-items {
      top: 30px;
      right: -20px;
      width: 200px;
      background-color: #181825;
      position: absolute;
      display: none;
    }
    
    .menu-items li {
      margin: 20px 0;
    }
    
    .menu-items a {
      text-decoration: none;
      color: #cba6f7;
      font-size: 18px;
      padding:5px;
    }
    
    .menu-items a:hover {
      text-decoration: none;
      background-color: #cba6f7;
      color: #181825;
      font-size: 18px;
    }
    
    .menu-selected {
      text-decoration: underline;
      text-decoration-color: #cdd6f4;
      text-decoration-thickness: 3px;
    }
    
    .menu-selected:hover {
      text-decoration-color: #181825;
    }
    
    #menu:checked ~ .menu-items {
      display: inline;
    }
    
    #menu:checked + .menu-button span:nth-child(1) {
      transform: rotate(45deg) translate(5px, 7.5px);
    }
    #menu:checked + .menu-button span:nth-child(2) {
      opacity: 0;
    }
    #menu:checked + .menu-button span:nth-child(3) {
      transform: rotate(-45deg) translate(5px, -7.5px);
    }
    
    <input style="display: none;" type="checkbox" id="menu">
                    <label for="menu" class="menu-button">
                        <span></span>
                        <span></span>
                        <span></span>
                    </label>
    
    view more: next ›