diff --git a/public/assets/img/logo.png b/public/assets/img/logo.png new file mode 100644 index 0000000..99dfa7e Binary files /dev/null and b/public/assets/img/logo.png differ diff --git a/public/assets/styles/base.css b/public/assets/styles/base.css index 9c9d752..2a49e9d 100644 --- a/public/assets/styles/base.css +++ b/public/assets/styles/base.css @@ -19,19 +19,19 @@ body { font-size: 0.85rem; } -h1 { - font-size: 1.49rem; +h1,.h1 { + font-size: 1.75rem; } -h2 { - font-size: 1.31rem; +h2,.h2 { + font-size: 1.35rem; } -h3 { - font-size: 1.13rem; +h3,.h3 { + font-size: 1.35rem; } -h4, h5, h6 { +h4, h5, h6,.h4,.h5,.h6 { font-size: 0.95rem; } @@ -414,4 +414,52 @@ span.think { .bubble img { max-width: 50px; max-height: 50px; -} \ No newline at end of file +} + +/*####################################*/ +.example-1, +.example-2 { + position: relative; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; +} + +.example-1 .inner, +.example-2 .inner { + position: relative; + z-index: 1; + width: 100%; +} +.example-2 .inner { + margin: 2px; +} +.example-2::before { + content: ""; + display: block; + background: linear-gradient( + 90deg, + rgba(255, 255, 255, 0) 0%, + rgba(102, 102, 102, 0.75) 50%, + rgba(255, 255, 255, 0) 100% + ); + height: 300px; + width: 100px; + transform: translate(0); + position: absolute; + animation: rotate 5s linear forwards infinite; + z-index: 0; + top: 50%; + transform-origin: top center; +} + +@keyframes rotate { + from { + transform: rotate(0); + } + + to { + transform: rotate(360deg); + } +} diff --git a/public/index.html b/public/index.html index e71f682..5b081ed 100644 --- a/public/index.html +++ b/public/index.html @@ -18,7 +18,12 @@
+
+