vani

About me:

/*==========⚠️========== * para los colores, vaya a https://htmlcolorcodes.com/color-names * para fuentes, vaya a https://fonts.google.com * para los cursores, vaya a https://icons8.com , https://custom-cursor.com , https://www.cursors-4u.com =============⚠️==========*/ /* cursores */ a:hover { cursor: url('https://cur.cursors-4u.net/cursors/cur-7/cur668.cur'), auto; } * { cursor: url('https://cur.cursors-4u.net/cursors/cur-7/cur671.cur'), auto; } @import url('https://fonts.googleapis.com/css2? familia=Gotu&display=swap'); :root { --headers: #ec5a5a; --texto: rosa; --nombres: #ec5a5a; --enlaces: rosa; --hover: #f3d7d7; --fronteras: 1px sólido #f3d7d7 ! importante; --background_image: url("https://i.imgur.com/6zCbRs2.png"); --font-family: 'Gotu', sans-serif; --curva: 0px; --simple_bg: #ffffff; } principal .left { relleno a la derecha: 20px; } .url-info {display: ¡note! importante;} /* para ocultar la url */ .blurbs .heading{display: ¡ninguno! importante;} /* para ocultar el encabezado de la propaganda */ h3, h4, h5, .url-info b {color: var(--headers) ! importante;} /* encabezados*/ a {color: var(--links) ! importante;} /* color de los enlaces */ a:hover {color: var(--hover) ! importante;} /* color de los enlaces al sobresalar */ p, h2 {color: var(--text) ! importante;} /* color del texto */ h1, .friends a p {color: var(--names) ! importante;} /* color de los nombres y contador de amigos */ h1, .friends a:hover p {color: var(--hover) ! importante;} /* color de los nombres al pasar el motador */ etiqueta de navegación {color: var(--links) ! importante;} /* color de búsqueda */ .sección h4 {color: var(--headers) ! important; text-align: center;} /* aboutme & want2meet headings */ .comment-reply:not(:first-child) {border-top: 3px double hotpink;} /* línea entre respuestas de comentarios*/ .count {color: #f3d7d7;} /* decoración de texto */ a:hover, a:active, .blog-entry .kudos-btn:hover, .blog-entry .kudos-btn:active { decoración del texto: subrayado; estilo de decoración de texto: ondulado; } .logout-btn:hover, .logout-btn:active { decoración del texto: subrayado; estilo de decoración de texto: ondulado; } nav .top a:hover { decoración del texto: subrayado; estilo de decoración de texto: ondulado; } nav .links a:hover { decoración del texto: subrayado; estilo de decoración de texto: ondulado; } /* familia de fuentes */ h2, h3, h4, h5, a, p, etiqueta de nav, .sección { font-family: var(--font-family) ! importante; tamaño de la fuente: ¡12px! importante; } /* relleno y margen */ .icon { frontera: ¡ningena! importante; } .blurbs { margen superior: ¡10px! importante; margen inferior: ¡30px! importante } .amigos { margen superior: -10px ! importante; margen inferior: ¡30px! importante } .profile-info { radio de la frontera: var(--curva) ! importante; } .comment-respuestas { borde: 5px rosa punteado; } .comments-table { radio de la frontera: var(--curva) ! importante; frontera: ¡ningena! importante; } .table-section { fondo de relleno: ¡7px! importante; margen superior: ¡30px! importante } #comentarios { margen superior: ¡5px! importante; fondo de relleno: ¡5px! importante } .details p:last-child { color: var(--links) ! importante; filtro: brillo (95 %); } .mood { margen superior: 20px; } /* imagen de fondo */ cuerpo { imagen de fondo: var(--background_image) ! importante; color de fondo: ¡blanco! importante; repetición de fondo: repetir; tamaño de fondo: 120px; } /* navegación */ /* cambiar el color del logotipo en https://codepen.io/sosuke/pen/Pjoqqp */ nav { fondo: blanco; sombra de caja: calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3; margen inferior: 30px; frontera: var(--fronteras); } nav .top { fondo: rgba(0, 0, 0, 0.0); } nav .top a { color: ¡rosa! importante; } nav .links { fondo: ¡transparente! importante; alineación de texto: centro; } nav .links a{ texto-sombra:ninguno; } nav img.logo { filtro: brillo(0) saturado (100%) invertir (76%) sepia (42%) saturado(432%) tono-rotación(305 grados) brillo (104%) contraste (105%); ! importante; } nav .links li:not(:last-child)::after, pie de página .links li:not(:last-child)::after { contenido: " | "; color: var(--headers); } /*============== colorea la barra de búsqueda y el botón =====================*/ .search-wrapper input[type=text] { color de fondo: rgba(0, 0, 0, 0.0) ! importante; borde: ¡2px rosa sólido! importante; color: ¡rosa! importante; radio de la frontera: 0px ! importante; } botón { radio de la frontera: 0px ! importante; borde: 0px rosa sólido! importante; font-family: var(--font-family) ! importante; color de fondo: rgba(0, 0, 0, 0.0) ! importante; color: ¡rosa! importante; } /*================ icono en línea ===================*/ .online { contenido: url (https://dl.glitter-graphics.com/pub/272/272679lz7b9hcea1.gif); } /*============== nombre del perfil ===================*/ h1 { relleno a la izquierda: ¡20px! importante; familia de fuentes: 'Gotu', sans-serif; tamaño de fuente: ¡25px! importante; margen superior: -10px! importante; color: var(--links)! importante; } /*============= sombras de caja =====================*/ .mood, .blog-preview, .contact { margen inferior: 30px; sombra de caja: calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3; } .table-section, .blurbs, .friends { margen inferior: ¡30px! importante; sombra de caja: calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3; } .amigos { margen superior: ¡10px! importante; } .profile-info { fondo: blanco; frontera: var(--fronteras)! importante; pantalla: flexible; alinear elementos: centro; contenido de justificación: centro; relleno: 15px 5px; margen inferior: 30px; sombra de caja: calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3; } .profile-info .inner { peso de la fuente: negrita; alineación de texto: centro; } .contacto { fondo: blanco; relleno: 20px; margen inferior: ¡40px! importante; } principal { fondo: transparente; relleno: 6px 0px; } .profile-pic img { esquema: ¡ningeno! importante; frontera: ¡nada! importante; sombra de caja: calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3; } .friends-grid img { esquema: ¡ningeno! importante; filtro: opacidad (90 %) ! importante; radio de la frontera: var(--curva) ! importante; } td { color de fondo: ¡transparente! importante; } hr { borde-top: 1px rosa sólido; } .heading, .url-info, .blurbs, .friends, .table, .table-section, footer { radio de la frontera: var(--curva) ! importante; relleno: ¡2px! importante; frontera: var(--fronteras) ! importante; } .friends, .blurbs { fondo: blanco; } .mood, .contact, .blog-preview { radio de la frontera: var(--curva) ! importante; relleno: ¡2px! importante; frontera: var(--fronteras) ! importante; } .mood, .blog-preview { alineación de texto: centro; fondo: blanco; frontera: var(--fronteras) ! importante; } .table-section { frontera: var(--fronteras) ! importante; color de fondo: ¡blanco! importante; radio de la frontera: var(--curva) ! importante; } .heading { fondo: ¡transparente! importante; fondo de relleno: ¡4px! importante; tamaño del fondo: ¡100 % 100 %! importante; alineación de texto: centro; frontera: ¡nada! importante; } .comments-table { pantalla: bloquear; altura: 500px! importante; desbordamiento: desplazamiento; frontera: var(--fronteras) ! importante; esquema: ¡ningeno! importante; frontera: ¡nada! importante; } .comments-table td { imagen de fondo: url('') ! importante; tamaño del fondo: cubierta; frontera: var(--fronteras); } .comments-table td:first-child img { /* puedes recortar imágenes en https://bennettfeely.com/clippy y añadir el código aquí */ } pie de página { color: var(--text); alineación de texto: centro; tamaño de fuente: 60 %; margen: 10px 0 10px; relleno: 10px 5px; fondo: blanco; sombra de caja: calc((400px + (25px * 2)) * 0.025) calc((400px + (25px * 2)) * 0.025) #f6e3e3; } /* Forzar las barras de desplazamiento en la ventana del navegador */ /* Estilos de barra de desplazamiento */ ::-webkit-scrollbar { ancho: 5px; altura: 12px; } ::-webkit-scrollbar-track { radio de la frontera: 0px; ancho: 2px; borde: 1px de color rosa caliente punteado; } ::-webkit-scrollbar-thumb { fondo: rosa; radio de la frontera: 0px; } ::-webkit-scrollbar-thumb:hover { fondo: rosa caliente; } 👇👇 CODE FOR ONLY ROUND PROFILE !!!!!! 👇👇 CODE FOR ROUND + SPINNING !!!!! twilight sparkle: rainbowdash: pinkie pie: rarity: applejack: fluttershy:

Who I'd like to meet: