Merge pull request #18 from dogeorg/donate-component

resources/blocks/prism/prism.css

@@ -1,3 +1,65 @@
 /* PrismJS 1.29.0
 https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript */
 code[class*=language-],pre[class*=language-]{color:#ccc;background:0 0;font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#2d2d2d}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.block-comment,.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#999}.token.punctuation{color:#ccc}.token.attr-name,.token.deleted,.token.namespace,.token.tag{color:#e2777a}.token.function-name{color:#6196cc}.token.boolean,.token.function,.token.number{color:#f08d49}.token.class-name,.token.constant,.token.property,.token.symbol{color:#f8c555}.token.atrule,.token.builtin,.token.important,.token.keyword,.token.selector{color:#cc99cd}.token.attr-value,.token.char,.token.regex,.token.string,.token.variable{color:#7ec699}.token.entity,.token.operator,.token.url{color:#67cdcc}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help}.token.inserted{color:green}
+
+
+code[class*="language-"],
+pre[class*="language-"] {
+  color: #abb2bf;
+  background: #282c34;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: #5c6370;
+}
+
+.token.punctuation {
+  color: #abb2bf;
+}
+
+.token.selector,
+.token.tag {
+  color: #e06c75;
+}
+
+.token.property,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.attr-name,
+.token.deleted {
+  color: #d19a66;
+}
+
+.token.string,
+.token.char,
+.token.attr-value,
+.token.builtin,
+.token.inserted {
+  color: #98c379;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #56b6c2;
+}
+
+.token.atrule,
+.token.keyword {
+  color: #c678dd;
+}
+
+.token.function {
+  color: #61afef;
+}
+
+.token.class-name {
+  color: #e5c07b;
+}

src/components/doge-donate/demo/demo.css

@@ -0,0 +1,68 @@
+span.note {
+  display: block;
+  font-size: 1rem;
+  margin: 0.5em 0;
+}
+
+.container {
+  margin: 0px auto;
+  max-width: 800px;
+  background-color: #fff;
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  grid-gap: 40px;
+  padding: 20px;
+}
+
+.box {
+  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-family: sans-serif;
+  border-radius: 8px;
+  background-color: #fff;
+}
+
+.box span {
+  padding: 10px;
+  margin-top: 15px;
+  font-weight: 500;
+  color: #666;
+}
+
+/* Theme showcase section */
+.theme-examples {
+  display: grid;
+  grid-template-columns: 1fr;
+  gap: 40px;
+  margin: 20px 0;
+}
+
+.theme-example {
+  padding: 20px;
+  background-color: #f9f9f9;
+  border-radius: 8px;
+}
+
+/* Code container styles */
+#CodeContainer .code-toolbar {
+  display: none;
+}
+
+#CodeContainer .code-toolbar:first-child {
+  display: block;
+}
+
+/* Responsive adjustments */
+@media (max-width: 800px) {
+  .container {
+    padding: 10px;
+    grid-template-columns: 1fr;
+  }
+
+  .box {
+    margin: 10px 0;
+  }
+}