Home Explore Help
Register Sign In
Uninphogogs
/
daocha_web
1
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Tree: 1c47ab2a8a
Branches Tags
daocha_web
/
public
/
assets
/
esri
/
themes
/
base
/
widgets
/
_FeatureContent.scss

_FeatureContent.scss 2.1 KB
History Raw

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293 
  1. $content-height--loading: 150px !default;
    2. 

  2. 

  3. @mixin featureContent() {
    4. 

  4.   .esri-feature-content__loader-container {
    5. 

  5.     height: $content-height--loading;
    6. 

  6.     padding: 0;
    7. 

  7.     display: flex;
    8. 

  8.     align-items: center;
    9. 

  9.     justify-content: center;
    10. 

  10.   }
    11. 

  11.   .esri-feature-content__loader {
    12. 

  12.     height: 64px;
    13. 

  13.     width: 100%;
    14. 

  14.     background: url(../base/images/loading-throb.gif) no-repeat center center;
    15. 

  15.   }
    16. 

  16.   .esri-feature-content {
    17. 

  17.     font-size: $font-size;
    18. 

  18.   }
    19. 

  19.   .esri-feature-content h1,
    20. 

  20.   .esri-feature-content h2,
    21. 

  21.   .esri-feature-content h3,
    22. 

  22.   .esri-feature-content h4,
    23. 

  23.   .esri-feature-content h5,
    24. 

  24.   .esri-feature-content h6 {
    25. 

  25.     color: $font-color;
    26. 

  26.     margin: 0.5em 0 0.5em 0;
    27. 

  27.     letter-spacing: 0;
    28. 

  28.     font-weight: $font-weight__heading;
    29. 

  29.     line-height: normal;
    30. 

  30.   }
    31. 

  31.   .esri-feature-content h1 {
    32. 

  32.     font-size: 1.75em;
    33. 

  33.   }
    34. 

  34.   .esri-feature-content h2 {
    35. 

  35.     font-size: 1.5em;
    36. 

  36.   }
    37. 

  37.   .esri-feature-content h3 {
    38. 

  38.     font-size: 1.25em;
    39. 

  39.   }
    40. 

  40.   .esri-feature-content h4,
    41. 

  41.   .esri-feature-content h5,
    42. 

  42.   .esri-feature-content h6 {
    43. 

  43.     font-size: 1em;
    44. 

  44.   }
    45. 

  45.   .esri-widget__heading.esri-feature-element-info__title {
    46. 

  46.     color: $font-color;
    47. 

  47.     font-size: $font-size__h1;
    48. 

  48.     font-weight: $font-weight--regular;
    49. 

  49.     margin-bottom: 0.2em;
    50. 

  50.     margin-top: 0;
    51. 

  51.   }
    52. 

  52. 

  53.   .esri-feature-element-info__description {
    54. 

  54.     font-size: $font-size__body;
    55. 

  55.     font-weight: $font-weight--regular;
    56. 

  56.     margin-bottom: $cap-spacing--three-quarters;
    57. 

  57.   }
    58. 

  58.   .esri-feature-content p {
    59. 

  59.     font-size: $font-size;
    60. 

  60.     line-height: normal;
    61. 

  61.     margin: 0 0 1.2em;
    62. 

  62.   }
    63. 

  63.   .esri-feature-content img {
    64. 

  64.     max-width: 100%;
    65. 

  65.     max-height: 100%;
    66. 

  66.     image-orientation: from-image;
    67. 

  67.   }
    68. 

  68.   .esri-feature-content figure {
    69. 

  69.     padding: 0;
    70. 

  70.     margin: 0;
    71. 

  71.   }
    72. 

  72.   .esri-feature-content figcaption {
    73. 

  73.     font-size: $font-size--small;
    74. 

  74.     font-style: italic;
    75. 

  75.     padding: 0;
    76. 

  76.     margin: 0.2em 0 0;
    77. 

  77.     display: block;
    78. 

  78.   }
    79. 

  79.   .esri-feature-content ul {
    80. 

  80.     margin-bottom: 1rem;
    81. 

  81.   }
    82. 

  82.   .esri-feature-content a {
    83. 

  83.     color: $interactive-font-color;
    84. 

  84.     &:hover,
    85. 

  85.     &:focus {
    86. 

  86.       color: $interactive-font-color--hover;
    87. 

  87.     }
    88. 

  88.   }
    89. 

  89. }
    90. 

  90. 

  91. @if $include_FeatureContent == true {
    92. 

  92.   @include featureContent();
    93. 

  93. }
    94.