diff --git a/app.js b/app.js index 3b9a4a8..1a5fecf 100644 --- a/app.js +++ b/app.js @@ -6,11 +6,11 @@ import { html } from "https://esm.sh/htm/react"; import styled from 'https://esm.sh/styled-components?deps=react@18'; import { createElement as h, useState, useEffect, useRef } from 'https://esm.sh/react@18'; import { createRoot } from "https://esm.sh/react-dom/client"; - +/* import State01 from "./testdata-01.json" assert { type: "json" }; import State02 from "./testdata-02.json" assert { type: "json" }; import State03 from "./testdata-03.json" assert { type: "json" }; - +*/ const StyledRoot = styled.div` .Boxcast-Upper @@ -134,42 +134,27 @@ const StyledRoot = styled.div` display: block; width: 100%; padding: 5px 10px 5px 10px; - background: black; + background: #0e2a3f; cursor: pointer; border: none; color: white; font-size: 14px; font-weight: 600; transition: all 0.4s; + } + button:hover + { + border-radius: 50px; + } + button[disabled] + { + border-radius: 50px; + background: red !important; + } - &::before - { - content: " "; - display: block; - position: absolute; - top: 0px; - left: 0px; - width: 100%; - height: 100%; - border: 0px solid transparent; - outline: 0px solid red; - transition: all 0.4s; - } - } - button[disabled]::before - { - top: -5px; - left: -5px; - border: 5px solid transparent; - outline: 5px solid red; - } - button:hover::before - { - outline: 5px solid red; - } &.future button { - background: #aaa; + background: #c3b7a9; } @media(max-width:500px) @@ -358,11 +343,13 @@ const App = props =>