Created app

.anvil_editor.yaml

@@ -0,0 +1,9 @@
+unique_ids:
+  forms: {}
+  modules: {}
+  server_modules: {}
+  assets:
+    theme.css: 7ZSDIIOITHVAXX7VLD5L3AV7M4QLWDAS
+    standard-page.html: ISUD2KOWJDEVMKNG645CQZA7LL3JPGM5
+    splash.html: IT47CKLN7JIJXASU4Q7NHSNVLE6SJ6K6
+    header.jpg: 7KSQKX6BX46N4HZVHNQ7B3PFT6UHIMAV

.gitignore

@@ -0,0 +1,4 @@
+*.pyc
+*.pyo
+__pycache__
+.anvil-data

__init__.py

@@ -0,0 +1,7 @@
+#
+# This repository is an Anvil app. Learn more at https://anvil.works/
+# To run the server-side code on your own machine, run:
+# pip install anvil-uplink
+# python -m anvil.run_app_via_uplink YourAppPackageName
+
+__path__ = [__path__[0]+"/server_code", __path__[0]+"/client_code"]

anvil.yaml

@@ -0,0 +1,5 @@
+allow_embedding: false
+package_name: Hello_San_Francisco_1
+name: Hello San Francisco 1
+runtime_options: {version: 2, client_version: '3', server_version: python3-sandbox}
+services: []

theme/assets/splash.html

@@ -0,0 +1,32 @@
+<div class="nav dark" anvil-drop-redirect=".header">
+  <div class="title" anvil-slot-repeat="title-top"></div>
+  <div class="title placeholder anvil-designer-only" anvil-if-slot-empty="title-top" anvil-drop-slot="title-top">Title here</div>
+
+  <div class="nav-right" anvil-drop-redirect=".nav-elt">
+    <div anvil-slot-repeat="nav-right" class="nav-elt">
+      <div anvil-drop-here class="drop-here"></div>
+    </div>
+    <div class="nav-elt placeholder anvil-designer-only" anvil-drop-slot="nav-right">
+      <i class="glyphicon glyphicon-plus"></i>
+    </div>
+  </div>
+
+</div>
+
+<div class="header" anvil-drop-redirect=">.placeholder">
+  <div anvil-slot-repeat="hero"></div>
+  <div anvil-if-slot-empty="hero" anvil-designer-only class="placeholder" anvil-drop-slot="hero">Headline here</div>
+</div>
+
+<div class="card" anvil-slot-repeat="default" anvil-drop-container>
+</div>
+
+<div class="card anvil-designer-only" anvil-if-slot-empty="default" anvil-drop-slot="default">
+  <center class="anvil-designer-only instructions placeholder">
+    <i class="fa fa-info-circle"></i> Add
+    a <img src="https://anvil.works/template-assets/column-panel-icon.png" style="height: 30px; margin-right: -7px; margin-top: -5px"> ColumnPanel component here.
+  </center>
+</div>
+
+<div anvil-drop-default anvil-drop-redirect=".card .placeholder, .card[anvil-drop-container]">
+</div>

theme/assets/standard-page.html

@@ -0,0 +1,38 @@
+<style>
+  body { 
+    background-color: #fff;
+  }
+</style>
+
+<div class="nav dark" anvil-drop-redirect=".header">
+  <div class="title" anvil-slot-repeat="title-top"></div>
+  <div class="title placeholder anvil-designer-only" anvil-if-slot-empty="title-top" anvil-drop-slot="title-top">Title here</div>
+
+  <div class="nav-right" anvil-drop-redirect=".nav-elt">
+    <div anvil-slot-repeat="nav-right" class="nav-elt">
+      <div anvil-drop-here class="drop-here"></div>
+    </div>
+    <div class="nav-elt placeholder anvil-designer-only" anvil-drop-slot="nav-right">
+      <i class="glyphicon glyphicon-plus"></i>
+    </div>
+  </div>
+
+</div>
+
+<div class="header" anvil-drop-redirect=".header .placeholder, .nav .placeholder, .nav .drop-here">
+  <div anvil-slot-repeat="hero"></div>
+  <div anvil-if-slot-empty="hero" anvil-designer-only anvil-drop-slot="hero" class="placeholder">Heading here</div>
+</div>
+
+<div class="body" anvil-slot-repeat="default" anvil-drop-container>
+</div>
+
+<div class="body anvil-designer-only" anvil-if-slot-empty="default" anvil-drop-slot="default">
+  <center class="anvil-designer-only instructions placeholder">
+    <i class="fa fa-info-circle"></i> Add
+    a <img src="https://anvil.works/template-assets/column-panel-icon.png" style="height: 30px; margin-right: -7px; margin-top: -5px"> ColumnPanel component here.
+  </center>
+</div>
+
+<div anvil-drop-default anvil-drop-redirect=".body .placeholder, .body[anvil-drop-container]">
+</div>

