{"version":3,"sources":["webpack:///./src/midone/views/alert/Main.vue","webpack:///./src/midone/views/alert/Main.vue?bdbd"],"names":["class","id","data-target","script","render"],"mappings":"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","file":"js/chunk-2d0ddfd2.fa52c792.js","sourcesContent":["<template>\n  <div>\n    <div class=\"intro-y flex items-center mt-8\">\n      <h2 class=\"text-lg font-medium mr-auto\">Alert</h2>\n    </div>\n    <div class=\"intro-y grid grid-cols-12 gap-6 mt-5\">\n      <!-- BEGIN: Basic Alert -->\n      <div class=\"col-span-12 lg:col-span-6\">\n        <div class=\"intro-y box\">\n          <div\n            class=\"flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5\"\n          >\n            <h2 class=\"font-medium text-base mr-auto\">Basic Alerts</h2>\n            <div\n              class=\"w-full sm:w-auto flex items-center sm:ml-auto mt-3 sm:mt-0\"\n            >\n              <div class=\"mr-3\">Show example code</div>\n              <input\n                data-target=\"#basic-alert\"\n                class=\"show-code input input--switch border\"\n                type=\"checkbox\"\n              />\n            </div>\n          </div>\n          <div id=\"basic-alert\" class=\"p-5\">\n            <div class=\"preview\">\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-1 text-white\">\n                Awesome simple alert\n              </div>\n              <div\n                class=\"rounded-md px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n              >\n                Awesome simple alert\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-9 text-white\">\n                Awesome simple alert\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-12 text-white\">\n                Awesome simple alert\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-6 text-white\">\n                Awesome simple alert\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-gray-200 text-gray-600\">\n                Awesome simple alert\n              </div>\n            </div>\n            <div class=\"source-code hidden\">\n              <button\n                data-target=\"#copy-basic-alert\"\n                class=\"copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300\"\n              >\n                <FileIcon class=\"w-4 h-4 mr-2\" /> Copy example code\n              </button>\n              <div class=\"overflow-y-auto h-64 mt-3\">\n                <Highlight id=\"copy-basic-alert\" class=\"source-preview\">\n                  <code\n                    class=\"text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10\"\n                  >\n                    <textarea>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-1 text-white\"\n                      >\n                        Awesome simple alert\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n                      >\n                        Awesome simple alert\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-9 text-white\"\n                      >\n                        Awesome simple alert\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-12 text-white\"\n                      >\n                        Awesome simple alert\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-6 text-white\"\n                      >\n                        Awesome simple alert\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n                      >\n                        Awesome simple alert\n                      </div>\n                    </textarea>\n                  </code>\n                </Highlight>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"intro-y box mt-5\">\n          <div\n            class=\"flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5\"\n          >\n            <h2 class=\"font-medium text-base mr-auto\">Icon Alerts</h2>\n            <div\n              class=\"w-full sm:w-auto flex items-center sm:ml-auto mt-3 sm:mt-0\"\n            >\n              <div class=\"mr-3\">Show example code</div>\n              <input\n                data-target=\"#icon-alert\"\n                class=\"show-code input input--switch border\"\n                type=\"checkbox\"\n              />\n            </div>\n          </div>\n          <div id=\"icon-alert\" class=\"p-5\">\n            <div class=\"preview\">\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-1 text-white\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" /> Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-9 text-white\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-12 text-white\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" /> Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-6 text-white\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n            </div>\n            <div class=\"source-code hidden\">\n              <button\n                data-target=\"#copy-icon-alert\"\n                class=\"copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300\"\n              >\n                <FileIcon class=\"w-4 h-4 mr-2\" /> Copy example code\n              </button>\n              <div class=\"overflow-y-auto h-64 mt-3\">\n                <Highlight id=\"copy-icon-alert\" class=\"source-preview\">\n                  <code\n                    class=\"text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10\"\n                  >\n                    <textarea>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-1 text-white\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-9 text-white\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-12 text-white\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-6 text-white\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                    </textarea>\n                  </code>\n                </Highlight>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"intro-y box mt-5\">\n          <div\n            class=\"flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5\"\n          >\n            <h2 class=\"font-medium text-base mr-auto\">\n              Additional Content Alerts\n            </h2>\n            <div\n              class=\"w-full sm:w-auto flex items-center sm:ml-auto mt-3 sm:mt-0\"\n            >\n              <div class=\"mr-3\">Show example code</div>\n              <input\n                data-target=\"#additional-content-alert\"\n                class=\"show-code input input--switch border\"\n                type=\"checkbox\"\n              />\n            </div>\n          </div>\n          <div id=\"additional-content-alert\" class=\"p-5\">\n            <div class=\"preview\">\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-1 text-white\">\n                <div class=\"flex items-center\">\n                  <div class=\"font-medium text-lg\">\n                    Awesome alert with additional info\n                  </div>\n                  <div\n                    class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                  >\n                    New\n                  </div>\n                </div>\n                <div class=\"mt-3\">\n                  Lorem Ipsum is simply dummy text of the printing and\n                  typesetting industry. Lorem Ipsum has been the industry's\n                  standard dummy text ever since the 1500s.\n                </div>\n              </div>\n              <div\n                class=\"rounded-md px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n              >\n                <div class=\"flex items-center\">\n                  <div class=\"font-medium text-lg\">\n                    Awesome alert with additional info\n                  </div>\n                  <div\n                    class=\"text-xs bg-gray-600 px-1 rounded-md text-white ml-auto\"\n                  >\n                    New\n                  </div>\n                </div>\n                <div class=\"mt-3\">\n                  Lorem Ipsum is simply dummy text of the printing and\n                  typesetting industry. Lorem Ipsum has been the industry's\n                  standard dummy text ever since the 1500s.\n                </div>\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-9 text-white\">\n                <div class=\"flex items-center\">\n                  <div class=\"font-medium text-lg\">\n                    Awesome alert with additional info\n                  </div>\n                  <div\n                    class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                  >\n                    New\n                  </div>\n                </div>\n                <div class=\"mt-3\">\n                  Lorem Ipsum is simply dummy text of the printing and\n                  typesetting industry. Lorem Ipsum has been the industry's\n                  standard dummy text ever since the 1500s.\n                </div>\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-12 text-white\">\n                <div class=\"flex items-center\">\n                  <div class=\"font-medium text-lg\">\n                    Awesome alert with additional info\n                  </div>\n                  <div\n                    class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                  >\n                    New\n                  </div>\n                </div>\n                <div class=\"mt-3\">\n                  Lorem Ipsum is simply dummy text of the printing and\n                  typesetting industry. Lorem Ipsum has been the industry's\n                  standard dummy text ever since the 1500s.\n                </div>\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-theme-6 text-white\">\n                <div class=\"flex items-center\">\n                  <div class=\"font-medium text-lg\">\n                    Awesome alert with additional info\n                  </div>\n                  <div\n                    class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                  >\n                    New\n                  </div>\n                </div>\n                <div class=\"mt-3\">\n                  Lorem Ipsum is simply dummy text of the printing and\n                  typesetting industry. Lorem Ipsum has been the industry's\n                  standard dummy text ever since the 1500s.\n                </div>\n              </div>\n              <div class=\"rounded-md px-5 py-4 mb-2 bg-gray-200 text-gray-600\">\n                <div class=\"flex items-center\">\n                  <div class=\"font-medium text-lg\">\n                    Awesome alert with additional info\n                  </div>\n                  <div\n                    class=\"text-xs bg-gray-600 px-1 rounded-md text-white ml-auto\"\n                  >\n                    New\n                  </div>\n                </div>\n                <div class=\"mt-3\">\n                  Lorem Ipsum is simply dummy text of the printing and\n                  typesetting industry. Lorem Ipsum has been the industry's\n                  standard dummy text ever since the 1500s.\n                </div>\n              </div>\n            </div>\n            <div class=\"source-code hidden\">\n              <button\n                data-target=\"#copy-additional-content-alert\"\n                class=\"copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300\"\n              >\n                <FileIcon class=\"w-4 h-4 mr-2\" /> Copy example code\n              </button>\n              <div class=\"overflow-y-auto h-64 mt-3\">\n                <Highlight\n                  id=\"copy-additional-content-alert\"\n                  class=\"source-preview\"\n                >\n                  <code\n                    class=\"text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10\"\n                  >\n                    <textarea>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-1 text-white\"\n                      >\n                        <div class=\"flex items-center\">\n                          <div class=\"font-medium text-lg\">\n                            Awesome alert with additional info\n                          </div>\n                          <div\n                            class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                          >\n                            New\n                          </div>\n                        </div>\n                        <div class=\"mt-3\">\n                          Lorem Ipsum is simply dummy text of the printing and\n                          typesetting industry. Lorem Ipsum has been the\n                          industry\\'s standard dummy text ever since the 1500s.\n                        </div>\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n                      >\n                        <div class=\"flex items-center\">\n                          <div class=\"font-medium text-lg\">\n                            Awesome alert with additional info\n                          </div>\n                          <div\n                            class=\"text-xs bg-gray-600 px-1 rounded-md text-white ml-auto\"\n                          >\n                            New\n                          </div>\n                        </div>\n                        <div class=\"mt-3\">\n                          Lorem Ipsum is simply dummy text of the printing and\n                          typesetting industry. Lorem Ipsum has been the\n                          industry\\'s standard dummy text ever since the 1500s.\n                        </div>\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-9 text-white\"\n                      >\n                        <div class=\"flex items-center\">\n                          <div class=\"font-medium text-lg\">\n                            Awesome alert with additional info\n                          </div>\n                          <div\n                            class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                          >\n                            New\n                          </div>\n                        </div>\n                        <div class=\"mt-3\">\n                          Lorem Ipsum is simply dummy text of the printing and\n                          typesetting industry. Lorem Ipsum has been the\n                          industry\\'s standard dummy text ever since the 1500s.\n                        </div>\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-12 text-white\"\n                      >\n                        <div class=\"flex items-center\">\n                          <div class=\"font-medium text-lg\">\n                            Awesome alert with additional info\n                          </div>\n                          <div\n                            class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                          >\n                            New\n                          </div>\n                        </div>\n                        <div class=\"mt-3\">\n                          Lorem Ipsum is simply dummy text of the printing and\n                          typesetting industry. Lorem Ipsum has been the\n                          industry\\'s standard dummy text ever since the 1500s.\n                        </div>\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-theme-6 text-white\"\n                      >\n                        <div class=\"flex items-center\">\n                          <div class=\"font-medium text-lg\">\n                            Awesome alert with additional info\n                          </div>\n                          <div\n                            class=\"text-xs bg-white px-1 rounded-md text-gray-800 ml-auto\"\n                          >\n                            New\n                          </div>\n                        </div>\n                        <div class=\"mt-3\">\n                          Lorem Ipsum is simply dummy text of the printing and\n                          typesetting industry. Lorem Ipsum has been the\n                          industry\\'s standard dummy text ever since the 1500s.\n                        </div>\n                      </div>\n                      <div\n                        class=\"rounded-md px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n                      >\n                        <div class=\"flex items-center\">\n                          <div class=\"font-medium text-lg\">\n                            Awesome alert with additional info\n                          </div>\n                          <div\n                            class=\"text-xs bg-gray-600 px-1 rounded-md text-white ml-auto\"\n                          >\n                            New\n                          </div>\n                        </div>\n                        <div class=\"mt-3\">\n                          Lorem Ipsum is simply dummy text of the printing and\n                          typesetting industry. Lorem Ipsum has been the\n                          industry\\'s standard dummy text ever since the 1500s.\n                        </div>\n                      </div>\n                    </textarea>\n                  </code>\n                </Highlight>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <!-- END: Basic Alert -->\n      <!-- BEGIN: Icon & Dismiss Alert -->\n      <div class=\"col-span-12 lg:col-span-6\">\n        <div class=\"intro-y box\">\n          <div\n            class=\"flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5\"\n          >\n            <h2 class=\"font-medium text-base mr-auto\">Icon & Dismiss Alerts</h2>\n            <div\n              class=\"w-full sm:w-auto flex items-center sm:ml-auto mt-3 sm:mt-0\"\n            >\n              <div class=\"mr-3\">Show example code</div>\n              <input\n                data-target=\"#icon-dismiss-alert\"\n                class=\"show-code input input--switch border\"\n                type=\"checkbox\"\n              />\n            </div>\n          </div>\n          <div id=\"icon-dismiss-alert\" class=\"p-5\">\n            <div class=\"preview\">\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-1 text-white\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" /> Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-9 text-white\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-12 text-white\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" /> Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-6 text-white\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n            </div>\n            <div class=\"source-code hidden\">\n              <button\n                data-target=\"#copy-icon-dismiss-alert\"\n                class=\"copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300\"\n              >\n                <FileIcon class=\"w-4 h-4 mr-2\" /> Copy example code\n              </button>\n              <div class=\"overflow-y-auto h-64 mt-3\">\n                <Highlight id=\"copy-icon-dismiss-alert\" class=\"source-preview\">\n                  <code\n                    class=\"text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10\"\n                  >\n                    <textarea>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-1 text-white\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-9 text-white\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-12 text-white\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-6 text-white\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                    </textarea>\n                  </code>\n                </Highlight>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"intro-y box mt-5\">\n          <div\n            class=\"flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5\"\n          >\n            <h2 class=\"font-medium text-base mr-auto\">Outline Alerts</h2>\n            <div\n              class=\"w-full sm:w-auto flex items-center sm:ml-auto mt-3 sm:mt-0\"\n            >\n              <div class=\"mr-3\">Show example code</div>\n              <input\n                data-target=\"#outline-alert\"\n                class=\"show-code input input--switch border\"\n                type=\"checkbox\"\n              />\n            </div>\n          </div>\n          <div id=\"outline-alert\" class=\"p-5\">\n            <div class=\"preview\">\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-1 text-theme-1 dark:text-theme-10 dark:border-theme-10\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                alert with icon <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-9 text-theme-9 dark:border-theme-9\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-12 text-theme-12 dark:border-theme-12\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                alert with icon <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-6 text-theme-6 dark:border-theme-6\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n                <xIcon class=\"w-4 h-4 ml-auto\" />\n              </div>\n            </div>\n            <div class=\"source-code hidden\">\n              <button\n                data-target=\"#copy-outline-alert\"\n                class=\"copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300\"\n              >\n                <FileIcon class=\"w-4 h-4 mr-2\" /> Copy example code\n              </button>\n              <div class=\"overflow-y-auto h-64 mt-3\">\n                <Highlight id=\"copy-outline-alert\" class=\"source-preview\">\n                  <code\n                    class=\"text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10\"\n                  >\n                    <textarea>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-1 text-theme-1 dark:text-theme-10 dark:border-theme-10\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-9 text-theme-9 dark:border-theme-9\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-12 text-theme-12 dark:border-theme-12\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border border-theme-6 text-theme-6 dark:border-theme-6\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                        <xIcon class=\"w-4 h-4 ml-auto\" />\n                      </div>\n                    </textarea>\n                  </code>\n                </Highlight>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"intro-y box mt-5\">\n          <div\n            class=\"flex flex-col sm:flex-row items-center p-5 border-b border-gray-200 dark:border-dark-5\"\n          >\n            <h2 class=\"font-medium text-base mr-auto\">Soft Color Alerts</h2>\n            <div\n              class=\"w-full sm:w-auto flex items-center sm:ml-auto mt-3 sm:mt-0\"\n            >\n              <div class=\"mr-3\">Show example code</div>\n              <input\n                data-target=\"#softcolor-alert\"\n                class=\"show-code input input--switch border\"\n                type=\"checkbox\"\n              />\n            </div>\n          </div>\n          <div id=\"softcolor-alert\" class=\"p-5\">\n            <div class=\"preview\">\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-14 text-theme-10\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" /> Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-18 text-theme-9\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-17 text-theme-11\"\n              >\n                <AlertCircleIcon class=\"w-6 h-6 mr-2\" /> Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-31 text-theme-6\"\n              >\n                <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n              <div\n                class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n              >\n                <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                Awesome alert with icon\n              </div>\n            </div>\n            <div class=\"source-code hidden\">\n              <button\n                data-target=\"#copy-softcolor-alert\"\n                class=\"copy-code button button--sm border flex items-center text-gray-700 dark:border-dark-5 dark:text-gray-300\"\n              >\n                <FileIcon class=\"w-4 h-4 mr-2\" /> Copy example code\n              </button>\n              <div class=\"overflow-y-auto h-64 mt-3\">\n                <Highlight id=\"copy-softcolor-alert\" class=\"source-preview\">\n                  <code\n                    class=\"text-xs p-0 rounded-md html pl-5 pt-8 pb-4 -mb-10 -mt-10\"\n                  >\n                    <textarea>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-14 text-theme-10\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 border text-gray-700 dark:text-gray-300 dark:border-dark-5\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-18 text-theme-9\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-17 text-theme-11\"\n                      >\n                        <AlertCircleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-theme-31 text-theme-6\"\n                      >\n                        <AlertOctagonIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                      <div\n                        class=\"rounded-md flex items-center px-5 py-4 mb-2 bg-gray-200 text-gray-600\"\n                      >\n                        <AlertTriangleIcon class=\"w-6 h-6 mr-2\" />\n                        Awesome alert with icon\n                      </div>\n                    </textarea>\n                  </code>\n                </Highlight>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <!-- END: Icon & Dismiss Alert -->\n    </div>\n  </div>\n</template>\n","import { render } from \"./Main.vue?vue&type=template&id=6101b340\"\nconst script = {}\nscript.render = render\n\nexport default script"],"sourceRoot":""}