小编god*_*rry的帖子

* {
  user-select: none;
}

input {
  user-select: text;
}

.buggy * {
  user-select: none;
}

.buggy input { …

.login-modal {
    background: white;
    box-sizing: border-box;
    --main-bg-color: rgb(70, 119, 139);
    display: grid;
    /* grid-auto-rows: minmax(20px, auto); */
    grid-auto-columns: minmax(120px, 180px);
    top: 10px;
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    overflow: hidden;
    border-radius: 7px;
    color: var(--main-bg-color);
    font-family: "Open Sans", sans-serif;
    border: 1px solid var(--main-bg-color);
    z-index: 1999;
  }


  #login-window-small.login-modal ul {
    padding: 0;
    margin: 0;
  }

  #login-window-small.login-modal li {
    list-style-type: none;
    margin: .5em;
  }

  #login-window-small.login-modal a {
    text-decoration: none;
    color: var(--main-bg-color);
  }

  .modal-head {
    display: flex;
    align-items: center;
    color: …

import { EventEmitter, Directive, ElementRef, Renderer2, OnInit } from '@angular/core';
import { HostListener } from "@angular/core";
import { Component, Input, Output, Inject, PLATFORM_ID, ViewChild, ViewEncapsulation } from "@angular/core";
import { isPlatformBrowser, isPlatformServer } from '@angular/common';
import { AfterViewInit } from '@angular/core/src/metadata/lifecycle_hooks';

@Directive({
  selector: '[animateOnVisible]',
})
export class AnimateOnVisibleDirective implements AfterViewInit {

  @Input() animateOnVisible: string = "fadeInUp";
  @Output() enteredViewport: EventEmitter<string> = new EventEmitter();
  public isBrowser: boolean;
  private enableListener: boolean = true;

  constructor(private renderer: …

box:nth-child(1):hover {
  transform: perspective(1000px) translate3d(0, 0, -100px);
}

box:nth-child(2):hover {
  transform: translate3d(0, 0, 100px) perspective(1000px);
}

box {
  padding: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: monospace;
  transition: transform .4s;
  background: rgba(255, 0, 0, 0.3);
  margin: 20px;
  font-size: 12px;
  perspective: 1000px;
  cursor: pointer;
}

box:nth-child(2) {
  background: rgba(0, 0, 255, 0.3);
}

<box>
  transform: perspective(1000px) translate3d(0,0,100px);
</box>
<box>
  transform: translate3d(0,0,100px) perspective(1000px);
</box>