theme/assets/theme.css

@@ -0,0 +1,133 @@
+@import 'https://fonts.googleapis.com/css?family=Pacifico|Muktu+Malar';
+
+body {
+  background-color: %color:Background%;
+}
+
+a, a:visited {
+  color: %color:Accent 2%;
+}
+
+a:hover, a:focus, a:active {
+  color: %color:Accent 1%;
+}
+
+.nav {
+  padding-left: 20px;
+  padding-right: 20px;
+  font-family: "Muktu Malar", "Helvetica Neue", "Helvetica", sans-serif;
+}
+
+.nav.dark {
+  background-color: %color:Background%;
+  color: white;
+}
+
+.nav.dark a, .nav.dark a:visited {
+  color: white;
+}
+
+.nav.dark a:hover, .nav.dark a:active, .nav.dark a:focus {
+  color: #eee;
+}
+
+
+.nav .title {
+  display: inline-block;
+}
+
+.designer .nav-right {
+  float: right;
+}
+
+.designer .nav-elt {
+  display: inline-block;
+  vertical-align: top;
+  margin-left: 15px;
+  position: relative;
+}
+
+@media(min-width:768px) {
+  .nav-right {
+    float: right;
+  }
+
+  .nav-elt {
+      display: inline-block;
+      vertical-align: top;
+      margin-left: 15px;
+      position: relative;
+  }
+}
+
+.nav .placeholder {
+  padding: 7px 10px;
+  margin: 3px 0;
+  color: #888;
+  border: 2px dashed;
+}
+
+.nav.dark .placeholder {
+  color: #ccc;
+}
+
+.nav .placeholder {
+	visibility: hidden;
+}
+
+body.anvil-highlight .nav .placeholder {
+	visibility: visible;
+}
+
+.nav-elt .drop-here {
+	position: absolute;
+	top: 0;
+	left: -10px;
+	bottom: 0;
+	width: 5px;
+}
+
+.header {
+	padding: 10px 100px 30px;
+    padding-left: 10%;
+	padding-right: 10%;
+	min-height: 120px;
+	background: url(_/theme/header.jpg) center/cover;
+	font-family: 'Pacifico', cursive;
+	color: white;
+	font-size: 80px;
+    /*line-height: 1.2;*/
+}
+
+.header .placeholder {
+  border: 2px dashed #ddd;
+  color: #ddd;
+  padding: 20px;
+}
+
+.card {
+	margin: 50px 10px 50px;
+	background: %color:Card%;
+	padding: 30px;
+	color: #444;
+	max-width: 680px;
+}
+
+.card .placeholder {
+  border: 2px dashed #888;
+  padding: 20px;
+  text-align: center;
+}
+
+.body {
+  margin: 15px;
+}
+
+@media(min-width:700px) {
+	.card {
+		margin-left: auto;
+		margin-right: auto;
+		max-width: 680px;
+	}
+}
+

theme/parameters.yaml

@@ -0,0 +1,78 @@
+roles: []
+color_scheme:
+  preset_groups:
+  - name: Accent
+    options:
+    - name: Blue
+      colors:
+      - {name: Accent 1, color: '#2196F3'}
+      - {name: Accent 2, color: '#1976D2'}
+    - name: Orange
+      colors:
+      - {name: Accent 1, color: '#FF9800'}
+      - {name: Accent 2, color: '#F57C00'}
+    - name: Red
+      colors:
+      - {name: Accent 1, color: '#F44336'}
+      - {name: Accent 2, color: '#D32F2F'}
+    - name: Muted Red
+      colors:
+      - {name: Accent 1, color: '#d9534f'}
+      - {name: Accent 2, color: '#a94442'}
+    - name: Pink
+      colors:
+      - {name: Accent 1, color: '#E91E63'}
+      - {name: Accent 2, color: '#C2185B'}
+    - name: Purple
+      colors:
+      - {name: Accent 1, color: '#9C27B0'}
+      - {name: Accent 2, color: '#7B1FA2'}
+    - name: Deep Purple
+      colors:
+      - {name: Accent 1, color: '#673AB7'}
+      - {name: Accent 2, color: '#512DA8'}
+    - name: Indigo
+      colors:
+      - {name: Accent 1, color: '#3F51B5'}
+      - {name: Accent 2, color: '#303F9F'}
+    - name: Light Blue
+      colors:
+      - {name: Accent 1, color: '#03A9F4'}
+      - {name: Accent 2, color: '#0288D1'}
+    - name: Cyan
+      colors:
+      - {name: Accent 1, color: '#00BCD4'}
+      - {name: Accent 2, color: '#0097A7'}
+    - name: Teal
+      colors:
+      - {name: Accent 1, color: '#009688'}
+      - {name: Accent 2, color: '#00796B'}
+    - name: Green
+      colors:
+      - {name: Accent 1, color: '#4CAF50'}
+      - {name: Accent 2, color: '#388E3C'}
+    - name: Light Green
+      colors:
+      - {name: Accent 1, color: '#8BC34A'}
+      - {name: Accent 2, color: '#689F38'}
+    - name: Lime
+      colors:
+      - {name: Accent 1, color: '#CDDC39'}
+      - {name: Accent 2, color: '#AFB42B'}
+    - name: Deep orange
+      colors:
+      - {name: Accent 1, color: '#FF5722'}
+      - {name: Accent 2, color: '#E64A19'}
+    - name: Brown
+      colors:
+      - {name: Accent 1, color: '#795548'}
+      - {name: Accent 2, color: '#5D4037'}
+    - name: Grey
+      colors:
+      - {name: Accent 1, color: '#9E9E9E'}
+      - {name: Accent 2, color: '#616161'}
+  colors:
+  - {name: Accent 1, color: '#d9534f'}
+  - {name: Accent 2, color: '#a94442'}
+  - {name: Background, color: '#71798c'}
+  - {name: Card, color: '#FFFFFF'}

theme/templates.yaml

@@ -0,0 +1,36 @@
+- name: Standard Page
+  description: A page with an image header and optional navigation bar.
+  img: img/form-templates/hello-sf/std-page.png
+  form:
+    class_name: Form
+    is_package: true
+    container:
+      type: HtmlTemplate
+      properties: {html: '@theme:standard-page.html'}
+    components:
+    - type: ColumnPanel
+      properties: {}
+      name: content_panel
+      layout_properties: {slot: default}
+    code: "from ._anvil_designer import $NAME$Template\nfrom anvil import *\n\nclass\
+      \ $NAME$($NAME$Template):\n\n  def __init__(self, **properties):\n    # Set\
+      \ Form properties and Data Bindings.\n    self.init_components(**properties)\n\
+      \n    # Any code you write here will run when the form opens.\n    \n"
+- name: Splash
+  description: A page with a dark background, and a narrow white content area.
+  img: img/form-templates/hello-sf/splash.png
+  form:
+    class_name: Form
+    is_package: true
+    container:
+      type: HtmlTemplate
+      properties: {html: '@theme:splash.html'}
+    components:
+    - type: ColumnPanel
+      properties: {}
+      name: content_panel
+      layout_properties: {slot: default}
+    code: "from ._anvil_designer import $NAME$Template\nfrom anvil import *\n\nclass\
+      \ $NAME$($NAME$Template):\n\n  def __init__(self, **properties):\n    # Set\
+      \ Form properties and Data Bindings.\n    self.init_components(**properties)\n\
+      \n    # Any code you write here will run when the form opens.\n"